Revision Difference
ui_binding#527100
<title>UI Layout Binding</title>⤶
⤶
To enable interaction between code and layout, we enable binding.⤶
⤶
# Binding Variables⤶
⤶
Create a property on your component's code.⤶
⤶
```csharp⤶
public string MyVariable { get; set; }⤶
```⤶
⤶
Bind it to any property by adding @ before the property name.⤶
⤶
```html⤶
<text @text="MyVariable"></text>⤶
```⤶
⤶
The property will be updated when your variable changes.⤶
⤶
<note>The properties are polled at regular intervals. If the value if different we update the value. This is our comprimise between performance and ease of use.</note>⤶
⤶
# Binding Elements⤶
⤶
You can create a reference to an element.⤶
⤶
```csharp⤶
public Label GameTitle { get; set; }⤶
```⤶
⤶
```html⤶
<text @ref="GameTitle"></text>⤶
```⤶
⤶
This variable will be available immediately after the layout is loaded.⤶
⤶
```csharp⤶
LoadLayout( "/ui/mainmenu/mainmenu.htm" );⤶
⤶
GameTitle.Text = "s&box";⤶
GameTitle.Class.Add( "game_title" );⤶
```⤶