The VBDockingManager control allows you to display your designs in dockable windows:

A design to be displayed can be in one of the four states that are described with the enum " Global.VBDesignDockState ":

• AutoHideButton : Hidden as a button on one of the four sides,
• Docked : docked on one of the four sides,
• Tabbed : as a tab,
• FloatingWindow : as a window that can be moved freely.

The orientation control of Docked- or AutoHideButton state with the enum  " Global.VBDesignDockPosition ":

• Left,
• Top,
• Right,
• Bottom

You set these properties in the XAML code as attached properties in VBDesigns . The docking manager itself has the content property   VBDesignList, which is a list of VBDesigns.

<vb:VBDockingManager xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  xmlns:vb="http://www.iplus-framework.com/ACFramework/xaml"
  FocusView="{Binding MyFocusView}">  
  <vb:VBDesign VBContent="*InOrderForm"  
    vb:VBDockingManager.Container="TabItem"  
    vb:VBDockingManager.DockState="Tabbed"  
    vb:VBDockingManager.DockPosition="Bottom"  
    vb:VBDockingManager.IsCloseableBSORoot="False"  
    vb:VBDockingManager.RibbonBarVisibility="Hidden"  
    vb:VBDockingManager.WindowSize="0,0"
    FocusNames="Lines,Postings" />  
  <vb:VBDesign VBContent="*Explorer"  
    vb:VBDockingManager.Container="DockableWindow"  
    vb:VBDockingManager.DockState="AutoHideButton"  
    vb:VBDockingManager.DockPosition="Right"  
    vb:VBDockingManager.IsCloseableBSORoot="False"  
    vb:VBDockingManager.RibbonBarVisibility="Hidden"  
    vb:VBDockingManager.WindowSize="400,400" />
</vb:VBDockingManager> 

If you specify the DockState = "Tabbed", you must always set "vb: VBDockingManager. Container " to "TabItem". Otherwise always as "DockableWindow".

If you want to display subordinate business objects in  VBDesign , you can use the " IsCloseableBSORoot " property to control whether the window can be closed by the user at the top right. With the property " RibbonBarVisibility " you control whether the menu ribbon should be hidden.

With " WindowSize " you define the X / Y size of the window that appears when you move the mouse over the button.

Automatic focus

In the chapter for business objects you can see an example of how you can open a business object in the background and set a filter to display the correct data record. With hierarchical master-detail relationships it can happen that there are many nested VBDockingManagers. There are two special dependency properties so that the correct tabs are opened within the DockingManager nesting when the business object is opened:

• " public string FocusView " in the class VBDockingManager and VBTabControl.
• " public string FocusNames " in the class VBDesign and VBTabItem.

Define a String property on your business object that you then bind to the FocusView dependency property . e.g.

private string _MyFocusView;
public string MyFocusView
{ 
  get { return _MyFocusView; } 
  set { 
    if (_MyFocusView != value) 
    {
      _MyFocusView = value; 
      OnPropertyChanged("MyFocusView"); 
    } }
}

This property stores any character string that specifies what is  to be displayed or focused on the user interface.

Let us assume that the design " * InOrderForm " from the XAML example above again consists of a DockingManager that displays two tabs:

<vb:VBDockingManager FocusView="{Binding MyFocusView}">  
  <vb:VBDesign VBContent="*InOrderLines"  
    FocusNames="Lines"  
    vb:VBDockingManager.Container="TabItem"  
    vb:VBDockingManager.DockState="Tabbed"  
    vb:VBDockingManager.DockPosition="Bottom" />  
  <vb:VBDesign VBContent="*InOrderPostings"  
    FocusNames="Postings"  
    vb:VBDockingManager.Container="TabItem"  
    vb:VBDockingManager.DockState="Tabbed"  
    vb:VBDockingManager.DockPosition="Right" />
</vb:VBDockingManager>

