Jump to: navigation, search

Difference between revisions of "HowTo:Inject UI into UBIK Studio"


Line 38: Line 38:
 
[[File:InjectedButton.png|thumb|left|290px|Injected button]]<br><br><br><br><br><br><br><br><br><br><br>
 
[[File:InjectedButton.png|thumb|left|290px|Injected button]]<br><br><br><br><br><br><br><br><br><br><br>
 
=== Implementation ===
 
=== Implementation ===
1. Paste your Window in the plugin solution.<br>
+
1. Create or reuse a .Net library (DLL) project - it doesn't have to be a {{UBIK}} Module.<br>
2. Create a new class that implements IUBIKWindowFactory.
+
2. Add the designated window as a class deriving from System.Windows.Window to the project.<br>
 +
3. Create a new class.<br>
 +
4. Implement the inferface IUBIKWindowFactory for the new class.<br>
 +
5. For automatic injection, add the "Export" Attribute with the "IUBIKWindowFactory" type parameter to the designated class.<br>
 
<syntaxhighlight lang="csharp">
 
<syntaxhighlight lang="csharp">
 
[Export(typeof(IUBIKWindowFactory))]
 
[Export(typeof(IUBIKWindowFactory))]
 
public class TestWindowFactory : IUBIKWindowFactory
 
public class TestWindowFactory : IUBIKWindowFactory
 
{
 
{
     public Bitmap Icon => Image;
+
     public Bitmap Icon =>Properties.Resources.IntelligentAtelierImage;
  
     public string Label => "Test";
+
     public string Label => Properties.Resources.IntelligentAtelierLabel;
  
 
     public Window GetWindow(UBIKEnvironment env)
 
     public Window GetWindow(UBIKEnvironment env)
Line 54: Line 57:
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>
3. Assign values to the "Icon" and "Lable" properties they will be used for the button.<br>
+
6. The class now has a Icon and Label property.<br>
4. In the GetWindow Method return the window that you moved to the solution.<br>
+
7. Set the values for both properties. The icon and label can be loaded directly from the .NET project's resources. The button and the menu entry will then display these values.
5. After making the changes, make sure to update the plugin in the injection folder.<br>
+
4. In the GetWindow method, return the window from step 2.<br>
6. When starting {{UBIK}} Studio the new button will show up in the tool bar.<br><br>
+
7. Provide the updated DLL containing your UserControl in UBIK® Studio's [[Injection_Management#Injection_Folder.28s.29|Injection]] folder.<br>
 +
8. After connecting to a database with UBIK® Studio, the new control can be accessed by the new button in the tool bar aswell as under menu entry "View".<br><br>
 
<!-- DO NOT REMOVE THIS -->{{Template:HowTo/End}}<!-- DO NOT REMOVE THIS -->
 
<!-- DO NOT REMOVE THIS -->{{Template:HowTo/End}}<!-- DO NOT REMOVE THIS -->
  

Revision as of 07:44, 17 June 2026

Wiki Under Construction Start.PNG

Since version 5.2 it is possible to inject UI into UBIK® Studio.
The injected UI can be displayed inside a User Control and or Window.
This article will help you to inject your UI!

[edit]

User Control

Goal

The goal is to extend the existing user control list with the injected user control.
The mentioned list pops up every time you drag an instance to a new window.

Extended user control list





















Implementation

1. Create or reuse a .Net library (DLL) project - it doesn't have to be a UBIK® Module.
2. Add the designated control as a class deriving from System.Windows.Forms.UserControl to the project.
3.Implement the interface IUBIKEnvironmentControl for the control.
4. For automatic injection, add the "Export" Attribute with the "IUBIKControl" type parameter to the designated control.

[Export(typeof(IUBIKControl))]
public partial class TestUserControl: UserControl, IUBIKEnvironmentControl

5. The user control now has a property Description and Image.
6. Set the properties in the User Control's constructor. The image and description can be loaded directly from the .NET project's resources. These values will then be displayed in the User Control list.

  public TestUserControl()
  {
      InitializeComponent();
      Description = Properties.Resources.Description;
      Image = Properties.Resources.MyImage;
  }

7. Provide the updated DLL containing your UserControl in UBIK® Studio's Injection folder.
8. After connecting to a database with UBIK® Studio, the new control can be accessed by right-clicking or dragging a UBIK® object on a tab header - it should appear in the list of possible controls.

Window

Overview

A additional button can be added to the tool bar

Injected button











Implementation

1. Create or reuse a .Net library (DLL) project - it doesn't have to be a UBIK® Module.
2. Add the designated window as a class deriving from System.Windows.Window to the project.
3. Create a new class.
4. Implement the inferface IUBIKWindowFactory for the new class.
5. For automatic injection, add the "Export" Attribute with the "IUBIKWindowFactory" type parameter to the designated class.

[Export(typeof(IUBIKWindowFactory))]
public class TestWindowFactory : IUBIKWindowFactory
{
    public Bitmap Icon =>Properties.Resources.IntelligentAtelierImage;

    public string Label => Properties.Resources.IntelligentAtelierLabel;

    public Window GetWindow(UBIKEnvironment env)
    {
        return new TestWindow(env);
    }
}

6. The class now has a Icon and Label property.
7. Set the values for both properties. The icon and label can be loaded directly from the .NET project's resources. The button and the menu entry will then display these values. 4. In the GetWindow method, return the window from step 2.
7. Provide the updated DLL containing your UserControl in UBIK® Studio's Injection folder.
8. After connecting to a database with UBIK® Studio, the new control can be accessed by the new button in the tool bar aswell as under menu entry "View".

See also

tbd.