Skip to content

Commit 1b5614e

Browse files
ghost1372ghost1372
committed
Add EyeTracking and HoldToConfirm Samples
1 parent bf18b7f commit 1b5614e

5 files changed

Lines changed: 136 additions & 1 deletion

File tree

‎dev/DevWinUI.Gallery/Assets/NavViewMenu/AppData.json‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
{
1+
{
22
"$schema": "https://raw.githubusercontent.com/Ghost1372/DevWinUI/refs/heads/main/tools/AppData.Schema.json",
33
"Groups": [
44
{
@@ -208,6 +208,20 @@
208208
"ImagePath": "ms-appx:///Assets/Fluent/RatingControl.png",
209209
"IsSpecialSection": false,
210210
"Items": [
211+
{
212+
"UniqueId": "DevWinUIGallery.Views.HoldToConfirmPage",
213+
"Title": "Hold To Confirm",
214+
"Subtitle": "A press-and-hold button that fills while held and morphs into a confirmed state, with spring-back on release",
215+
"IsNew": true,
216+
"ImagePath": "ms-appx:///Assets/Fluent/Button.png"
217+
},
218+
{
219+
"UniqueId": "DevWinUIGallery.Views.EyeTrackingPage",
220+
"Title": "Eye Tracking",
221+
"Subtitle": "Animated eyes that follow the pointer, blink and react in realistic, cartoon, minimal or cyber styles",
222+
"IsNew": true,
223+
"ImagePath": "ms-appx:///Assets/Fluent/Image.png"
224+
},
211225
{
212226
"UniqueId": "DevWinUIGallery.Views.OrbitCardStackPage",
213227
"Title": "Orbit Card Stack",

‎dev/DevWinUI.Gallery/Views/Pages/Features/EyeTrackingPage.xaml‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<?xml version="1.0" encoding="utf-8" ?>
2+
<Page x:Class="DevWinUIGallery.Views.EyeTrackingPage"
3+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6+
xmlns:dev="using:DevWinUI"
7+
xmlns:local="using:DevWinUIGallery"
8+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
9+
mc:Ignorable="d">
10+
11+
<ScrollViewer>
12+
<StackPanel Margin="10" dev:PanelAttach.ChildrenTransitions="Default" Spacing="10">
13+
<local:ControlExample DocPage="controls/eyeTracking" HeaderText="EyeTracking">
14+
<local:ControlExample.Xaml>
15+
<x:String>
16+
&lt;dev:EyeTracking Kind="Realistic" EyeCount="2" EyeSize="120" Gap="40" PupilRange="0.7" BlinkInterval="4000" GlobalMouseTracking="True" /&gt;
17+
</x:String>
18+
</local:ControlExample.Xaml>
19+
<local:ControlExample.Pane>
20+
<StackPanel Spacing="10">
21+
<ComboBox x:Name="CmbKind" Header="Kind" ItemsSource="{x:Bind KindItems, Mode=OneWay}" SelectedIndex="0" />
22+
<Slider x:Name="SliderEyeCount" Header="Eye Count" Maximum="6" Minimum="1" Value="2" />
23+
<Slider x:Name="SliderEyeSize" Header="Eye Size" Maximum="240" Minimum="40" Value="120" />
24+
<Slider x:Name="SliderGap" Header="Gap" Maximum="120" Minimum="0" Value="40" />
25+
<Slider x:Name="SliderPupilRange" Header="Pupil Range" Maximum="1" Minimum="0" StepFrequency="0.05" Value="0.7" />
26+
<Slider x:Name="SliderBlinkInterval" Header="Blink Interval (ms)" Maximum="10000" Minimum="0" StepFrequency="250" Value="4000" />
27+
<ToggleSwitch x:Name="TglGlobalMouse" Header="Global Mouse Tracking" IsOn="True" />
28+
<ToggleSwitch x:Name="TglIdle" Header="Idle Animation" IsOn="True" />
29+
<ToggleSwitch x:Name="TglReactive" Header="Reactive Pupil" IsOn="True" />
30+
<ToggleSwitch x:Name="TglReflection" Header="Show Reflection" IsOn="True" />
31+
<ToggleSwitch x:Name="TglIrisDetail" Header="Show Iris Detail" IsOn="True" />
32+
<ToggleSwitch x:Name="TglEyelids" Header="Show Eyelids" IsOn="True" />
33+
</StackPanel>
34+
</local:ControlExample.Pane>
35+
<StackPanel Spacing="10">
36+
<dev:EyeTracking HorizontalAlignment="Center" VerticalAlignment="Center" BlinkInterval="{x:Bind SliderBlinkInterval.Value, Mode=OneWay}" EyeCount="{x:Bind ToInt(SliderEyeCount.Value), Mode=OneWay}" EyeSize="{x:Bind SliderEyeSize.Value, Mode=OneWay}" Gap="{x:Bind SliderGap.Value, Mode=OneWay}" GlobalMouseTracking="{x:Bind TglGlobalMouse.IsOn, Mode=OneWay}" IdleAnimation="{x:Bind TglIdle.IsOn, Mode=OneWay}" Kind="{x:Bind ((dev:EyeKind)CmbKind.SelectedItem), Mode=OneWay}" PupilRange="{x:Bind SliderPupilRange.Value, Mode=OneWay}" ReactivePupil="{x:Bind TglReactive.IsOn, Mode=OneWay}" ShowEyelids="{x:Bind TglEyelids.IsOn, Mode=OneWay}" ShowIrisDetail="{x:Bind TglIrisDetail.IsOn, Mode=OneWay}" ShowReflection="{x:Bind TglReflection.IsOn, Mode=OneWay}" />
37+
<Grid>
38+
<dev:EyeTracking EyeSize="120" Kind="Realistic" />
39+
<dev:EyeTracking IrisBrush="{ThemeResource CyberIrisBrush}" Kind="Cyber" />
40+
</Grid>
41+
</StackPanel>
42+
</local:ControlExample>
43+
</StackPanel>
44+
</ScrollViewer>
45+
</Page>

‎dev/DevWinUI.Gallery/Views/Pages/Features/EyeTrackingPage.xaml.cs‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
namespace DevWinUIGallery.Views;
2+
3+
public sealed partial class EyeTrackingPage : Page
4+
{
5+
public ObservableCollection<EyeKind> KindItems { get; set; } = new ObservableCollection<EyeKind>(Enum.GetValues<EyeKind>());
6+
7+
public EyeTrackingPage()
8+
{
9+
InitializeComponent();
10+
}
11+
12+
private static int ToInt(double value) => (int)value;
13+
}

‎dev/DevWinUI.Gallery/Views/Pages/Features/HoldToConfirmPage.xaml‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<?xml version="1.0" encoding="utf-8" ?>
2+
<Page x:Class="DevWinUIGallery.Views.HoldToConfirmPage"
3+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6+
xmlns:dev="using:DevWinUI"
7+
xmlns:local="using:DevWinUIGallery"
8+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
9+
mc:Ignorable="d">
10+
11+
<ScrollViewer>
12+
<StackPanel Margin="10" dev:PanelAttach.ChildrenTransitions="Default" Spacing="10">
13+
<local:ControlExample DocPage="controls/holdToConfirm" HeaderText="HoldToConfirm">
14+
<local:ControlExample.Xaml>
15+
<x:String>
16+
&lt;dev:HoldToConfirm Label="Hold to confirm" ConfirmedLabel="Confirmed" Duration="1200" IconGlyph="&amp;#xE72E;" /&gt;
17+
</x:String>
18+
</local:ControlExample.Xaml>
19+
<local:ControlExample.Pane>
20+
<StackPanel Spacing="10">
21+
<TextBox x:Name="TxtLabel" Header="Label" Text="Hold to confirm" />
22+
<TextBox x:Name="TxtConfirmedLabel" Header="Confirmed Label" Text="Confirmed" />
23+
<ComboBox x:Name="CmbKind" Header="Kind" ItemsSource="{x:Bind KindItems, Mode=OneWay}" SelectedIndex="0" />
24+
<ComboBox x:Name="CmbSize" Header="Size" ItemsSource="{x:Bind SizeItems, Mode=OneWay}" SelectedIndex="1" />
25+
<Slider x:Name="SliderDuration" Header="Duration (ms)" Maximum="5000" Minimum="200" StepFrequency="100" Value="1200" />
26+
<ToggleSwitch x:Name="TglIcon" Header="Show Icon" IsOn="True" />
27+
<ToggleSwitch x:Name="TglAnimation" Header="Is Animation Enabled" IsOn="True" />
28+
<Button Click="ResetButton_Click" Content="Reset" />
29+
</StackPanel>
30+
</local:ControlExample.Pane>
31+
<StackPanel HorizontalAlignment="Center" Spacing="12">
32+
<dev:HoldToConfirm x:Name="Sample" Confirm="Sample_Confirm" ConfirmedLabel="{x:Bind TxtConfirmedLabel.Text, Mode=OneWay}" IconGlyph="{x:Bind GetGlyph(TglIcon.IsOn), Mode=OneWay}" IsAnimationEnabled="{x:Bind TglAnimation.IsOn, Mode=OneWay}" Kind="{x:Bind ((dev:HoldToConfirmKind)CmbKind.SelectedItem), Mode=OneWay}" Label="{x:Bind TxtLabel.Text, Mode=OneWay}" Size="{x:Bind ((dev:HoldToConfirmSize)CmbSize.SelectedItem), Mode=OneWay}" Duration="{x:Bind SliderDuration.Value, Mode=OneWay}" />
33+
<TextBlock x:Name="StatusText" HorizontalAlignment="Center" Foreground="{ThemeResource TextFillColorSecondaryBrush}" Text="Press and hold the button" />
34+
</StackPanel>
35+
</local:ControlExample>
36+
</StackPanel>
37+
</ScrollViewer>
38+
</Page>

‎dev/DevWinUI.Gallery/Views/Pages/Features/HoldToConfirmPage.xaml.cs‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
namespace DevWinUIGallery.Views;
2+
3+
public sealed partial class HoldToConfirmPage : Page
4+
{
5+
public ObservableCollection<HoldToConfirmKind> KindItems { get; set; } = new ObservableCollection<HoldToConfirmKind>(Enum.GetValues<HoldToConfirmKind>());
6+
public ObservableCollection<HoldToConfirmSize> SizeItems { get; set; } = new ObservableCollection<HoldToConfirmSize>(Enum.GetValues<HoldToConfirmSize>());
7+
8+
public HoldToConfirmPage()
9+
{
10+
InitializeComponent();
11+
}
12+
13+
private static string GetGlyph(bool isOn) => isOn ? "\uE72E" : string.Empty;
14+
15+
private void Sample_Confirm(HoldToConfirm sender, object? args)
16+
{
17+
StatusText.Text = $"Confirmed at {DateTime.Now:T}";
18+
}
19+
20+
private void ResetButton_Click(object sender, RoutedEventArgs e)
21+
{
22+
Sample.Reset();
23+
StatusText.Text = "Press and hold the button";
24+
}
25+
}

0 commit comments

Comments
 (0)