-
Notifications
You must be signed in to change notification settings - Fork 338
/
VariableMultiValueConverterPage.xaml
175 lines (170 loc) · 9.31 KB
/
VariableMultiValueConverterPage.xaml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
<?xml version="1.0" encoding="utf-8" ?>
<pages:BasePage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:pages="clr-namespace:CommunityToolkit.Maui.Sample.Pages"
xmlns:vm="clr-namespace:CommunityToolkit.Maui.Sample.ViewModels.Converters"
xmlns:mct="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
x:Class="CommunityToolkit.Maui.Sample.Pages.Converters.VariableMultiValueConverterPage"
x:TypeArguments="vm:VariableMultiValueConverterViewModel"
x:DataType="vm:VariableMultiValueConverterViewModel">
<pages:BasePage.Resources>
<mct:VariableMultiValueConverter x:Key="AllTrueConverter"
ConditionType="All" />
<mct:VariableMultiValueConverter x:Key="AnyTrueConverter"
ConditionType="Any" />
<mct:VariableMultiValueConverter x:Key="GreaterThanConverter"
ConditionType="GreaterThan"
Count="2" />
</pages:BasePage.Resources>
<pages:BasePage.Content>
<ScrollView>
<Grid RowDefinitions="auto, auto, auto, 40, 36, 36, auto, auto, 40, 36, 36, auto, auto, 40, 36, 36, 36, 36"
ColumnDefinitions="40, *"
ColumnSpacing="12"
RowSpacing="4">
<Label Text="The VariableMultiValueConverter is a converter that allows users to convert multiple bool value bindings to a single bool. It does this by enabling them to specify whether All, Any, None or a specific number of values are true as specified in ConditionType. This is useful when combined with MultiBinding."
TextColor="{StaticResource NormalLabelTextColor}"
Grid.ColumnSpan="2" />
<!-- The All Condition Type -->
<Label Text="The All Condition Type"
Style="{StaticResource LabelSectionTitle}"
Margin="0, 8, 0, 0"
Grid.Row="1"
Grid.ColumnSpan="2" />
<Label Text="The box and label below will change when all the following switches are set to on."
TextColor="{StaticResource NormalLabelTextColor}"
Grid.Row="2"
Grid.ColumnSpan="2" />
<BoxView BackgroundColor="Red"
HeightRequest="40"
WidthRequest="40"
Grid.Row="3">
<BoxView.Triggers>
<DataTrigger TargetType="BoxView"
Value="true">
<DataTrigger.Binding>
<MultiBinding Converter="{StaticResource AllTrueConverter}">
<Binding Path="IsAllGroupSwitch1On" />
<Binding Path="IsAllGroupSwitch2On" />
</MultiBinding>
</DataTrigger.Binding>
<Setter Property="BackgroundColor"
Value="Green" />
</DataTrigger>
</BoxView.Triggers>
</BoxView>
<Label Grid.Row="3"
Grid.Column="1">
<Label.Text>
<MultiBinding Converter="{StaticResource AllTrueConverter}">
<Binding Path="IsAllGroupSwitch1On" />
<Binding Path="IsAllGroupSwitch2On" />
</MultiBinding>
</Label.Text>
</Label>
<Switch IsToggled="{Binding IsAllGroupSwitch1On, Mode=TwoWay}"
Grid.Row="4"
Grid.ColumnSpan="2" />
<Switch IsToggled="{Binding IsAllGroupSwitch2On, Mode=TwoWay}"
Grid.Row="5"
Grid.ColumnSpan="2" />
<!-- The Any Condition Type -->
<Label Text="The Any Condition Type"
Style="{StaticResource LabelSectionTitle}"
Margin="0, 8, 0, 0"
Grid.Row="6"
Grid.ColumnSpan="2" />
<Label Text="The box and label below will change when any of the following switches are set to on."
TextColor="{StaticResource NormalLabelTextColor}"
Grid.Row="7"
Grid.ColumnSpan="2" />
<BoxView BackgroundColor="Red"
HeightRequest="40"
WidthRequest="40"
Grid.Row="8">
<BoxView.Triggers>
<DataTrigger TargetType="BoxView"
Value="true">
<DataTrigger.Binding>
<MultiBinding Converter="{StaticResource AnyTrueConverter}">
<Binding Path="IsAnyGroupSwitch1On" />
<Binding Path="IsAnyGroupSwitch2On" />
</MultiBinding>
</DataTrigger.Binding>
<Setter Property="BackgroundColor"
Value="Green" />
</DataTrigger>
</BoxView.Triggers>
</BoxView>
<Label Grid.Row="8"
Grid.Column="1">
<Label.Text>
<MultiBinding Converter="{StaticResource AnyTrueConverter}">
<Binding Path="IsAnyGroupSwitch1On" />
<Binding Path="IsAnyGroupSwitch2On" />
</MultiBinding>
</Label.Text>
</Label>
<Switch IsToggled="{Binding IsAnyGroupSwitch1On, Mode=TwoWay}"
Grid.Row="9"
Grid.ColumnSpan="2" />
<Switch IsToggled="{Binding IsAnyGroupSwitch2On, Mode=TwoWay}"
Grid.Row="10"
Grid.ColumnSpan="2" />
<!-- The Greater Than Condition Type -->
<Label Text="The Greater Than Condition Type"
Style="{StaticResource LabelSectionTitle}"
Margin="0, 8, 0, 0"
Grid.Row="11"
Grid.ColumnSpan="2" />
<Label Text="The box and label below will change when more than two of the following switches are set to on."
TextColor="{StaticResource NormalLabelTextColor}"
Grid.Row="12"
Grid.ColumnSpan="2" />
<BoxView BackgroundColor="Red"
HeightRequest="40"
WidthRequest="40"
Grid.Row="13">
<BoxView.Triggers>
<DataTrigger TargetType="BoxView"
Value="true">
<DataTrigger.Binding>
<MultiBinding Converter="{StaticResource GreaterThanConverter}">
<Binding Path="IsGreaterThanGroupSwitch1On" />
<Binding Path="IsGreaterThanGroupSwitch2On" />
<Binding Path="IsGreaterThanGroupSwitch3On" />
<Binding Path="IsGreaterThanGroupSwitch4On" />
</MultiBinding>
</DataTrigger.Binding>
<Setter Property="BackgroundColor"
Value="Green" />
</DataTrigger>
</BoxView.Triggers>
</BoxView>
<Label Grid.Row="13"
Grid.Column="1">
<Label.Text>
<MultiBinding Converter="{StaticResource GreaterThanConverter}">
<Binding Path="IsGreaterThanGroupSwitch1On" />
<Binding Path="IsGreaterThanGroupSwitch2On" />
<Binding Path="IsGreaterThanGroupSwitch3On" />
<Binding Path="IsGreaterThanGroupSwitch4On" />
</MultiBinding>
</Label.Text>
</Label>
<Switch IsToggled="{Binding IsGreaterThanGroupSwitch1On, Mode=TwoWay}"
Grid.Row="14"
Grid.ColumnSpan="2" />
<Switch IsToggled="{Binding IsGreaterThanGroupSwitch2On, Mode=TwoWay}"
Grid.Row="15"
Grid.ColumnSpan="2" />
<Switch IsToggled="{Binding IsGreaterThanGroupSwitch3On, Mode=TwoWay}"
Grid.Row="16"
Grid.ColumnSpan="2" />
<Switch IsToggled="{Binding IsGreaterThanGroupSwitch4On, Mode=TwoWay}"
Grid.Row="17"
Grid.ColumnSpan="2" />
</Grid>
</ScrollView>
</pages:BasePage.Content>
</pages:BasePage>