If the MyFocusView now has the value "Postings" , then the tab in the outer docking manager is focused with " * InOrderForm " , because the value appears in the property FocusNames with the comma-separated list "Lines, Postings" .
The inner docking manager  then focuses the tab with " * InOrderPostings " because it contains the property FocusNames "Postings" .

The following layout elements are used to arrange control elements:

• VBDockPanel (derived from DockPanel ),
• VBStackPanel (derived from StackPanel ),
• VBGrid (derived from Grid ),
• VBCanvas (derivative of Canvas ),
• VBExpander (derivative of expander )

You can use all of these controls as described in the Microsoft documentation. They have been extended by the following functionalities:

• Style has been adapted to the iPlus system.
• The arrangement of the child elements is adapted in such a way that no margins or paddings are necessary to arrange the child elements legibly at a uniform distance.
• All implement the IVBContent interface. If the property bound with VBContent changes due to the IPropertyChanged notification, the " " method is called on the corresponding ACComponent, which is bound by data context or BSOACComponent. The visibility property is controlled according to the return value. This means that if the value is less than or equal to "ControlModes.Disabled", the layout element is invisible or closed. Global.ControlModesInfo GetControlModes( IVBContent vbControl)
• Some have the "CanExecuteCyclic" property. Enter a value in milliseconds here with which you control the time interval in which the CanExecute-RoutedEvent is executed on all child elements that are bound by CommandBinding . In practical terms, this means that if you have bound a button (VBButton) to a method that is implemented on the server side, an IsEnabled query is carried out via the network in this time interval to either activate or deactivate the button.

VBTabControl is an extension of TabControl , VBTabItem and TabItem .

You have already learned about the function of the properties FocusView and FocusNames in the VBDockingManager section.

To set the heading of a TabItem, use the ACCaption property instead of the Header property:

<vb:VBTabControl FocusView="{Binding MyFocusView}">
 <vb:VBTabItem ACCaption="Lines" FocusNames="Lines">
 </vb:VBTabItem>
 <vb:VBTabItem ACCaption="Postings" FocusNames="Postings">
 </vb:VBTabItem>
</vb:VBTabControl>

The ACCaption property have almost all subsequent iPlus controls. If you set an ACCaption property explicitly, a translation entry is created in the ACClassText table when the control is displayed for the first time. Then go to the development environment and translate the texts in the "Translations" tab. When you open it again, the text to be displayed is replaced with the translated text.

Note : Since the character string in ACCaption is used for access via ACIdentifier in the ACClassText table, you should not use spaces if possible!

Controls with labels

Most of the iPlus controls described below have a label that is automatically determined by the resolution of the VBContent . You can switch off this labeling with the ShowCaption property  . The automatic labeling can be overridden by setting the ACCaption property.

The labeling field and the actual content element (e.g. text box, check box ...) are arranged in a grid with two columns. The ratio of the width of the label and the content element is determined by the properties  WidthCaption ( 15 * ) ,  WidthContent ( 20 * ) , WidthCaptionMax ( 150 ) and  WidthContentMax ( ∞ ) . This standard ratio applies to all subsequent iPlus controls that have labels so that the masks look uniform.

Controls with second VBContent

The controls VBTextBox2 and VBComboBox2 have a VBContent2 property that can be used to display a second value that is logically related to the first value. For example you want to display a unit that should be displayed to the right of it. In this case the grid has a third column. The width is controlled by the properties  WidthCaption2 ( 10 * ) and  WidthCaption2Max ( ∞ ).

VBButton is an extension of Button  and implements IVBContent . Enter a command method in VBContent and put an exclamation mark at the beginning. The key is automatically deactivated if the user has no rights or an IsEnabled method is available. If a proxy object is bound and the IsEnabled method is a server-side method, then you can explicitly cause the CommandBinding to run the CanExecute check cyclically.

