Slider | Add Slider #32

trimble-oss · Sep 4, 2023 · c7a997c · c7a997c
1 parent a9dc886
commit c7a997c
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 42 deletions.
diff --git a/DemoApp/DemoApp/MainPage.xaml.cs b/DemoApp/DemoApp/MainPage.xaml.cs
@@ -27,9 +27,9 @@ public MainPage()
                 "ProgressBar",
                 "RadioButton",
                 "SegmentedControl",
+                "Slider",
                 "Spinner",
                 "Switch",
-                "Slider",
                 "TabbedPage",
                 "Toast"
             };

diff --git a/DemoApp/DemoApp/Views/SliderSamplePage.xaml b/DemoApp/DemoApp/Views/SliderSamplePage.xaml
@@ -5,44 +5,48 @@
              xmlns:modus="clr-namespace:Trimble.Modus.Components;assembly=Trimble.Modus.Components"
              xmlns:local="clr-namespace:DemoApp.ViewModels"
              Title="Slider">
-  <StackLayout Orientation="Vertical">
-    <modus:TMInput Text="{Binding MinimumValueText, Mode=TwoWay}"
-                   Placeholder="Enter minimum value"
-                   TitleText="Minimum value" />
-    <modus:TMInput Text="{Binding MaximumValueText, Mode=TwoWay}"
-                   Placeholder="Enter Maximum value"
-                   TitleText="Maximum value" />
-    <modus:TMRadioButtonGroup x:Name="SliderSize"
-                              SelectedIndex="1"
-                              SelectedRadioButtonChangedCommand="{Binding SizeRadioButtonCommand}">
-      <modus:TMRadioButton Text="Small"
-                           Value="0" />
-      <modus:TMRadioButton Text="Medium"
-                           Value="1" />
-      <modus:TMRadioButton Text="Large"
-                           Value="2" />
-    </modus:TMRadioButtonGroup>
-    <modus:TMCheckBox Text="Show Steps"
-                      IsChecked="{Binding ShowSteps, Mode=TwoWay}" />
-    <modus:TMCheckBox Text="Show ToolTips"
-                      IsChecked="{Binding ShowTooltip, Mode=TwoWay}" />
-    <modus:TMCheckBox Text="IsEnable"
-                      IsChecked="{Binding IsEnabled, Mode=TwoWay}" />
-    <modus:TMRangeSlider MaximumValue="{Binding MaximumValue}"
-                         MinimumValue="{Binding MinimumValue}"
-                         Size="{Binding Source={RelativeSource AncestorType={x:Type local:SliderViewModel}}, Path=Size}"
-                         ShowSteps="{Binding ShowSteps}"
-                         ShowToolTip="{Binding ShowTooltip}"
-                         IsEnabled="{Binding IsEnabled}"
-                         RightIconSource="placeholder.png"
-                         LeftIconSource="placeholder.png" />
-    <modus:TMSlider MaximumValue="{Binding MaximumValue}"
-                    MinimumValue="{Binding MinimumValue}"
-                    Size="{Binding Source={RelativeSource AncestorType={x:Type local:SliderViewModel}}, Path=Size}"
-                    ShowSteps="{Binding ShowSteps}"
-                    ShowToolTip="{Binding ShowTooltip}"
-                    IsEnabled="{Binding IsEnabled}"
-                    RightIconSource="placeholder.png"
-                    LeftIconSource="placeholder.png" />
-  </StackLayout>
-</ContentPage>
+  <ScrollView Margin="4">
+    <StackLayout Orientation="Vertical">
+      <modus:TMInput Text="{Binding MinimumValueText, Mode=TwoWay}"
+                     Placeholder="Enter minimum value"
+                     TitleText="Minimum value" />
+      <modus:TMInput Text="{Binding MaximumValueText, Mode=TwoWay}"
+                     Placeholder="Enter Maximum value"
+                     TitleText="Maximum value" />
+      <modus:TMRadioButtonGroup x:Name="SliderSize"
+                                SelectedIndex="1"
+                                SelectedRadioButtonChangedCommand="{Binding SizeRadioButtonCommand}">
+        <modus:TMRadioButton Text="Small"
+                             Value="0" />
+        <modus:TMRadioButton Text="Medium"
+                             Value="1" />
+        <modus:TMRadioButton Text="Large"
+                             Value="2" />
+      </modus:TMRadioButtonGroup>
+      <modus:TMCheckBox Text="Show Steps"
+                        IsChecked="{Binding ShowSteps, Mode=TwoWay}" />
+      <modus:TMCheckBox Text="Show ToolTips"
+                        IsChecked="{Binding ShowTooltip, Mode=TwoWay}" />
+      <modus:TMCheckBox Text="IsEnable"
+                        IsChecked="{Binding IsEnabled, Mode=TwoWay}" />
+      <modus:TMRangeSlider MaximumValue="{Binding MaximumValue}"
+                           MinimumValue="{Binding MinimumValue}"
+                           Size="{Binding Source={RelativeSource AncestorType={x:Type local:SliderViewModel}}, Path=Size}"
+                           ShowSteps="{Binding ShowSteps}"
+                           ShowToolTip="{Binding ShowTooltip}"
+                           IsEnabled="{Binding IsEnabled}"
+                           RightIconSource="placeholder.png"
+                           LeftIconSource="placeholder.png"
+                           Padding="0,15" />
+      <modus:TMSlider MaximumValue="{Binding MaximumValue}"
+                      MinimumValue="{Binding MinimumValue}"
+                      Size="{Binding Source={RelativeSource AncestorType={x:Type local:SliderViewModel}}, Path=Size}"
+                      ShowSteps="{Binding ShowSteps}"
+                      ShowToolTip="{Binding ShowTooltip}"
+                      IsEnabled="{Binding IsEnabled}"
+                      RightIconSource="placeholder.png"
+                      LeftIconSource="placeholder.png"
+                      Padding="0,15" />
+    </StackLayout>
+  </ScrollView>
+</ContentPage>