Gallery of UIs written in MQL - page 35

 
_Y2H 是什么,是否有 _X2H ?
 
hini #: _Y2H Что это такое, и есть ли это _X2H?

Let's parse the expression _Y2H:

  • Y is a coordinate
  • 2 means "to." Indicating something.
  • H is short for height.

Y to Height.

In the coordinate system, moving from the Y point of the object along its body at a distance equal to the object's height (y_size) leads to its lowest point. The Y coordinate of the object to be snapped must descend along the height of the object to be snapped and end up at its bottom. That is, it must cover the height distance of the anchor object, so the anchor is called _Y2H.


2. _X2H does not exist because the X coordinate can only snap in the horizontal plane, not the vertical plane, and H stands for height. There is a _X2W snap, which means the X coordinate is snapped to the X + X_SIZE (Width) point of the specified object.


The topic of snapping will be discussed in more detail later.

 

Today we'll finish up with the enumerations since we started talking about them yesterday.

 

On the topic of bindings, I will add that there are strict rules and there is no point in trying to experiment with them now. Wait for a more complete explanation.

There are bindings that work separately for groups of elements and there are those that work with individual elements within groups. There are also bindings that are suitable for positioning objects within elements (like text or icons).

So we'll get to that later.

 
Реter Konow #:

Today we'll finish up with the enumerations since we started talking about them yesterday.

However, after thinking carefully, I decided to postpone the completion of the topic of enumerations. Understanding the further material of this topic requires basic knowledge of language rules, which readers do not have yet.

For now, let's continue to get acquainted with controls and bindings.

 

So far, in most cases, we have dealt with a simple BUTTON button. Everyone knows what a button is, it is self-explanatory. But it is worth going into some details. The same applies to other elements we have worked with earlier. Let's do it this way: first let's run through the main features and functions, touch on everything in general terms, and then we'll dwell on each element separately for a more detailed consideration.

So, a button is an interactive element that changes state when pressed. In a graphical interface is used for different purposes. Mostly to switch something on or off, but sometimes to call a window. Variants of application of a simple button is a lot. It is quite a universal element.

What other elements have we considered? For example, CHECKBOX. Why do you need a checkbox? A checkbox is necessary to enable, disable or block options in the programme settings. If you need to choose between several options, the element R_BUTTON(radio button) is suitable. But on condition that there are only a few options.

And if the options are significantly, but not excessively more? Then the D_LIST drop-down list or the C_LIST combo list is used. The difference between these two elements is the presence or absence of a text input field where the user can enter the desired choice. D_LIST has such a field, C_LISTdoes not.

And what to do when there are too many options in the programme? Drop-down lists become uncomfortable because of their small size. The solution is long scrollable sheets in large windows. You can see examples in the font, sounds and frames windows of the designer.

But, these lists need a scroll bar, because they are very long. And that's why there is a special element for them."Field of view" V_BOX. A simple element with two scroll bars and its own canvas. By the way, its scrolling is both vertical and horizontal. And the size of the canvas is set automatically from the calculation of the placed content.

List items are called L_ITEM, which is short for"List Item". They are collected in a separate group and drawn on the canvas of the specified field of view. Each item is called the name of a menu item or option and they are switched with one SWITCH_ALL keyword. And for entering the list of L_ITEM items into the V_BOX overview field , the keyword"IN" is used. Positioning is simple - LEFT_TOP, 0,0,.


Next, let's look at the listed elements in more detail and in the same order. We'll talk about positioning, states, properties and attributes.

...And we will consider the options of application in the context of trader programmes.

 

Ordinary button: BUTTON

4 varieties of constructor buttons:

It has a relatively outdated look and simple functionality like any classic button. There is an icon.


//-------------------------------------------------------------------------------------------------------------------------------------

  • Interactive button I_BUTTON - interactive button:

A beautiful interactive button smoothly responding to cursor hovering / moving away. It is used as a regular button, but less visible and in neutral state has no outlined borders. Mostly without text and with an icon. More often square in shape.


