-
Notifications
You must be signed in to change notification settings - Fork 0
/
MainWindow.xaml
183 lines (160 loc) · 9.16 KB
/
MainWindow.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
176
177
178
179
180
181
182
183
<!-- ........................................................ -->
<!-- Copyright 2014 Tobii Technology AB. All rights reserved. -->
<!-- ........................................................ -->
<Window x:Class="ActivatableElements.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:eyeX="clr-namespace:EyeXFramework.Wpf;assembly=EyeXFramework"
Title="MainWindow" Height="600" Width="800" WindowStartupLocation="CenterScreen">
<!-- This WPF sample illustrates how FrameworkElements can be enabled for EyeX Direct Click
by setting the Activatable Behavior on them.
EyeX Direct Click works like this for the user:
- The user looks at the element he/she wants to click on
- The user presses and releases the Direct Click key (or EyeX Button) on the keyboard
(typically the Right Ctrl key, but this can be changed in the EyeX Interaction settings).
An activation event is fired when the Direct Click key is released and the
EyeX Engine finds a suitable EyeX clickable region (a so called 'interactor')
to activate.
Read more about the Activatable Behavior and its associated concepts in the
Developer's Guide (available online and in the SDK docs/ folder) -->
<Window.Resources>
<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="MaxWidth" Value="200" />
<Setter Property="MaxHeight" Value="75" />
<Setter Property="Margin" Value="10" />
<Setter Property="Padding" Value="10" />
</Style>
<Style x:Key="EyeXActivatableButtonStyle" BasedOn="{StaticResource ButtonStyle}" TargetType="Button">
<!-- By use of attached properties, we can specify that: the button is activatable,
that we do not want tentative activation focus events, and what handler should
be called when the button is activated.
Read more about the Activatable Behavior and its associated concepts in the
Developer's Guide (available online and in the SDK docs/ folder) -->
<Setter Property="eyeX:Behavior.Activatable" Value="Default" />
<EventSetter Event="eyeX:Behavior.Activate" Handler="Button_OnEyeXActivate" />
<!-- We also set up a trigger on the Behavior.ActivationFocus attached property, and
specify how the button should look when focused for activation.
Alternatively, we could have registered an event handler for the routed
event Behavior.ActivationFocusChanged and done the handling in the code behind
or via the MainWindowModel. -->
<Style.Triggers>
<Trigger Property="eyeX:Behavior.ActivationFocus" Value="HasActivationFocus">
<Setter Property="BorderBrush" Value="DarkGray" />
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Window.CommandBindings>
<CommandBinding Command="Close"
Executed="CloseCommand_OnExecuted"
CanExecute="CloseCommand_OnCanExecute"/>
</Window.CommandBindings>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="85*" />
<RowDefinition Height="15*" />
</Grid.RowDefinitions>
<ItemsControl ItemsSource="{Binding Notes}" Grid.Row="0">
<!-- ItemsPanelTemplate -->
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="5*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="5*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<!-- ItemContainerStyle -->
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Grid.Column" Value="{Binding ColumnIndex}" />
<Setter Property="Grid.Row" Value="{Binding RowIndex}" />
<Setter Property="Grid.ColumnSpan" Value="2" />
<Setter Property="Grid.RowSpan" Value="3" />
<!-- By use of attached properties, we can specify that: the item is activatable,
that we do not want tentative activation focus events, and what handler should
be called when the item is activated.
These values have to be specified on the ItemContainerStyle level, it will
not work on the ItemTemplate level.
Read more about the Activatable Behavior and its associated concepts in the
Developer's Guide (available online and in the SDK docs/ folder) -->
<Setter Property="eyeX:Behavior.Activatable" Value="Default" />
<EventSetter Event="eyeX:Behavior.Activate" Handler="Note_OnEyeXActivate" />
</Style>
</ItemsControl.ItemContainerStyle>
<!-- ItemTemplate -->
<ItemsControl.ItemTemplate>
<DataTemplate>
<!-- (We use the trick of putting a border around the text block so that the
text can be centralized vertically.) -->
<Border VerticalAlignment="Stretch"
BorderBrush="{x:Null}"
Background="{Binding BackgroundColor}"
MouseLeftButtonUp="Note_OnMouseLeftButtonUp">
<TextBlock TextWrapping="WrapWithOverflow"
TextAlignment="Center"
Padding="20"
VerticalAlignment="Center"
Text="{Binding Text}" />
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right" Margin="10 0 10 10">
<TextBlock Text="The MainWindow.xaml is a good starting point for understanding this sample."
TextAlignment="Left"
VerticalAlignment="Center"
Margin="0 0 20 0" />
<!-- The two buttons below, together with the code behind, illustrates
how an EyeX activation event can invoke the click event handler or
execute a command on a button.
The EyeX activation handler is specified in the EyeXActivatableStyle
element above. -->
<!-- The Restore wisdom button specifies a click event handler -->
<Button HorizontalAlignment="Left"
MaxWidth="200"
MaxHeight="75"
Margin="10"
Padding="10"
Click="RestoreWisdomButton_OnClick"
Style="{StaticResource EyeXActivatableButtonStyle}"
eyeX:Behavior.Activatable="Default"
eyeX:Behavior.Activate="Button_OnEyeXActivate">
Click me!
</Button>
<!-- The Close button specifies a command.
The command binding is specified in the Window.CommandBindings element above -->
<Button HorizontalAlignment="Left"
MaxWidth="200"
MaxHeight="75"
Margin="10"
Padding="10"
Command="ApplicationCommands.Close"
Style="{StaticResource EyeXActivatableButtonStyle}">
Close window
</Button>
</StackPanel>
</Grid>
</Window>