Skip to content

Commit 1581099

Browse files
authored
Update readme file.
1 parent 1631574 commit 1581099

File tree

1 file changed

+81
-67
lines changed

1 file changed

+81
-67
lines changed

README.md

Lines changed: 81 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1107,6 +1107,87 @@ public class UsersView : DocumentView<UsersViewModel>
11071107

11081108
The `BindableScrollView` has the same binding logic as the `BindableListView`. It does not use virtualization and creates VisualElements for all items regardless of visibility.
11091109

1110+
#### BindingContextProvider
1111+
1112+
The `BindingContextProvider` allows you to provide a custom `IBindingContext` for all child elements.
1113+
1114+
Let's say we have the following binding contexts.
1115+
1116+
```csharp
1117+
public class MainViewModel : IBindingContext
1118+
{
1119+
[Observable]
1120+
private readonly IReadOnlyProperty<string> _title;
1121+
1122+
[Observable]
1123+
private readonly IReadOnlyProperty<CustomViewModel> _customViewModel;
1124+
1125+
public MainViewModel()
1126+
{
1127+
_title = new ReadOnlyProperty<string>("Main Context");
1128+
_customViewModel = new ReadOnlyProperty<CustomViewModel>(new CustomViewModel());
1129+
}
1130+
}
1131+
```
1132+
1133+
```csharp
1134+
public class CustomViewModel : IBindingContext
1135+
{
1136+
[Observable]
1137+
private readonly IReadOnlyProperty<string> _title;
1138+
1139+
public CustomViewModel()
1140+
{
1141+
_title = new ReadOnlyProperty<string>("Custom Context");
1142+
}
1143+
}
1144+
```
1145+
1146+
To provide the `CustomViewModel` as a binding context for certain elements, we have to use the `BindingContextProvider` as the parent for those elements.
1147+
1148+
```xml
1149+
<ui:UXML xmlns:uitk="UnityMvvmToolkit.UITK.BindableUIElements" ...>
1150+
<uitk:BindableLabel name="Label1" binding-text-path="Title" />
1151+
<!-- Binding context not specified. Will be used MainViewModel for all childs. -->
1152+
<uitk:BindingContextProvider>
1153+
<uitk:BindableLabel name="Label2" binding-text-path="Title" />
1154+
</uitk:BindingContextProvider>
1155+
<!-- Binding context is specified. Will be used CustomViewModel for all childs. -->
1156+
<uitk:BindingContextProvider binding-context-path="CustomViewModel">
1157+
<uitk:BindableLabel name="Label3" binding-text-path="Title" />
1158+
</uitk:BindingContextProvider>
1159+
</ui:UXML>
1160+
```
1161+
1162+
In this example, `Label1` and `Label2` will display the text "Main Context", while `Label3` will display the text "Custom Context".
1163+
1164+
We can create a `BindingContextProvider` for a specific `IBindingContext` to avoid allocating memory for a new `PropertyCastWrapper` class. Let's create a `CustomViewModelProvider` element.
1165+
1166+
```csharp
1167+
[UxmlElement]
1168+
public partial class CustomViewModelProvider : BindingContextProvider<CustomViewModel>
1169+
{
1170+
}
1171+
```
1172+
1173+
> **Note:** We use a [UxmlElement](#source-code-generator) attribute to create a custom control.
1174+
1175+
Now we can use the `CustomViewModelProvider` just like the default `BindingContextProvider`.
1176+
1177+
```xml
1178+
<ui:UXML xmlns:uitk="UnityMvvmToolkit.UITK.BindableUIElements" ...>
1179+
<uitk:BindableLabel name="Label1" binding-text-path="Title" />
1180+
<!-- Binding context not specified. Will be used MainViewModel for all childs. -->
1181+
<CustomViewModelProvider>
1182+
<uitk:BindableLabel name="Label2" binding-text-path="Title" />
1183+
</CustomViewModelProvider>
1184+
<!-- Binding context is specified. Will be used CustomViewModel for all childs. -->
1185+
<CustomViewModelProvider binding-context-path="CustomViewModel">
1186+
<uitk:BindableLabel name="Label3" binding-text-path="Title" />
1187+
</CustomViewModelProvider>
1188+
</ui:UXML>
1189+
```
1190+
11101191
### Create custom control
11111192

11121193
Let's create a `BindableImage` UI element.
@@ -1202,73 +1283,6 @@ public class ImageViewerViewModel : IBindingContext
12021283
</UXML>
12031284
```
12041285

1205-
#### BindingContextProvider
1206-
1207-
The `BindingContextProvider` allows you to provide a custom `IBindingContext` for all child elements.
1208-
1209-
Let's say we have the following binding contexts.
1210-
1211-
```csharp
1212-
public class MainViewModel : IBindingContext
1213-
{
1214-
[Observable]
1215-
private readonly IReadOnlyProperty<string> _title;
1216-
1217-
[Observable]
1218-
private readonly IReadOnlyProperty<CustomViewModel> _customViewModel;
1219-
1220-
public MainViewModel()
1221-
{
1222-
_title = new ReadOnlyProperty<string>("Main Context");
1223-
_customViewModel = new ReadOnlyProperty<CustomViewModel>(new CustomViewModel());
1224-
}
1225-
}
1226-
```
1227-
1228-
```csharp
1229-
public class CustomViewModel : IBindingContext
1230-
{
1231-
[Observable]
1232-
private readonly IReadOnlyProperty<string> _title;
1233-
1234-
public CustomViewModel()
1235-
{
1236-
_title = new ReadOnlyProperty<string>("Custom Context");
1237-
}
1238-
}
1239-
```
1240-
1241-
To provide the `CustomViewModel` as a binding context for certain elements, we have to create a `BindingContextProvider` and use it as the parent for those elements.
1242-
1243-
Let's create a `CustomViewModelProvider` element.
1244-
1245-
```csharp
1246-
[UxmlElement]
1247-
public partial class CustomViewModelProvider : BindingContextProvider<CustomViewModel>
1248-
{
1249-
}
1250-
```
1251-
1252-
> **Note:** We use a [UxmlElement](#source-code-generator) attribute to create a custom control.
1253-
1254-
Now we can use the `CustomViewModelProvider` as follows.
1255-
1256-
```xml
1257-
<ui:UXML xmlns:uitk="UnityMvvmToolkit.UITK.BindableUIElements" ...>
1258-
<uitk:BindableLabel name="Label1" binding-text-path="Title" />
1259-
<!-- Binding context not specified. Will be used MainViewModel for all childs. -->
1260-
<CustomViewModelProvider>
1261-
<uitk:BindableLabel name="Label2" binding-text-path="Title" />
1262-
</CustomViewModelProvider>
1263-
<!-- Binding context is specified. Will be used CustomViewModel for all childs. -->
1264-
<CustomViewModelProvider binding-context-path="CustomViewModel">
1265-
<uitk:BindableLabel name="Label3" binding-text-path="Title" />
1266-
</CustomViewModelProvider>
1267-
</ui:UXML>
1268-
```
1269-
1270-
In this example, `Label1` and `Label2` will display the text "Main Context", while `Label3` will display the text "Custom Context".
1271-
12721286
### Source code generator
12731287

12741288
The best way to speed up the creation of custom `VisualElement` is to use source code generators. With this powerful tool, you can achieve the same great results with minimal boilerplate code and focus on what really matters: programming!

0 commit comments

Comments
 (0)