//-------- -----------------------------------------------------------------------------------------------------------------------------

  • Toolbar button (as on MT4) TB_BUTTON - Toolbar button:

Mainly used for toolbar in the header of the main window. Often without text, but with an icon and usually square in shape. Sticks to the cursor when hovered over. Calls windows or functions. Has an arrow.


//-------- -----------------------------------------------------------------------------------------------------------------------------

  • D_BUTTON - dialogue button:

Stands at the bottom of dialogue boxes to interact with the user. It carries such texts as "Ok", "Yes", "No", "Cancel", "Abort", "Continue", "Accept", "Next", "Previous", "Skip", "Confirm", "Open", "Close", .... and other words of this genre.


You can set icons and text on all buttons, as well as colour for different states.

At the same time, the buttons can change text and icon depending on the state. In neutral one text or icon, and in activated one is different.


For example:

All the buttons are depressed and are in neutral state:


And now we have pressed them and they have changed text and icon: (except for the dialogue button, as it closes the window after being pressed and is not necessary)


The text of the interactive button is overlaid on the icon, but it is designed that way because it is possible to position the icon and text inside the button.

 

Thus, buttons can change text when clicked. Moreover, text and button name are different things. The text for neutral state can be set with the word N_TEXT, and another user text will appear instead of the button name.

The same is true for the icon. You can specify an icon for neutral state and for active state.


Code:

NEW_WINDOW,  
//------------------------------------------------------
/*SET WINDOW TYPE*/         W_TYPE, SETTINGS,  
//------------------------------------------------------
/*WRITE WINDOW'S NAME*/     W_NAME, "My first window",
//------------------------------------------------------
/*POINT TO WINDOW'S ICON*/  W_ICON, "::Images\\16x16\\Smile.bmp",  
//------------------------------------------------------

//------------------------------------------------------
/*SET WINDOW'S ADDITIONAL PROPERTIES*/   
//----------------------------------------------------------------------------------
/*WINDOW OPENS AT START*/   OPEN_ON_INIT,  /*(OOI)*/

/*WINDOW IS ALWAYS ON TOP*/ ALWAYS_ON_TOP, /*(OOT)*/  

/*MARGINS OF THE WINDOW*/   MARGINS, 40,40,/*Х, Y*/
//----------------------------------------------------------------------------------
//
//----------------------------------------------------------------------------------
//1. DECLARE A GROUP WITH AN ABSTRACT NAME  A.
//2. DECLARE A NEW ROW OF ELEMENTS IN THE GROUP WITH A SYMBOL  __, 
//3. DECLARE A BUTTON AND WRITE IT'S NAME.
//4. END GROUP WITH THE KEYWORDS  END_GROUP,
//------------------------------------------------------
GROUP, "Buttons group",

__, BUTTON,   "Button 1", W, 120,_,H, 50,   D_BUTTON, "D button 1",   W, 120,_,H, 50,

__, I_BUTTON, "I Button", W, 120,_,H, 50,   TB_BUTTON, "TB button 1", W, 120,_,H, 50, 

END_GROUP,
//--------------------------
i, AT, _X2X, "MF", 10, _Y2Y, "MF", 30,
//--------------------------
i, X_GAP, 30,
i, Y_GAP, 20,
//----------------------------
//SET MAIN PROPERTIES (IF YOU DON'T, THEY WILL HAVE DEFAULT VALUES): 
//----------------------------
"Button 1",    N_TEXT,  "Neutral state",

"Button 1",    A_TEXT,  "Active state",

"Button 1",    N_LABEL, "::Images\\16x16\\About.bmp",

"Button 1",    A_LABEL, "::Images\\16x16\\3d bar chart.bmp",

"Button 1",    FIC,
//----------------------------

//----------------------------
"I Button",    N_TEXT,  "Neutral", 

"I Button",    A_TEXT,  "Active",

"I Button",    N_LABEL, "::Images\\16x16\\Accounting.bmp",

"I Button",    A_LABEL, "::Images\\16x16\\Address book.bmp", 

"I Button",    FIC,
//----------------------------

//----------------------------
"D button 1",    N_TEXT,  "Also Neutral",

