Displaying drawings via Shapes is an up & auml on the part of WPF A long process because it is derived from & nbsp; FrameworkElement . The use of shapes is recommended if you want to dynamize your drawing with triggers. If drawings should only be displayed statically, we recommend the use of lightweight Drawings . Drawings are shown using DrawingBrushes . More about this k & ouml; You can read it here .

DrawingBrushes, in turn, can be WPF-Resource in ResourceDictionaries & nbsp; . Thus, a DrawingBrush only needs to be loaded once with the XAML parser and then access is very efficient. Graphics created with Blend or Microsoft Expression Design can also be exported as a resource or drawing and inserted into the iPlus development environment.

Menu item in Blend: "Tools- & gt; Create Brush Resource- & gt; Create DrawingBrush Resource".
Menu item in Expression Design: "File- & gt; Export ...- & gt; XAML WPF Resource Dictionary ".

Save DrawingBrushes in iPlus as normal XAML designs ( Category DULayout / partial view ) with the indicator" WPF-Resource ". Make sure that the root element in the XAML code is & nbsp; DrawingBrush is:

& nbsp;

You can save JPEG, PNG and BMP images in the iPlus development environment as a design in the Bitmap category .

WPF can display images in two different ways:

1. With the " Image " control. Use the class VBImage in iPlus, which is a derivation of Image.
2. As ImageBrush in the Fill property of Shapes or Background property of the Border class .

Like DrawingBrushes, images can be stored as  WPF resources  in  ResourceDictionaries  . The advantages are lower memory consumption and  better performance.

Drawings and images are displayed in the tool window under Images, which you can drag and drop onto the drawing area (2) (3) :

 

Switch to the XAML editor. The following code was generated:

 

Using DrawingBrush (2)

In the example above, "CycloneMot" was saved in the development environment as DrawingBrush with the identifier "WPF-Resource". This is why the VBBorder class was used and the Background property set, which is Brush type. The background property is set via the iPlus markup extension class " gip.core.layoutengine. VBStaticResource ", which is a derivative of StaticResource .

 

VBStaticResource markup extension

The special feature about VBStaticResouce is that the resource key (ResourceKey) is  a database ACUrl, which refers to a data record in the ACClassDesign table, where the XAML code for a DrawingBrush or a bitmap is stored. After the DrawingBrush or bitmap has been loaded from the database, the object is immediately entered in the application's resource dictionary . The resource key remains the database ACUrl because it is unique. The next time the same resource is accessed, the database will no longer be accessed because it already exists in the global resource dictionary!

 

Use of images  (3)

In the example above, "BGSteel" was saved as a JPEG bitmap in the development environment. That is why the VBImage class was used (derived from Image ) and the source property , which is of the ImageSource type, is also set via VBStaticResource  .

 

Use as ImageBrush (1)

The example (1) in the picture above was entered manually in the XAML editor because there is no designer tool for it. The Fill property is set by decalarizing the ImageBrush . Here, also the ImageSource is loaded via  VBStaticResource .

 

The Businessobjects class has a design with the ACIdentifier "AppResourceDict". This design is a ResourceDictionary that contains many different styles. During the startup process, shortly before the main window is displayed, this ResourceDictionary is loaded into the global ResourceDictionary of the application. You can extend this "AppResourceDict" design in the development environment with your own styles in order to be able to adapt the "look and feel" of the entire application.

 

Globally adapting the styles of a control

If you want to set the style of a control globally, then you need the "Target Type" and "BasedOn" property with the "X: Type" - MarkupExtension set:

<Style TargetType="{x:Type vb:VBTextBlock}" BasedOn="{x:Type vb:VBTextBlock}">
  <Style.Setters> 
    <Setter Property="FontSize" Value="16" /> 
    <Setter Property="FontWeight" Value="Bold" /> 
    <Setter Property="Foreground" Value="#FFFF0000" /> 
  </Style.Setters>
</Style>

 

Define a named style

If you occasionally need a certain style in your designs, then define the style using the "x: Key" attribute in the "AppResourceDict":

<Style x:Key="globalStyleHeadlineText" 
TargetType="{x:Type vb:VBTextBlock}" BasedOn="{x:Type vb:VBTextBlock}">
  <Style.Setters> 
    <Setter Property="FontSize" Value="16" /> 
    <Setter Property="FontWeight" Value="Bold" /> 
    <Setter Property="Foreground" Value="#FFFF0000" /> 
  </Style.Setters>
</Style>

You reference this style in your designs via StaticResource:

 <vb:VBTextBlock VBContent="SelectedOutPointConfig\ACCaption" 
  Style="{vb:VBStaticResource globalStyleHeadlineText}"  />

 

Optimization for touch screens

If your application created with iPlus should also be operated on touch screens, then certain controls must be displayed larger. Conversely, if a touchscreen is not used, the enlarged controls might be impractical because a lot of screen space is lost. However, so that you do not have to program two different designs, iPlus provides the Boolean property "TouchScreenMode" in the global ResourceDictionary. This property is true if the user has activated the "Touchscreen" checkbox in the login window.

You then only have to access this value in your designs via StaticResource. In the following example this is done with data triggers:

The minimum row height for datagrids was defined in the first data trigger. All child datagrids display its rows with at least 60 pixels so that the user can better hit the rows with his finger.

In the second data trigger, the buttons should be displayed with a height of 60 pixels.