Discussion of article "Graphical Interfaces VII: The Tabs Control (Chapter 2)"

 

New article Graphical Interfaces VII: The Tabs Control (Chapter 2) has been published:

The first chapter of seventh part introduced three classes of controls for creating tables: text label table (CLabelsTable), edit box table (CTable) and rendered table (CCanvasTable). In this article (chapter two) we are going to consider the Tabs control.

Tabs are used to control the display of predefined sets of graphical interface controls. Often, multi-functional applications require a large number of controls to be fit into a confined space allocated for the graphical interface. Tabs can be used to group the controls by categories and to display only the currently needed group. This makes the interface much more accessible and more intuitive for the end user. On the surface, the tabs look like a group of buttons with labels (name of the controls group). At the same time, only one of them can be selected (active).

Let us enumerate all components of this control.

  1. Background or the area to fit a group of controls
  2. Tabs

 Fig. 1. Components of the «Tabs» control.

Fig. 1. Components of the Tabs control.

Let us create four modes to position the tabs relative to the area, where other controls will be placed: top, bottom, left and right.

Author: Anatoli Kazharski

 
Hi. A really nice article, but at the moment I've some questions:

1.)
I do not find an information, how I can add simple CLabel or CEdit controls to the form. (From objects.mqh)
They do not have a function like WindowPointer().
I can create these objects, but I can't attach them to the window.

The
CWndContainer::AddToElementsArray(m_subwin, _MyEditBox);
does not work in this case...

2.)
Is the CComboBox a static object. Is it possible to modify the list of elements in the

ComboBox-Listview after the creation of the ComboBox?

Thank you!

 
HI , if I roll up the Dialog, and change the period.the Dialog is not ok.in MT4.
 

I am trying to add an input field to a tab but it wont work. 

input double whenToTrail=10.3;

class CProgram: public CWndEvents
{
protected:
   CSpinEdit         m_StartTS;
//Code
protected:
   bool              CreatetrailStop(const int x_gap, const int y_gap, const string text);
};


then the function

bool CProgram::CreatetrailStop(const int x_gap, const int y_gap, string text)
  {
//--- Save the pointer to the main element
   m_StartTS.WindowPointer(m_window);
//--- Coordinates
   int x = m_window.X() + x_gap;
   int y = m_window.Y() + y_gap;
//--- Reserve for the tab
   m_tabs.AddToElementsArray(1, m_StartTS);
//--- Properties
   m_StartTS.XSize(95);
   m_StartTS.YSize(15);
   m_StartTS.EditXSize(40);
   m_StartTS.MinValue(0.01);
   m_StartTS.StepValue(0.01);
   m_StartTS.SetDigits(1);
   m_StartTS.SetValue(NormalizeDouble(whenToTrail,1));
   
   m_StartTS.ResetMode(true);
//--- Create a control
   if(!m_StartTS.CreateSpinEdit(m_chart_id, m_subwin, text, x, y))
      return(false);
//--- Add the object to the common array of object groups
   CWndContainer::AddToElementsArray(0, m_StartTS);
   return(true);
  }

this object isn't attached to the Panel but is on thee chart. 

and after deleting the chart the object remains
 
Hi, this article interests me a lot, I tried to install it but when I compile it it gives me these errors:

