Skip to content

Commit af9da21

Browse files
committed
Added new control: RangeSelector (from Comet)
Added StringFormatConverter
1 parent 6ded31d commit af9da21

File tree

13 files changed

+830
-5
lines changed

13 files changed

+830
-5
lines changed

Microsoft.Windows.Toolkit.SampleApp/Microsoft.Windows.Toolkit.SampleApp.csproj

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@
101101
<Content Include="Assets\Prettify\run_prettify.js" />
102102
<Content Include="Icons\Foundation.png" />
103103
<Content Include="Icons\Layouts.png" />
104+
<Content Include="SamplePages\RangeSelectorCode.txt" />
104105
<Content Include="SamplePages\ResponsiveGridViewCode.txt" />
105106
<Content Include="SamplePages\samples.json" />
106107
<None Include="readme.md" />
@@ -119,6 +120,9 @@
119120
<Compile Include="Models\PropertyDescriptor\PropertyKind.cs" />
120121
<Compile Include="Models\PropertyDescriptor\PropertyDescriptor.cs" />
121122
<Compile Include="Properties\Annotations.cs" />
123+
<Compile Include="SamplePages\RangeSelectorPage.xaml.cs">
124+
<DependentUpon>RangeSelectorPage.xaml</DependentUpon>
125+
</Compile>
122126
<Compile Include="Shell.xaml.cs">
123127
<DependentUpon>Shell.xaml</DependentUpon>
124128
</Compile>
@@ -165,6 +169,10 @@
165169
<SubType>Designer</SubType>
166170
<Generator>MSBuild:Compile</Generator>
167171
</Page>
172+
<Page Include="SamplePages\RangeSelectorPage.xaml">
173+
<Generator>MSBuild:Compile</Generator>
174+
<SubType>Designer</SubType>
175+
</Page>
168176
<Page Include="Shell.xaml">
169177
<Generator>MSBuild:Compile</Generator>
170178
<SubType>Designer</SubType>
@@ -191,6 +199,10 @@
191199
<Project>{e9faabfb-d726-42c1-83c1-cb46a29fea81}</Project>
192200
<Name>Microsoft.Windows.Toolkit.UI.Controls</Name>
193201
</ProjectReference>
202+
<ProjectReference Include="..\Microsoft.Windows.Toolkit.UI\Microsoft.Windows.Toolkit.UI.csproj">
203+
<Project>{3dd8aa7c-3569-4e51-992f-0c2257e8878e}</Project>
204+
<Name>Microsoft.Windows.Toolkit.UI</Name>
205+
</ProjectReference>
194206
<ProjectReference Include="..\Microsoft.Windows.Toolkit\Microsoft.Windows.Toolkit.csproj">
195207
<Project>{805F80DF-75C6-4C2F-8FD9-B47F6D0DF5A3}</Project>
196208
<Name>Microsoft.Windows.Toolkit</Name>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<RangeSelector x:Name="RangeSelector"
2+
Minimum="@[Minimum:Slider:0:10-100]"
3+
Maximum="@[Maximum:Slider:100:0-100]">
4+
</RangeSelector>
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<Page
2+
x:Class="Microsoft.Windows.Toolkit.SampleApp.SamplePages.RangeSelectorPage"
3+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5+
xmlns:local="using:Microsoft.Windows.Toolkit.SampleApp.Pages"
6+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
7+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
8+
xmlns:controls="using:Microsoft.Windows.Toolkit.UI.Controls"
9+
xmlns:converters="using:Microsoft.Windows.Toolkit.UI.Converters"
10+
mc:Ignorable="d">
11+
<Page.Resources>
12+
<converters:StringFormatConverter x:Key="StringFormatConverter"/>
13+
</Page.Resources>
14+
15+
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
16+
<Grid VerticalAlignment="Center" HorizontalAlignment="Center">
17+
<Grid.ColumnDefinitions>
18+
<ColumnDefinition Width="50"></ColumnDefinition>
19+
<ColumnDefinition Width="250"></ColumnDefinition>
20+
<ColumnDefinition Width="50"></ColumnDefinition>
21+
</Grid.ColumnDefinitions>
22+
<TextBlock Grid.Column="0" Text="{Binding RangeMin, ElementName=RangeSelector, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:0.##}'}"
23+
Foreground="Black"></TextBlock>
24+
<controls:RangeSelector x:Name="RangeSelector" Grid.Column="1"
25+
Minimum="{Binding Minimum.Value, Mode=TwoWay}"
26+
Maximum="{Binding Maximum.Value, Mode=TwoWay}">
27+
</controls:RangeSelector>
28+
<TextBlock Grid.Column="2" Text="{Binding RangeMax, ElementName=RangeSelector, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:0.##}'}"
29+
Foreground="Black"></TextBlock>
30+
</Grid>
31+
32+
</Grid>
33+
</Page>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
using Windows.UI.Xaml.Controls;
2+
using Windows.UI.Xaml.Navigation;
3+
using Microsoft.Windows.Toolkit.SampleApp.Models;
4+
5+
namespace Microsoft.Windows.Toolkit.SampleApp.SamplePages
6+
{
7+
public sealed partial class RangeSelectorPage : Page
8+
{
9+
public RangeSelectorPage()
10+
{
11+
this.InitializeComponent();
12+
}
13+
14+
protected override void OnNavigatedTo(NavigationEventArgs e)
15+
{
16+
base.OnNavigatedTo(e);
17+
18+
var propertyDesc = e.Parameter as PropertyDescriptor;
19+
20+
if (propertyDesc != null)
21+
{
22+
DataContext = propertyDesc.Expando;
23+
}
24+
}
25+
}
26+
}