"D button 1",    A_TEXT,  "Also Active",

"D button 1",    N_LABEL, "::Images\\16x16\\Alarm clock.bmp",

//----------------------------

//----------------------------
"TB button 1",    N_TEXT,  "TB Neutral",

"TB button 1",    A_TEXT,  "TB Active",

"TB button 1",    N_LABEL, "::Images\\16x16\\Alarm clock.bmp",

"TB button 1",    A_LABEL,  "::Images\\16x16\\Address book.bmp", 

"TB Button 1",    FIC,

//------------------------------------------------------
//FINISH THE WINDOW BY KEYWORDS END_WINDOW,
//------------------------------------------------------
END_WINDOW,
//----------------------------------------------------------------------------------
 

Perhaps one of the main functions of buttons is to call windows. Press the button in one window and another window opens.

How is this done?

Two ways:

  • We write the keyword OPENS_WINDOW in the button properties and then the name of the window to be called.
  • Or name the button the same as the window it should call and hide the button text. Or override the button text with the words N_TEXT and A_TEXT.

It is important to note: matching the names of buttons or menu items with the names of windows causes these windows to open when you click on these items.

//+------------------------------------------------------------------+
//|                                              My first window.mqh |
//+------------------------------------------------------------------+
//DECLARE A NEW WINDOW
//----------------------------------------------------------------------------------
NEW_WINDOW, 
//------------------------------------------------------
/*SET WINDOW TYPE*/         W_TYPE, SETTINGS,  
//------------------------------------------------------
/*WRITE WINDOW'S NAME*/     W_NAME, "Just a window",
//------------------------------------------------------
/*SET WINDOW'S ADDITIONAL PROPERTIES*/   
//------------------------------------------------------ 
/*WINDOW IS ALWAYS ON TOP*/ ALWAYS_ON_TOP, /*(OOT)*/  
//------------------------------------------------------

END_WINDOW,
//----------------------------------------------------------------------------------




//DECLARE A NEW WINDOW
//----------------------------------------------------------------------------------
NEW_WINDOW,  
//------------------------------------------------------
/*SET WINDOW TYPE*/         W_TYPE, SETTINGS,  
//------------------------------------------------------
/*WRITE WINDOW'S NAME*/     W_NAME, "My first window",
//------------------------------------------------------
/*POINT TO WINDOW'S ICON*/  W_ICON, "::Images\\16x16\\Smile.bmp",  
//------------------------------------------------------

//------------------------------------------------------
/*SET WINDOW'S ADDITIONAL PROPERTIES*/   
//----------------------------------------------------------------------------------
/*WINDOW OPENS AT START*/   OPEN_ON_INIT,  /*(OOI)*/

/*WINDOW IS ALWAYS ON TOP*/ ALWAYS_ON_TOP, /*(OOT)*/  

/*MARGINS OF THE WINDOW*/   MARGINS, 40,40,/*Х, Y*/
//----------------------------------------------------------------------------------
//
//----------------------------------------------------------------------------------
//1. DECLARE A GROUP WITH AN ABSTRACT NAME  A.
//2. DECLARE A NEW ROW OF ELEMENTS IN THE GROUP WITH A SYMBOL  __, 
//3. DECLARE A BUTTON AND WRITE IT'S NAME.
//4. END GROUP WITH THE KEYWORDS  END_GROUP,
//------------------------------------------------------
GROUP, "Buttons group",

__, BUTTON,  "Just a window", W, 150, //the button WILL call the window due to sharing the same name.   

END_GROUP,
//--------------------------
i, AT, _X2X, "MF", 10, _Y2Y, "MF", 30,
//--------------------------
i, X_GAP, 30,
i, Y_GAP, 20,
//----------------------------
//SET MAIN PROPERTIES (IF YOU DON'T, THEY WILL HAVE DEFAULT VALUES): 
//----------------------------
"Just a window",    N_TEXT,  "Press to open",//redefine text on the button