<vb:VBButton VBContent="!MyMethod" CanExecuteCyclic="2000" />
<vb:VBButton VBContentMouseDown="!MyMethod">Click me</vb:VBButton>
<vb:VBButton VBContentMouseUp="!MyMethod" />
<vb:VBButton VBContentMouseDown="\DataAccess\PLCService\PLC1\GroupA\BoolVar15=true" />
<vb:VBButton VBContentMouseUp="\DataAccess\PLCService\PLC1\GroupA\BoolVar15=false" />

In VBContentMouseUp and VBContentMouseDown you can either declare a method call or a variable assignment.

VBTextBox is an extension of TextBox .

A VBTextBox has a label in front of the actual text box. Read the ACCaption section on  how to set and change the labeling automatically and set the width ratios.

<vb:VBTextBox VBContent="CurrentMaterial\MaterialName" />

VBTextBox2 is a variant of the VBTextBox that has another output field to the right of the TextBox , the content of which you declare using VBContent2 .

<vb:VBTextBox2 VBContent="CurrentMaterial\MaterialName" 
               VBContent2="CurrentMaterial\BaseMDUnit\MDUnitName" />

VBTextBox3   is a further variant of the VBTextBox, which has another input field  (combobox) to the right of the TextBox , the content of which you declare using VBContent2 .

<vb:VBTextBox3 VBContent="CurrentMaterial\MaterialName" 
               VBContent2="CurrentMaterial\BaseMDUnit" 
               VBSource2="MDUnitList"/>

Masking

The VBTexBox uses the MaskedTextProvider class for masking . VBTextBox provides three properties for this: Mask , IncludePrompt  and  IncludeLiterals .

Formatting

To format the number representation, use the StringFormat property. The value is passed to the StringFormat property of the Binding class. The formatting syntax can be found at:  https://docs.microsoft.com/en-us/dotnet/standard/base-types/formatting-types

<vb:VBTextBox VBContent="OrderLine\TargetQuantity" StringFormat="#,0.0" />

VBTextBox and the following input controls have the following common properties:

Automatic setting of the input cursor

With the AutoFocus property , which you should set for only one control element within a design, you control which control element is to receive the keyboard focus . To do this, the " Focus " method is called in the UIElement class.

Deactivating the context menu

If several iPlus controls are nested inside one another, you can use the " DisableContextMenu " property to control which controls are not allowed to open a context menu. This avoids doubling the number of identical commands.

Input validation

WPF provides for the use of the ValidationRule class to validate entered values . In iPlus this class has been extended by the class VBValidationRule. This means that the validation method can be called via ACUrlCommand .

The signature of the validation method must look like this:

[ACMethodInfo("ACClass", "en{'Validate input'}de{'Überprüfe Eingabe'}", 492, false)]
public Msg ValidateInput(string vbContent, object value, System.Globalization.CultureInfo cultureInfo)
{
  if (value == null)
  {
    return new Msg() { MessageLevel = eMsgLevel.Info };
  }
  else
  {
    switch (vbContent)
    {
       case "CurrentNewVisualisation\\ACIdentifier":
       case "CurrentVisualisation\\ACIdentifier":
       {
         String strValue = value as String;
         if (String.IsNullOrEmpty(strValue))
           return new Msg() { MessageLevel = eMsgLevel.Info };
         if (strValue.ContainsACUrlDelimiters() || strValue.Contains(" "))
         {
           Msg msg = new Msg { ACIdentifier = this.ACCaption, 
           Message = Root.Environment.TranslateMessage(this, "Warning00002"), 
           MessageLevel = eMsgLevel.Error };
           return msg;
         }
         break;
      }
    }
  }
  return new Msg() { MessageLevel = eMsgLevel.Info };
}

The first transfer parameter contains the VBContent value of the control that this method called for validation. Return an Msg instance with the level " Error " if the validation failed so that the control element can display the error text as tooltip text .

<vb:VBTextBox VBContent="CurrentMaterial\MaterialName" VBValidation="!ValidateInput" />

Disabling controls 