Microsoft.Windows.Toolkit.SampleApp/SamplePages/samples.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,11 @@
1717
"Icon": "Icons/Foundation.png",
1818
"Samples": [
1919
{
20-
"Name": "SearchBox",
21-
"Type": "SearchBoxPage",
22-
"About": "The SearchBox control allows to handle the App search feature. You can decide how the control will be displayed using properties Foreground, Background, PlaceHolderText, FontSize, etc. The SearchCommand property establish the command to execute when the user press enter or click the magnifier.",
20+
"Name": "RangeSelector",
21+
"Type": "RangeSelectorPage",
22+
"About": "The RangeSelector is a \"double slider\" control for range values.",
2323
"CodeUrl": "https://github.com/deltakosh/UWPToolkit",
24-
"XamlCodeFile": "ResponsiveGridViewCode.txt"
24+
"XamlCodeFile": "RangeSelectorCode.txt"
2525
}
2626
]
2727
}

Microsoft.Windows.Toolkit.SampleApp/readme.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,20 @@ You can define "interactive" values in this file. The values can be:
4141
* Slider: You want the user to provide a double value. The string is built like this @[Name:**Slider**:Default value:min-max]
4242
* Enum: You want the user to provide a enum value @[Name:**Enum**:Default value]
4343

44+
You can then bind the value specified in your Xaml page (using xxx.Value path):
45+
46+
```
47+
<Grid Margin="10">
48+
<Grid.ColumnDefinitions>
49+
<ColumnDefinition Width="48"></ColumnDefinition>
50+
<ColumnDefinition></ColumnDefinition>
51+
</Grid.ColumnDefinitions>
52+
<TextBlock Grid.Column="1" Text="{Binding Text.Value, Mode=OneWay}" Foreground="Black"
53+
FontSize="{Binding FontSize.Value, Mode=OneWay}"
54+
VerticalAlignment="{Binding VerticalAlignment.Value, Mode=OneWay}"></TextBlock>
55+
</Grid>
56+
```
57+
4458
## Samples.json
4559
After creating your page and the binding text, you just need to reference it in the /SamplePages/samples.json file.
4660
Select the category where you want your page to be listed and add the following information:

Microsoft.Windows.Toolkit.UI.Controls/Microsoft.Windows.Toolkit.UI.Controls.csproj

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,8 @@
4949
<Compile Include="HamburgerMenu\HamburgerMenu.Events.cs" />
5050
<Compile Include="HamburgerMenu\HamburgerMenu.cs" />
5151
<Compile Include="Properties\AssemblyInfo.cs" />
52+
<Compile Include="RangeSelector\RangeChangedEventArgs.cs" />
53+
<Compile Include="RangeSelector\RangeSelector.cs" />
5254
<Compile Include="VariableSizedGrid\VariableSizedGrid.Properties.cs" />
5355
<Compile Include="VariableSizedGrid\VariableSizedGrid.cs" />
5456
<Compile Include="VariableSizedGrid\VariableSizedGridPanel.cs" />
@@ -61,6 +63,10 @@
6163
<Generator>MSBuild:Compile</Generator>
6264
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
6365
</Page>
66+
<Page Include="RangeSelector\RangeSelector.xaml">
67+
<Generator>MSBuild:Compile</Generator>
68+
<SubType>Designer</SubType>
69+
</Page>
6470
<Page Include="ResponsiveGridView\ResponsiveGridView.xaml">
6571
<Generator>MSBuild:Compile</Generator>
6672
<SubType>Designer</SubType>
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
using System;
2+
3+
namespace Microsoft.Windows.Toolkit.UI.Controls
4+
{
5+
/// <summary>
6+
/// Event args for a value changing event
7+
/// </summary>
8+
public class RangeChangedEventArgs : EventArgs
9+
{
10+
/// <summary>
11+
/// Gets the old value.
12+
/// </summary>
13+
public double OldValue { get; private set; }
14+
/// <summary>
15+
/// Gets the new value.
16+
/// </summary>
17+
public double NewValue { get; private set; }
18+
19+
/// <summary>
20+
/// Gets the range property that triggered the event
21+
/// </summary>
22+
public RangeSelectorProperty ChangedRangeProperty { get; private set; }
23+
24+
/// <summary>
25+
/// Initializes a new instance of the RangeChangedEventArgs class.
26+
/// </summary>
27+
/// <param name="oldValue">The old value</param>
28+
/// <param name="newValue">The new value</param>
29+
/// <param name="changedRangeProperty">The changed range property</param>
30+
public RangeChangedEventArgs(double oldValue, double newValue, RangeSelectorProperty changedRangeProperty)
31+
{
32+
OldValue = oldValue;
33+
NewValue = newValue;
34+
ChangedRangeProperty = changedRangeProperty;
35+
}
36+
}
37+
38+
/// <summary>
39+
/// Enumeration used to determine what value triggered ValueChanged event on the
40+
/// RangeSelector
41+
/// </summary>
42+
public enum RangeSelectorProperty
43+
{
44+
/// <summary>
45+
/// Minimum value was changed
46+
/// </summary>
47+
MinimumValue,
48+
/// <summary>
49+
/// Maximum value was changed
50+
/// </summary>
51+
MaximumValue
52+
}
53+
}

0 commit comments

Comments
 (0)