resource file '\ Images \ EasyAndFastGUI \ Controls \ LeftTransp_black.bmp' not found Calendar.mqh 443 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ LeftTransp_blue.bmp' not found Calendar.mqh 444 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ calendar_today.bmp' not found Calendar.mqh 738 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ calendar_drop_on.bmp' not found DropCalendar.mqh 435 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ calendar_drop_off.bmp' not found DropCalendar.mqh 436 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ calendar_drop_locked.bmp' not found DropCalendar.mqh 437 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ RightTransp_rotate_black.bmp' not found TreeItem.mqh 247 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ RightTransp_rotate_white.bmp' not found TreeItem.mqh 248 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_x_resize.bmp' not found Pointer.mqh 8 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_x_resize_blue.bmp' not found Pointer.mqh 9 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_y_resize.bmp' not found Pointer.mqh 10 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_y_resize_blue.bmp' not found Pointer.mqh 11 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_xy1_resize.bmp' not found Pointer.mqh 12 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_xy1_resize_blue.bmp' not found Pointer.mqh 13 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_xy2_resize.bmp' not found Pointer.mqh 14 11
resource file '\ Images \ EasyAndFastGUI \ Controls \ pointer_xy2_resize_blue.bmp' not found Pointer.mqh 15 11
resource file '\ Images \ EasyAndFastGUI \ Icons \ bmp16 \ folder.bmp' not found FileNavigator.mqh 284 11
resource file '\ Images \ EasyAndFastGUI \ Icons \ bmp16 \ text_file.bmp' not found FileNavigator.mqh 285 11

I looked in the MQL5 zip file but the files are not there, is there any way to get them?
Thank you
 

How can I add CLabel to tabs, when I create CLabel item and want add to tabs compiler gives me these error:


CLabel m_overview_titlte_label;

bool CMainPanel::CreateOverviewTitleLabel(const string text)
  {

//--- Pass the panel object
   m_overview_title_label.WindowPointer(m_window);
//--- Attach to the fourth tab of the first group of tabs
   m_main_panel_tabs.AddToElementsArray(0,m_overview_title_label);  
   m_main_panel_tabs.AddToElementsArray( 
//--- Coordinates
   int x=m_window.X()+OVERVIE_TITLE_LABEL_GAP_X;
   int y=m_window.Y()+OVERVIE_TITLE_LABEL_GAP_Y;
//--- Set properties before creation
   m_overview_title_label.XSize(140);
   m_overview_title_label.YSize(18);
   //m_overview_title_label.
//--- Create control
   if(!m_overview_title_label.Create(m_chart_id,text,m_subwin,x,y))
      return(false);
//--- Add the object to the common array of object groups
   //CWndContainer::AddToElementsArray(0,m_overview_title_label);
   return(true);
  }


Compiler Error:

'WindowPointer' - function not defined MainPanel.mqh 233 27

'm_overview_title_label' - parameter conversion not allowed MainPanel.mqh 235 43

'm_overview_title_label' - variable of the same type expected MainPanel.mqh 235 43

 
Martin Fischer #:
Hi. A really nice article, but at the moment I've some questions:

1.)
I do not find an information, how I can add simple CLabel or CEdit controls to the form. (From objects.mqh)
They do not have a function like WindowPointer().
I can create these objects, but I can't attach them to the window.

The
does not work in this case...

2.)
Is the CComboBox a static object. Is it possible to modify the list of elements in the

ComboBox-Listview after the creation of the ComboBox?

Thank you!

I had same problem, I solve that by create a include file and write my label class and use that. You must create this file in Include\EasyAndFastGUI\Controls\MyLabel.mqh

That code is:

//+------------------------------------------------------------------+
//|                                                      MyLabel.mqh |
//|                                      Copyright 2023, Sassiz.Root |
//|                                         https://t.me/R00T_S4SS12 |
//+------------------------------------------------------------------+
#property copyright "Copyright 2023, Sassiz.Root"
#property link      "https://t.me/R00T_S4SS12"
#property strict

