✨ Screen

ScreenData est la classe simulant le comportement d'un écran.
Vous ne définissez pas ScreenData directement, Unified Builder se charge de créer les instances de ScreenData automatiquement.

L'accès à l'instance principale de ScreenData se fait via une classe Builder.

      
const MainScreen = MyBuilder.EntryScreen
          
const MainScreen: ScreenData
 
La modification des données de l'écran se fait via la méthode SetData. Vous ne devez pas modifier les propriétés de l'écran de façon directe.

❌ Interdit

      
MyBuilder.EntryScreen.Name = "MyScreen"
 
 

✔️ Ok

      
MyBuilder.EntryScreen.SetData(function () {
    this.Name = "MyScreen"
})
 

Interface ScreenData

Voici les champs et les données chargées par défaut dans une instance de ScreenData

class ScreenData {
    private Hmi: Hmi
    Name: string = "Default_Screen"
    AlternateBackColor: Color = {R: 235, G: 235, B: 235}
    BackColor: Color = {R: 192, G: 192, B: 192}
    BackFillPattern: HmiFillPattern = HmiFillPattern.Solid
    BackGraphic: string = ""
    BackGraphicStretchMode: HmiGraphicStretchMode = HmiGraphicStretchMode.None
    BackGroundFillMode: HmiBackgroundFillMode = HmiBackgroundFillMode.Screen
    Enabled: boolean = true
    Height: number
    HorizontalAlignment: HmiHorizontalAlignment = HmiHorizontalAlignment.Center
    VerticalAlignment: HmiVerticalAlignment = HmiVerticalAlignment.Center
    Width: number
    DynamizationsGlobalDefinitionAreaScriptCode?: string[]
    EventHandlersGlobalDefinitionAreaScriptCode?: string[]
    Override: boolean = false
}

📜 Champs

Override

ScreenData.prototype.Override = boolean

Si vous avez mis l'option ForceOverride dans Builder à false, vous pouvez toujours décider de forcer l'écrasement d'un écran manuellement en utilisant ce booléen.

DynamizationsGlobalDefinitionAreaScriptCode

ScreenData.prototype.DynamizationsGlobalDefinitionAreaScriptCode = string[]

Ce champ permet de rajouter une zone de définition globale accessible à toutes les dynamisations des écrans.

MyBuilder.EntryScreen.SetData(function () {
    this.DynamizationsGlobalDefinitionAreaScriptCode = [
        "const Colors = {",
        "Green: 0xFF66FF00,",
        "Blue: 0xFF66FFFF,",
        "Red: 0xFFFF5733,",
        "White: 0xFFFFFFFF,",
        "Disabled: 0x33929292",
        "}"
    ]
})

Dans cet exemple, l'objet Color fournit des propriétés de couleurs qui peuvent être accédé par toutes les dynamisations des Items de vos écrans.

EventHandlersGlobalDefinitionAreaScriptCode

ScreenData.prototype.EventHandlersGlobalDefinitionAreaScriptCode = string[]

Ce champ permet de rajouter une zone de définition globale accessible à tous les éléments possédant des évenements.

Builder.EntryScreen.SetData(function () {
    this.EventHandlersGlobalDefinitionAreaScriptCode = [
        "const Colors = {",
        "Green: 0xFF66FF00,",
        "Blue: 0xFF66FFFF,",
        "Red: 0xFFFF5733,",
        "White: 0xFFFFFFFF,",
        "Disabled: 0x33929292",
        "}"
    ]
})

Dans cet exemple, l'objet Color fournit des propriétés de couleurs qui peuvent être accédé par toutes les évenements liés à votre écran.

Dans l'exemple interactif ci-dessous, vous pouvez essayer les modifications d'autres champs.

✨ Exemple

AlternateBackColor
BackColor
./my-entry-component.ts

Contexte

Contexte de création

Lorsque vous appellez la fonction SetData d'un écran depuis Builder, vous pouvez invoquer un objet de type Context. 

interface Context {
    ScreenData: ScreenData
    ScreenNumber: number 
    ScreenLength: number
}

Si plusieurs écrans ont besoin d'être créés, SetData sera appellé autant de fois que nécèssaire avec un nouveau contexte.

      
MyBuilder.EntryScreen.SetData(function (Context) {
    if (Context.ScreenNumber === 2)
        this.Name = "My_Screen_Number_2"
    
    if (Context.ScreenNumber === Context.ScreenLength -1)
        this.Name = "My_Last_Screen"
})
 
Table of Contents