Hypoxic125/Sandbox – User

Creating a custom loading bar involves utilizing two images. A background image (typically desaturated) and a foreground image (full color).

Key things to establish before you develop your own loading bar:

• Where will your control be defined
• In what direction will the loading bar flow in

Required Images

You will need to have two images:

• Background Image: Desaturated
• Foreground Image: Full Color

These images will need to be converted from .png to .paa using TexView2

Building The Config

Define Pixel Grid Macros

#define pixelScale          0.5
#define GRID_X              safezoneX
#define GRID_Y              safezoneY
#define GRID_W              (pixelW * pixelGridNoUIScale * pixelScale)
#define GRID_H              (pixelH * pixelGridNoUIScale * pixelScale)
#define CENTER_X            ((getResolution select 2) * 0.5 * pixelW)
#define CENTER_Y            ((getResolution select 3) * 0.5 * pixelH)

Define Image Positions

#define IMAGE_X    0
#define IMAGE_Y    0
// IMAGE_W and IMAGE_H need to follow the aspect ratio of your image. This is for a 2:1 image.
#define IMAGE_W    50
#define IMAGE_H    25

Create Config

Import Base Classes

• Mission
• Addon

#define pixelScale          0.5
#define GRID_X              safezoneX
#define GRID_Y              safezoneY
#define GRID_W              (pixelW * pixelGridNoUIScale * pixelScale)
#define GRID_H              (pixelH * pixelGridNoUIScale * pixelScale)
#define CENTER_X            ((getResolution select 2) * 0.5 * pixelW)
#define CENTER_Y            ((getResolution select 3) * 0.5 * pixelH)

#define IMAGE_X    0
#define IMAGE_Y    0
// IMAGE_W and IMAGE_H need to follow the aspect ratio of your image. This is for a 2:1 image.
#define IMAGE_W    50
#define IMAGE_H    25

class TAG_MyDisplay {
	idd = -1;
	onLoad = "uiNamespace setVariable ['TAG_MyDisplay', _this select 0]";
	onUnload = "uiNamespace setVariable ['TAG_MyDisplay', nil]";

	class Controls {
		class BackgroundCtrl: RscPicture {
			idc = -1;
			x = IMAGE_X * GRID_W;
			y = IMAGE_Y * GRID_H;
			w = IMAGE_W * GRID_W;
			h = IMAGE_H * GRID_H;
			onLoad = "uiNamespace setVariable ['TAG_BackgroundCtrl', _this select 0]";
			onUnload = "uiNamespace setVariable ['TAG_BackgroundCtrl', nil]";
			text = "pathTo\BackgroundImg.paa";
		};
		class ForegroundCtrlGroup: RscControlsGroupNoScrollBars {
    		idc = -1;
    		x = IMAGE_X * GRID_W;
    		y = IMAGE_Y * GRID_H;
    		w = IMAGE_W * GRID_W;
    		h = IMAGE_H * GRID_H;
			onLoad = "uiNamespace setVariable ['TAG_ForegroundCtrlGroup', _this select 0]";
			onUnload = "uiNamespace setVariable ['TAG_ForegroundCtrlGroup', nil]";
    		class controls {
        		class ForegroundCtrl: RscPicture {
            		idc = -1;
            		x = 0 * GRID_W;
            		y = 0 * GRID_H;
            		w = IMAGE_W * GRID_W;
            		h = IMAGE_H * GRID_H;
            		onLoad = "uiNamespace setVariable ['TAG_ForegroundCtrl', _this select 0]";
            		text = "pathTo\ForegroundImg.paa";
        		};
    		};
		};
	};
};