Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update Slider page #1118

Merged
merged 1 commit into from
Nov 11, 2022
Merged

Update Slider page #1118

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 49 additions & 10 deletions WinUIGallery/ControlPages/SliderPage.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
<StackPanel>
<local:ControlExample x:Name="Example1" HeaderText="A simple Slider.">
<StackPanel Orientation="Horizontal">
<Slider x:Name="Slider1" AutomationProperties.Name="simple" Width="200" />
<Slider x:Name="Slider1" AutomationProperties.Name="simple slider" Width="200" />
</StackPanel>
<local:ControlExample.Output>
<TextBlock Text="{x:Bind Slider1.Value.ToString(), Mode=OneWay}" />
Expand All @@ -27,24 +27,63 @@
</x:String>
</local:ControlExample.Xaml>
</local:ControlExample>

<local:ControlExample x:Name="Example2" HeaderText="A Slider with range and steps specified.">
<StackPanel x:Name="Control2" Orientation="Horizontal">
<Slider x:Name="Slider2" Header="Control header" Width="200" Minimum="500" Maximum="1000"
LargeChange="100" StepFrequency="10" SmallChange="10" Value="800"/>
</StackPanel>
<local:ControlExample.Options>
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto" MinWidth="80"/>
</Grid.ColumnDefinitions>

<TextBlock x:Name="MinimumLabel" Text="Minimum:" Margin="0,0,0,0" Grid.Row="0" Grid.Column="0"/>
<NumberBox x:Name="MinimumValue" Grid.Row="0" Grid.Column="1" Margin="10,-5,0,0" Value="500" SpinButtonPlacementMode="Compact" AutomationProperties.Name="Minimum" AutomationProperties.AccessibilityView="Raw"/>

<TextBlock x:Name="MaximumLabel" Text="Maximum:" Margin="0,7,0,0" Grid.Row="1" Grid.Column="0"/>
<NumberBox x:Name="MaximumValue" Grid.Row="1" Grid.Column="1" Margin="10,5,0,0" Value="1000" SpinButtonPlacementMode="Compact" AutomationProperties.Name="Maximum" AutomationProperties.AccessibilityView="Raw"/>

<TextBlock x:Name="StepFrequencyLabel" Text="StepFrequency:" Margin="0,5,0,0" Grid.Row="2" Grid.Column="0"/>
<NumberBox x:Name="StepFrequencyValue" Grid.Row="2" Grid.Column="1" Margin="10,5,0,0" Value="10" SpinButtonPlacementMode="Compact" AutomationProperties.Name="Step Frequency" AutomationProperties.AccessibilityView="Raw" Minimum="1"/>

<TextBlock x:Name="SmallChangeLabel" Text="SmallChange:" Margin="0,5,0,0" Grid.Row="3" Grid.Column="0"/>
<NumberBox x:Name="SmallChangeValue" Grid.Row="3" Grid.Column="1" Margin="10,5,0,0" Value="10" SpinButtonPlacementMode="Compact" AutomationProperties.Name="Small Change" AutomationProperties.AccessibilityView="Raw"/>
</Grid>
</local:ControlExample.Options>
<local:ControlExample.Example>
<StackPanel x:Name="Control2" Orientation="Horizontal" VerticalAlignment="Center">
<Slider x:Name="Slider2" Header="Control header" Width="200" Minimum="{x:Bind MinimumValue.Value, Mode=OneWay}"
Maximum="{x:Bind MaximumValue.Value, Mode=OneWay}" StepFrequency="{x:Bind StepFrequencyValue.Value, Mode=OneWay}"
SmallChange="{x:Bind SmallChangeValue.Value, Mode=OneWay}" Value="800" Margin="0,0,10,0"/>
</StackPanel>
</local:ControlExample.Example>
<local:ControlExample.Output>
<TextBlock Text="{x:Bind Slider2.Value.ToString(), Mode=OneWay}" />
<TextBlock Text="{x:Bind Slider2.Value.ToString(), Mode=OneWay}"/>
</local:ControlExample.Output>
<local:ControlExample.Xaml>
<x:String xml:space="preserve">
&lt;Slider Width="200" Minimum="500" Maximum="1000" StepFrequency="10"
SmallChange="10" LargeChange="100" Value="800" /&gt;
&lt;Slider Width="200" Minimum="$(MinimumValue)" Maximum="$(MaximumValue)" StepFrequency="$(StepFrequencyValue)"
SmallChange="$(SmallChangeValue)" Value="$(Value)" /&gt;
</x:String>
</local:ControlExample.Xaml>
<local:ControlExample.Substitutions>
<local:ControlExampleSubstitution Key="MinimumValue" Value="{x:Bind MinimumValue.Value, Mode=OneWay}"/>
<local:ControlExampleSubstitution Key="MaximumValue" Value="{x:Bind MaximumValue.Value, Mode=OneWay}"/>
<local:ControlExampleSubstitution Key="StepFrequencyValue" Value="{x:Bind StepFrequencyValue.Value, Mode=OneWay}"/>
<local:ControlExampleSubstitution Key="SmallChangeValue" Value="{x:Bind SmallChangeValue.Value, Mode=OneWay}"/>
<local:ControlExampleSubstitution Key="Value" Value="{x:Bind Slider2.Value, Mode=OneWay}"/>
</local:ControlExample.Substitutions>
</local:ControlExample>

<local:ControlExample x:Name="Example3" HeaderText="A Slider with tick marks.">
<StackPanel Orientation="Horizontal">
<Slider x:Name="Slider3" Width="290" TickFrequency="10" TickPlacement="Outside" AutomationProperties.Name="Tick marks"/>
<Slider x:Name="Slider3" Width="290" TickFrequency="10" TickPlacement="Outside" AutomationProperties.Name="Slider with ticks"/>
</StackPanel>
<local:ControlExample.Output>
<TextBlock Text="{x:Bind Slider3.Value.ToString(), Mode=OneWay}" />
Expand All @@ -58,7 +97,7 @@
<local:ControlExample x:Name="Example4" HeaderText="A vertical slider with range and tick marks specified.">
<StackPanel Orientation="Horizontal">
<Slider x:Name="Slider4" Width="100" Height="100" Orientation="Vertical" TickFrequency="10" TickPlacement="Outside"
Maximum="50" Minimum="-50" AutomationProperties.Name="vertical"/>
Maximum="50" Minimum="-50" AutomationProperties.Name="vertical slider"/>
</StackPanel>
<local:ControlExample.Output>
<TextBlock Text="{x:Bind Slider4.Value.ToString(), Mode=OneWay}" />
Expand Down