#include "Element.mqh"
#include "Window.mqh"
//+------------------------------------------------------------------+
//| Class for creating a checkbox                                    |
//+------------------------------------------------------------------+
class MyLabel : public CElement
  {
private:
   //--- Pointer to the form to which the element is attached
   CWindow          *m_wnd;
   //--- Objects for creating a checkbox

   CLabel            m_label;

   //--- Text of the checkbox
   string            m_label_text;
   //--- Text label margins
   int               m_label_x_gap;
   int               m_label_y_gap;
   //--- Colors of the text label in different states
   color             m_label_color;
   color             m_label_color_off;
   color             m_label_color_hover;
   color             m_label_color_locked;
   color             m_label_color_array[];
   //--- Priorities of the left mouse button press
   int               m_zorder;
   int               m_area_zorder;

   //---
public:
                     MyLabel(void);
                    ~MyLabel(void);
   //--- Methods for creating a checkbox
   bool              CreateLabel(const long chart_id,const int subwin,const string text,const int x,const int y);
   //---
private:
   bool              CreateLabel2(void);
   //---
public:
   //--- (1) Stores the form pointer, (2) return/set the state of the checkbox
   void              WindowPointer(CWindow &object)                 { m_wnd=::GetPointer(object);            }

   //--- (1) Background color, (2) margins for the text label

   void              LabelXGap(const int x_gap)                     { m_label_x_gap=x_gap;                   }
   void              LabelYGap(const int y_gap)                     { m_label_y_gap=y_gap;                   }
   //--- Color of the text in different states
   void              LabelColor(const color clr)                    { m_label_color=clr;                     }

   //--- (1) Description of the checkbox, (2) return/set the state of the checkbox button
   string            LabelText(void)                          const { return(m_label.Description());         }

   //--- Changing the color
   void              ChangeObjectsColor(void);
   //---
public:
   //--- Chart event handler
   virtual void      OnEvent(const int id,const long &lparam,const double &dparam,const string &sparam);
   //--- Timer
   virtual void      OnEventTimer(void);
   //--- Moving the element
   virtual void      Moving(const int x,const int y);
   //--- (1) Show, (2) hide, (3) reset, (4) delete
   virtual void      Show(void);
   virtual void      Hide(void);
   virtual void      Reset(void);
   virtual void      Delete(void);
   //--- (1) Set, (2) reset priorities of the left mouse button press
   virtual void      SetZorders(void);
   virtual void      ResetZorders(void);
   //--- Reset the color
   virtual void      ResetColors(void);
   virtual void      SetText(string text);
   virtual void      SetFontSize(int fontSize);
   //---
private:
   //--- Handling of the press on the element
   bool              OnClickLabel(const string clicked_object);
  };
//+------------------------------------------------------------------+
//| Constructor                                                      |
//+------------------------------------------------------------------+
MyLabel::MyLabel(void) :      
                             m_label_x_gap(20),
                             m_label_y_gap(2),
                             m_label_color(clrBlack)
                             
  {
//--- Store the name of the element class in the base class
   CElement::ClassName(CLASS_NAME);
//--- Set priorities of the left mouse button click
   m_zorder      =0;
   m_area_zorder =1;
  }
//+------------------------------------------------------------------+
//| Destructor                                                       |
//+------------------------------------------------------------------+
MyLabel::~MyLabel(void)
  {
  }
//+------------------------------------------------------------------+
//| Event handling                                                |
//+------------------------------------------------------------------+
void MyLabel::OnEvent(const int id,const long &lparam,const double &dparam,const string &sparam)
  {
//--- Handling of the cursor movement event
   if(id==CHARTEVENT_MOUSE_MOVE)
     {
      //--- Leave, if the element is hidden
      if(!CElement::IsVisible())
         return;
      //--- Leave, if numbers of subwindows do not match
      if(CElement::m_subwin!=CElement::m_mouse.SubWindowNumber())
         return;
      //--- Checking the focus over element
      CElement::MouseFocus(m_mouse.X()>X() && m_mouse.X()<X2() && m_mouse.Y()>Y() && m_mouse.Y()<Y2());
      return;
     }
//--- Handling the left mouse button click on the object
   if(id==CHARTEVENT_OBJECT_CLICK)
     {
      //--- Pressing on the checkbox
      if(OnClickLabel(sparam))
         return;
     }
  }
//+------------------------------------------------------------------+
//| Timer                                                            |
//+------------------------------------------------------------------+
void MyLabel::OnEventTimer(void)
  {
//--- If the form is not blocked
   if(!m_wnd.IsLocked())
      //--- Changing the color of the element objects
      ChangeObjectsColor();
  }