The ACComponent base class has the following virtual method:

public virtual Global.ControlModesInfo GetControlModes(IVBContent vbControl)

This method checks the following properties:

1. Whether the user is allowed to read or change the bound value in the control according to his group rights .
2. Prüft die in der Entwicklungsumgebung eingestellten Min-/Max- Grenzwerte . Dafür wird die virtuelle Methode " CheckPropertyMinMax " aufgerufen, die Sie in Ihrer Ableitung überschreiben können.
3. Führt eine Inhaltsbezogene Prüfung durch, indem die virtuelle Methode " OnGetControlModes " aufgerufen wird, die Sie in Ihrer Ableitung überschreiben können:

public override Global.ControlModes OnGetControlModes(IVBContent vbControl)
{
  if (vbControl == null)
    return base.OnGetControlModes(vbControl);
  Global.ControlModes result = base.OnGetControlModes(vbControl);
  if (result < Global.ControlModes.Enabled)
    return result;
  switch (vbControl.VBContent)
  {
    case "ShowFromBaseClass":
      if (CurrentACClass != null)
        result = Global.ControlModes.Enabled;
      else
        result = Global.ControlModes.Hidden;
      break;
    case "IsVisibleConfigTarget":
      if (IsVisibleConfigTarget)
        result = Global.ControlModes.Enabled;
      else
        result = Global.ControlModes.Collapsed;
      break;
  } 
  return result;
} 

Dauerhaftes deaktivieren des Steuerelements können Sie über die Eigenschaft " DisabledModes " im XAML-Code deklarieren:

• Collapsed : Zeigt das Element nicht an und reserviert keinen Platz dafür im Layout.
• Hidden : Zeigt das Element nicht an, aber reserviert Platz für das Element im Layout.
• Disabled : Element kann nicht auf Benutzerinteraktion reagieren.

<vb:VBTextBox VBContent="CurrentMaterial\MaterialName" DisabledModes="Disabled" />

These three control elements are used to display texts that either:

• fixed in the XAML code,
• read from a bound property via data binding,
• or translated using the ACClassText table.

VBTextBlock

VBTextBlock is an extension of TextBlock . If you have not set the Text property explicitly , you can set it automatically:

• VBContent : Displays the value specified under Designation in the development environment.
• ACCaption : Displays the translated text from the corresponding ACClassText.
• Translation tuple : Direct display of the translation text entered in the XAML.

<vb:VBTextBlock VBContent="Content\FacilityBookingNo"/>
<vb:VBTextBlock Style="{vb:VBStaticResource globalStyleHeadlineText}" Text="ABC"/>
<vb:VBTextBlock ACCaption="lblOutwardLots" />
<vb:VBTextBlock ACCaption="en{'Filter'}de{'Filtern'}" />

VBHeader

The functionality of the VBHeader is identical to that of the VBTextBlock. Use the VBHeader for headings of related areas within a layout element (e.g. VBGrid, VBStackPanel ...).

 <vb:VBHeader ACCaption="lblOutwardLots" />

VBTranslationText

VBTranslationText is used to display translation texts from the ACClassText table. In VBContent specify the ACUrl to the text:

<vb:VBTranslationText vb:VBContent="\Mixery\HopScale1§Question50037"
     vb:ShowText="{vb:VBBinding VBContent="\\DataAccess\\PLCService\\PLC1\\GroupA\\BoolVar15"
     vb:Blink="true" />

With ShowText you control whether the text should be shown or hidden. If Blink is set to "true", the text blinks. This enables you to better highlight important texts (e.g. alarms).

VBCheckBox is an extension of CheckBox .

Both controls have a  label in  front of the actual control. For more information, read the section ACCaption  how the labeling can be set and changed automatically and the width ratios can be set.

<vb:VBCheckBox VBContent="IsEnabled" />

VBRadioButtonGroup is an ItemsControl that shows a list of RadioButtons . Specify a Selected property in the VBContent :

