Hypoxic125/Sandbox – User

From Bohemia Interactive Community
Jump to navigation Jump to search
(Blanked the page)
Tag: Blanking
No edit summary
Line 1: Line 1:
{{TOC|side}}
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 ==
[[File:arma3 decal-rifle-gray.png|300px|frameless|right|Background Image - Desaturated]][[File:arma3 decal-rifle-pink.png|300px|frameless|right|Foreground Image - Full Color]]
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'''
<syntaxhighlight lang="cpp">
#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)
</syntaxhighlight>
'''Define Image Positions'''
<syntaxhighlight lang="cpp">
#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
</syntaxhighlight>
'''Create Config'''
Import Base Classes
* [[GUI_Tutorial#Import_Classes_Via_import_Keyword_(Mission_Only)|Mission]]
* [[GUI_Tutorial#Declare_Classes_(Addon_Only)|Addon]]
<syntaxhighlight lang="cpp">
#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";
        };
    };
};
};
};
[[Category:Arma 3: Editing]]

Revision as of 03:30, 27 April 2024

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

Background Image - Desaturated
Foreground Image - Full Color

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

<syntaxhighlight lang="cpp">

  1. define pixelScale 0.5
  2. define GRID_X safezoneX
  3. define GRID_Y safezoneY
  4. define GRID_W (pixelW * pixelGridNoUIScale * pixelScale)
  5. define GRID_H (pixelH * pixelGridNoUIScale * pixelScale)
  6. define CENTER_X ((getResolution select 2) * 0.5 * pixelW)
  7. define CENTER_Y ((getResolution select 3) * 0.5 * pixelH)
  1. define IMAGE_X 0
  2. 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.

  1. define IMAGE_W 50
  2. 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";
       		};
   		};

}; }; };