"Just a window",    N_LABEL, "::Images\\16x16\\Alarm clock.bmp",
//------------------------------------------------------
//FINISH THE WINDOW BY KEYWORDS END_WINDOW,
//------------------------------------------------------
END_WINDOW,
//----------------------------------------------------------------------------------


And the second variant:

//+------------------------------------------------------------------+
//|                                              My first window.mqh |
//+------------------------------------------------------------------+
//DECLARE A NEW WINDOW
//----------------------------------------------------------------------------------
NEW_WINDOW, 
 
//------------------------------------------------------
/*SET WINDOW TYPE*/         W_TYPE, SETTINGS,  
//------------------------------------------------------
/*WRITE WINDOW'S NAME*/     W_NAME, "Just a window",
//------------------------------------------------------
/*SET WINDOW'S ADDITIONAL PROPERTIES*/   
//------------------------------------------------------ 
/*WINDOW IS ALWAYS ON TOP*/ ALWAYS_ON_TOP, /*(OOT)*/  
//------------------------------------------------------

END_WINDOW,
//----------------------------------------------------------------------------------




//DECLARE A NEW WINDOW
//----------------------------------------------------------------------------------
NEW_WINDOW,  
//------------------------------------------------------
/*SET WINDOW TYPE*/         W_TYPE, SETTINGS,  
//------------------------------------------------------
/*WRITE WINDOW'S NAME*/     W_NAME, "My first window",
//------------------------------------------------------
/*POINT TO WINDOW'S ICON*/  W_ICON, "::Images\\16x16\\Smile.bmp",  
//------------------------------------------------------

//------------------------------------------------------
/*SET WINDOW'S ADDITIONAL PROPERTIES*/   
//----------------------------------------------------------------------------------
/*WINDOW OPENS AT START*/   OPEN_ON_INIT,  /*(OOI)*/

/*WINDOW IS ALWAYS ON TOP*/ ALWAYS_ON_TOP, /*(OOT)*/  

/*MARGINS OF THE WINDOW*/   MARGINS, 40,40,/*Х, Y*/
//----------------------------------------------------------------------------------
//
//----------------------------------------------------------------------------------
//1. DECLARE A GROUP WITH AN ABSTRACT NAME  A.
//2. DECLARE A NEW ROW OF ELEMENTS IN THE GROUP WITH A SYMBOL  __, 
//3. DECLARE A BUTTON AND WRITE IT'S NAME.
//4. END GROUP WITH THE KEYWORDS  END_GROUP,
//------------------------------------------------------
GROUP, "Buttons group",

__, BUTTON,  "Press to open", W, 150,   

END_GROUP,
//--------------------------
i, AT, _X2X, "MF", 10, _Y2Y, "MF", 30,
//--------------------------
i, X_GAP, 30,
i, Y_GAP, 20,
//----------------------------
//SET MAIN PROPERTIES (IF YOU DON'T, THEY WILL HAVE DEFAULT VALUES): 
//----------------------------
"Press to open", OPENS_WINDOW, "Just a window",//opens the window by the keyword 

"Press to open", N_LABEL, "::Images\\16x16\\Alarm clock.bmp",
//------------------------------------------------------
//FINISH THE WINDOW BY KEYWORDS END_WINDOW,
//------------------------------------------------------
END_WINDOW,
//----------------------------------------------------------------------------------



Result:


 

And lastly today:

Hiding the button text with c.words

_,text, IS_HIDDEN,

Example:


Code:

//------------------------------------------------------
GROUP, "Buttons group",

__, BUTTON,  "Press to open", W, 150, _,text, IS_HIDDEN,  

END_GROUP,
//--------------------------
i, AT, _X2X, "MF", 10, _Y2Y, "MF", 30,
//--------------------------
i, X_GAP, 30,
i, Y_GAP, 20,
//----------------------------
//SET MAIN PROPERTIES (IF YOU DON'T, THEY WILL HAVE DEFAULT VALUES): 
//----------------------------
"Press to open", OPENS_WINDOW, "Just a window",

"Press to open", N_LABEL, "::Images\\16x16\\Alarm clock.bmp",
//------------------------------------------------------