Page tree
Skip to end of metadata
Go to start of metadata

Introduction

Scrollbars are sub-classes, which are required by certain controls to handle any overflowing data.

Scrollbar

Used in Dialogs Listbox. Property 'type' in listbox has to be set to 16 (ST_TEXTURE), in order for these settings to have an effect.
When using this type of scrollbar, the 'color' property of the listbox should be set to white {1,1,1,1}, as otherwise the textures used will be tinted in that color.

Properties

Properties
NameTypeRemark
arrowEmptyStringTexture of scroll-buttons (at the end of the scrollbar), when not pressed.
Can be an image (JPG or PAA) or a Procedural Textures. For the texture of the bottom button the specified texture is mirrored vertically.
arrowFullStringTexture of scroll-buttons (at the end of the scrollbar), when button is pressed.
Can be an image (JPG or PAA) or a Procedural Textures. For the texture of the bottom button the specified texture is mirrored vertically.
borderStringTexture of scrollbar background.
Can be an image (JPG or PAA) or a Procedural Textures.
thumbStringTexture of scroll indicator ("cursor" inside the scrollbar).
Can be an image (JPG or PAA) or a Procedural Textures.


Example

description.ext
Defines dialog.
dialog.sqf
Opens dialog and populates listboxes.
class Dlg {
  idd = 20000;
  movingEnable = 0;

  class controls {
    // listbox with default scrollbars
    class LIST1 {
      type = 5; // CT_LISTBOX
      style = 16; // LB_TEXTURES;
      idc = 20000;
      color[] = {1, 1, 1, 1};
      colorText[] = {0, 0, 0, 1};
      colorSelect[] = {0, 0, 0, 1};
      colorSelect2[] = {0, 0, 0, 1};
      colorSelectBackground[] = {0, 0, 0, 0.20};
      colorSelectBackground2[] = {0.90, 0.45, 0, 0.60};
      colorBackground[] = {0, 0, 0, 1};
      highlightColorBackground[] = {0.1, 0.4, 0.4, 1};
      soundSelect[] = {};
      font = "TahomaB";
      sizeEx = 0.028;
      rowHeight = 0;
      x = 0.4; y = 0.1; 
      w = 0.2; h = 0.2;
    };
    class LIST2: LIST1 {
      idc = 20001;
      y = .35;
      // scrollbar using images
      class ScrollBar {
        thumb="\vbs2\ui\data\ui_scrollbar_thumb_ca.paa"; 
        arrowEmpty="\vbs2\ui\data\ui_arrow_top_ca.paa"; 
        arrowFull="\vbs2\ui\data\ui_arrow_top_active_ca.paa"; 
        border="\vbs2\ui\data\ui_border_scroll_ca.paa"; 
      };
    };
    class LIST3: LIST1 {
      idc = 20002;
      y = .6;
      // scrollbar using procedural textures
      class ScrollBar {
        thumb="#(argb,8,8,3)color(1,0,0,1)"; 
        arrowEmpty="#(argb,8,8,3)color(1,1,0,1)"; 
        arrowFull="#(argb,8,8,3)color(0,1,0,1)"; 
        border="#(argb,8,8,3)color(1,1,1,1)"; 
      };
    };
  };
};
// open the dialog
createDialog "Dlg";

// get the control for the listbox
_list1 = (findDisplay 20000) displayCtrl 20000;
_list2 = (findDisplay 20000) displayCtrl 20001;
_list3 = (findDisplay 20000) displayCtrl 20002;

// populate the listboxes
{_x lbFillVehicleType "vbs2_animals"}forEach [_list1,_list2,_list3];


HScrollbar or VScrollbar

Used in Dialogs Group, Dialogs HTML and Dialogs Tree controls.

Properties

Properties
NameTypeRemark
colorColorColor of scrollbar's outline.
heightFloatHeight of horizontal scrollbar. (Only needed in HScrollbar.)
widthFloatWidth of vertical scrollbar. (Only needed in VScrollbar.)

Example

Example of a scrollbar used with grouped controls:

description.ext
Defines dialog.
dialog.sqf
Opens dialog.
class Dlg {
  idd = 20000;
  movingEnable = 1;

  class Controls {
    class CONTROLS_GROUP {
      type = 15; // CT_CONTROLS_GROUP
      style = 0; 
      idc = 20000;
      x = .4; y = .4;
      w = .2; h = .2;

      // different colors and sizes for 
      // vertical and horizontal bar
      class VScrollbar {
        color[] = {1, 1, 0, 1};
        width = 0.05;
      };
      class HScrollbar {
        color[] = {1, 0, 0, 1};
        height = 0.02;
      };
      
      class Controls {
        class TXT1 {
          type = 0; 
          style = 0;
          idc = -1;
          x = .0; y = 0;
          w = .4; h = .1;
          colorText[] = {0,1,0,1};
          colorSelect[] = {0,1,1,1};
          colorBackground[] = {0,0,0,0.3};
          lineSpacing = 1;
          font = "TahomaB";
          sizeEx = 0.09;
          text = "ONE HUNDRED";
        }; 
        class TXT2 : TXT1 {
          y = .12;
          colorBackground[] = {0,0,0,0};
          text = "TWO HUNDRED";
        }
      };
    };
  };
};
// open the dialog
createDialog "Dlg";