//+------------------------------------------------------------------+
//| Creates a group of the checkbox objects                          |
//+------------------------------------------------------------------+
bool MyLabel::CreateLabel(const long chart_id,const int subwin,const string text,const int x,const int y)
  {
//--- Leave, if there is no form pointer
   if(!CElement::CheckWindowPointer(::CheckPointer(m_wnd)))
      return(false);
//--- Initializing variables
   m_id         =m_wnd.LastId()+1;
   m_chart_id   =chart_id;
   m_subwin     =subwin;
   m_x          =x;
   m_y          =y;
   m_label_text =text;
//--- Margins from the edge
   CElement::XGap(CElement::X()-m_wnd.X());
   CElement::YGap(CElement::Y()-m_wnd.Y());
//--- Creating an element

   if(!CreateLabel2())
      return(false);
//--- Hide the element if the window is a dialog one or is minimized
   if(m_wnd.WindowType()==W_DIALOG || m_wnd.IsMinimized())
      Hide();
//---
   return(true);
  }


//+------------------------------------------------------------------+
//| Creates checkbox label                                           |
//+------------------------------------------------------------------+
bool MyLabel::CreateLabel2(void)
  {
//--- Forming the object name
   string name=CElement::ProgramName()+"_lable_"+(string)CElement::Id();
//--- Coordinates
   int x =CElement::X()+m_label_x_gap;
   int y =CElement::Y()+m_label_y_gap;
//--- Text color according to the state
   color label_color=clrBlack;//(m_check_button_state) ? m_label_color : m_label_color_off;
//--- Set the object
   if(!m_label.Create(m_chart_id,name,m_subwin,x,y))
      return(false);
//--- set properties
   m_label.Description(m_label_text);
   m_label.Font(FONT);
   m_label.FontSize(FONT_SIZE);
   m_label.Color(label_color);
   m_label.Corner(m_corner);
   m_label.Anchor(m_anchor);
   m_label.Selectable(false);
   m_label.Z_Order(m_zorder);
   m_label.Tooltip("\n");
//--- Margins from the edge
   m_label.XGap(x-m_wnd.X());
   m_label.YGap(y-m_wnd.Y());
//--- Initializing gradient array
   CElement::InitColorArray(label_color,m_label_color_hover,m_label_color_array);
//--- Store the object pointer
   CElement::AddToArray(m_label);
   return(true);
  }
//+------------------------------------------------------------------+
//| Moving elements                                                  |
//+------------------------------------------------------------------+
void MyLabel::Moving(const int x,const int y)
  {
//--- Leave, if the element is hidden
   if(!CElement::IsVisible())
      return;
//--- Storing indents in the element fields
   CElement::X(x+XGap());
   CElement::Y(y+YGap());
//--- Storing coordinates in the fields of the objects
   m_label.X(x+m_label.XGap());
   m_label.Y(y+m_label.YGap());
//--- Updating coordinates of graphical objects
   m_label.X_Distance(m_label.X());
   m_label.Y_Distance(m_label.Y());
  }
//+------------------------------------------------------------------+
//| Changing the object color when the cursor is hovering over it    |
//+------------------------------------------------------------------+
void MyLabel::ChangeObjectsColor(void)
  {
//--- Leave, if the element is blocked

//---
   color label_color=clrBlack;//(m_check_button_state) ? m_label_color : m_label_color_off;
   CElement::ChangeObjectColor(m_label.Name(),CElement::MouseFocus(),OBJPROP_COLOR,label_color,m_label_color_hover,m_label_color_array);
  }
//+------------------------------------------------------------------+
//| Shows combobox                                                   |
//+------------------------------------------------------------------+
void MyLabel::Show(void)
  {
//--- Leave, if the element is already visible
   if(CElement::IsVisible())
      return;
//--- Make all objects visible
   for(int i=0; i<CElement::ObjectsElementTotal(); i++)
      CElement::Object(i).Timeframes(OBJ_ALL_PERIODS);
//--- State of visibility
   CElement::IsVisible(true);
  }