<vb:VBRadioButtonGroup VBContent="CurrentConfigSaveMode" ShowCaption="False" />

VBDatePicker is an extension of DatePicker for selecting a date. Use VBDateTimePicker if you also want to select the time.

Both controls have a  label in  front of the actual control. For more information, read the section ACCaption  how the labeling can be set and changed automatically and the width ratios can be set.

<vb:VBDatePicker VBContent="PostingDate" />
<vb:VBDateTimePicker VBContent="PostingDate" />
<vb:VBDateTimePicker VBContent="PostingDate" Format="LongDate" />
<vb:VBDateTimePicker VBContent="PostingDate" Format="Custom" FormatString="YYYY.MM.DD" />

You can use the format properties to explicitly define the formatting. See https://docs.microsoft.com/en-us/dotnet/standard/base-types/standard-date-and-time-format-strings.

VBDataGrid  is an extension of DataGrid.

VBDataGrid are selectorelements and implement theIVBSourceinterface.The interface defines the Selected property via VBContent and automatically binds theItemsSource.

You can declare columns in VBDataGrid in two different ways:

1. In the property  VBShowColumns you can specify a comma-separated list of columns.You address the columns in ACUrl syntax relative to the VBContent.
2. You use the column types VBDataGridTextColumn, VBDataGridComboBoxColumn, 
   VBDataGridCheckBoxColumn, VBDataGridDateTimeColumn or VBDataGridTemplateColumn which are extended in iPlus.
   

For larger amounts of data, we recommend using row virtualization using the EnableRowVirtualization property and the"Recycling" virtualizationmode:

<vb:VBDataGrid VBContent="SelectedFacilityCharge"  
               EnableRowVirtualization="True" 
               VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.VirtualizationMode="Recycling">   <DataGrid.Columns>       <vb:VBDataGridTextColumnVBContent="Material\MaterialNo" />       <vb:VBDataGridTextColumnVBContent="Material\MaterialName1">         <DataGridTextColumn.ElementStyle>           <
               

 
 

Style TargetType="vb:VBTextBlock"> 
          <Style.Triggers>   
            <DataTrigger Value="True"> 
              <DataTrigger.Binding> 
                <Binding Converter="{vb:ConverterBoolean vb:ACUrlCommand=!HighlightCell}" /> 
              </DataTrigger.Binding> 
              <Setter Property="Background" Value="Yellow" />   
            </DataTrigger>
          </Style.Triggers>   
        </Style>   
      </DataGridTextColumn.ElementStyle>   
    </vb:VBDataGridTextColumn>   
    <vb:VBDataGridTextColumn VBContent="StockQuantity" StringFormat="#,0.0" VBIsReadOnly="true"/>
    <vb:VBDataGridComboBoxColumn VBContent="FacilityLot" />   
    <vb:VBDataGridCheckBoxColumn VBContent="IsNotAvailable" />   
    <vb:VBDataGridDateTimeColumn VBContent="InsertDate" /> 
    <vb:VBDataGridTemplateColumn Header="Image">
      <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
          <Image Source="{Binding DefaultThumbImage}" />
        </DataTemplate>
      </DataGridTemplateColumn.CellTemplate>
    </vb:VBDataGridTemplateColumn>
  </DataGrid.Columns>
</vb:VBDataGrid>

VBTreeView is an extension of TreeView .

VBTreeView are Selector elements and implement the IVBSource interface . The interface defines the Selected property via VBContent and automatically binds the ItemsSource .

So that you can display hierarchical structures via VBContent, the bound elements (your model) must implement the interface " gip.core.datamodel. IACContainerWithItems " and optionally " gip.core.datamodel. IVBDataCheckbox ".

IACContainerWithItems is a derivative of IACContainer . Alternatively, there is also a generic interface  IACContainerWithItemsT < T , S > . This interface is used to create a tree structure by listing the child elements in the property " IEnumerable < IACContainerWithItems > Items ". VBTreeView iterates through this Items property to display the VBTreeViewItem graphic  elements (derived from TreeViewItem ).

If your model class   implements IVBDataCheckbox , the tree elements are provided with a CheckBox. IVBDataCheckBox has the properties IsChecked and IsEnabled. These properties are automatically linked to the corresponding dependency properties, the checkbox.

As with comboboxes and datagrids, you can  specify  a comma-separated list of columns that are to be displayed in a TreeViewItem in the VBShowColumns property. You address the columns in ACUrl syntax relative to the VBContent.

Important: In contrast to VBComboBox, VBListBox and VBDataGrid you have to set VBSource explicitly . In VBContent you specify the Selected property and in VBSource the root element of your tree model , which implements IACContainerWithItems:

 <vb:VBTreeView 
         VBContent="SelectedTreeItem" 
         VBSource="RootTreeItem" 
         VBShowColumns="ACCaption" 
         SortOrder="ACCaption" 
         AllowDrop="False" 
         ShowCaption="True">
 </vb:VBTreeView>

You can also use VBTreeView in the classic way with HierarchicalDataTemplates . Your bound model then does not  have to implement IACContainerWithItems either . In this case, you must not set the VBContent and the VBSource properties

VBProgressBar is an extension of ProgressBar .

The design of the VBProgressBar is adapted to the style of iPlus. It implements IVBContent so that you can automatically bind the Value property via VBContent:

<vb:VBProgressBar VBContent="CurrentProgressInfo\TotalProgressPercent" />

Set the properties of the RangeBase class to set the limits:

<vb:VBProgressBar 
Maximum="{vb:VBBinding Converter={vb:ConverterDouble}, vb:VBContent=CurrentProgressInfo\\TotalProgressRangeTo}" 
Minimum="{vb:VBBinding Converter={vb:ConverterDouble}, vb:VBContent=CurrentProgressInfo\\TotalProgressRangeFrom}" 
Value="{vb:VBBinding Converter={vb:ConverterDouble}, vb:VBContent=CurrentProgressInfo\\TotalProgressCurrent}" />

In case you don't know the range your bound Value property will have, set the IsIndeterminate property to let the user know that your program is active.

<vb:VBProgressBar IsIndeterminate="true" vb:VBContent=CurrentProgressInfo\\IsBusy}" />

Read in the chapter " Tasks in the background " how to use the VBProgressBar in connection with a business object.

Alternative designs

With the property  ProgressBarStyles ProgressBarStyle  you can display the progress bar in different designs:

public enum ProgressBarStyles : short
{
 DefaultBar = 0,
 NormalPie = 1,
 GlassyPie = 2,
 Circular = 3,
 CircularSegmented = 4,
 CircularPoints = 5,
 StopWatch = 6,
 PerformantBar = 7,
 CircularUnlimited = 8
}

Example to display a VBProgressBar as a stopwatch:

<vb:VBProgressBar 
  vb:ProgressBarStyle="StopWatch" 
  Maximum="{vb:VBBinding Converter={vb:ConverterDouble vb:ValueFromSubProperty=TotalSeconds}, vb:VBContent=WaitingTime}" 
  Value="{vb:VBBinding Converter={vb:ConverterDouble vb:ValueFromSubProperty=TotalSeconds}, vb:VBContent=ElapsedTime}">
</vb:VBProgressBar>

In the assembly gip.core.visualcontrols you will find the class  VBFillLevel, which extends VBProgressBar with further designs in order to be able to display a fill level bar:

<vbv:VBFillLevel Orientation="Vertical" Foreground="#FFFFE100" Height="250"
  VBContent="FillLevel" 
  Maximum="{vb:VBBinding vb:VBContent=MaxWeightCapacity}"
  ShowTickBar="True"
  TickFrequency="10">
</vbv:VBFillLevel>

VBSlider is an extension of the Slider class.