//+------------------------------------------------------------------+
//| Hides combobox                                                   |
//+------------------------------------------------------------------+
void MyLabel::Hide(void)
  {
//--- Leave, if the element is already visible
   if(!CElement::IsVisible())
      return;
//--- Hide all objects
   for(int i=0; i<CElement::ObjectsElementTotal(); i++)
      CElement::Object(i).Timeframes(OBJ_NO_PERIODS);
//--- State of visibility
   CElement::IsVisible(false);
  }
//+------------------------------------------------------------------+
//| Redrawing                                                        |
//+------------------------------------------------------------------+
void MyLabel::Reset(void)
  {
//--- Leave, if this is a drop-down element
   if(CElement::IsDropdown())
      return;
//--- Hide and show
   Hide();
   Show();
  }
//+------------------------------------------------------------------+
//| Deletion                                                         |
//+------------------------------------------------------------------+
void MyLabel::Delete(void)
  {
//--- Removing objects
   m_label.Delete();
//--- Emptying the array of the objects
   CElement::FreeObjectsArray();
//--- Initializing of variables by default values
   CElement::MouseFocus(false);
   CElement::IsVisible(true);
  }
//+------------------------------------------------------------------+
//| Seth the priorities                                              |
//+------------------------------------------------------------------+
void MyLabel::SetZorders(void)
  {
   m_label.Z_Order(m_zorder);
  }
//+------------------------------------------------------------------+
//| Reset the priorities                                             |
//+------------------------------------------------------------------+
void MyLabel::ResetZorders(void)
  {
   m_label.Z_Order(0);
  }
//+------------------------------------------------------------------+
//| Reset the color of the element objects                           |
//+------------------------------------------------------------------+
void MyLabel::ResetColors(void)
  {

//--- Reset the color
   m_label.Color(clrBlack);
//--- Zero the focus
   CElement::MouseFocus(false);
  }

//+------------------------------------------------------------------+
//| Clicking on the element header                                   |
//+------------------------------------------------------------------+
bool MyLabel::OnClickLabel(const string clicked_object)
  {

//--- The mouse cursor is currently over the element
   m_label.Color(m_label_color_hover);
//--- Send a message about it
   ::EventChartCustom(m_chart_id,ON_CLICK_LABEL,CElement::Id(),0,m_label.Description());
   return(true);
  }
//+------------------------------------------------------------------+


void MyLabel::SetText(string text){
   m_label.Description(text);
}

void MyLabel::SetFontSize(int fontSize){
   m_label.FontSize(fontSize);
}

Then create object from MyLabel Class like this and use it:

   //---Label
   MyLabel           m_overview_title_label;

Then:

//+------------------------------------------------------------------+
//| Creates OverviewTitleLabel                                       |
//+------------------------------------------------------------------+
bool CMainPanel::CreateOverviewTitleLabel(const string text)
  {

//--- Pass the panel object
   m_overview_title_label.WindowPointer(m_window);
//--- Attach to the fourth tab of the first group of tabs
   m_main_panel_tabs.AddToElementsArray(0,m_overview_title_label);  
//--- Coordinates
   int x=m_window.X()+OVERVIE_TITLE_LABEL_GAP_X;
   int y=m_window.Y()+OVERVIE_TITLE_LABEL_GAP_Y;
//--- Set properties before creation
   m_overview_title_label.XSize(140);
   m_overview_title_label.YSize(18);
   m_overview_title_label.SetText(text);
   m_overview_title_label.SetFontSize(18);
   //m_overview_title_label.
//--- Create control
   if(!m_overview_title_label.CreateLabel(m_chart_id,m_subwin,text,x,y))
      return(false);
//--- Add the object to the common array of object groups
   CWndContainer::AddToElementsArray(0,m_overview_title_label);
   return(true);
  }
Reason: