Merge pull request #403 from trimble-oss/402-when-dropdown-clicked-fa…

…ster-app-getting-crashed

Changes for dropdown crash and UI fix for ios

DemoApp/DemoApp/ViewModels/DropDownSampleViewModel.cs

@@ -11,6 +11,10 @@ public partial class DropDownSampleViewModel : ObservableObject
         private int selectedIndexOfEquipment;
         [ObservableProperty]
         private string selectedItemOfColor;
+
+        [ObservableProperty]
+        private string equipmentType = "Equipment Type:";
+
         [ObservableProperty]
         private List<string> equipmentSource;
         [ObservableProperty]

DemoApp/DemoApp/ViewModels/SwitchViewModel.cs

@@ -10,6 +10,8 @@ public partial class SwitchSamplePageViewModel : ObservableObject
 
         [ObservableProperty] private bool isEnabled = true;
         [ObservableProperty] private SwitchSize switchSize;
+        [ObservableProperty] private TitlePosition switchLabelPosition;
+        [ObservableProperty] private string switchLabel = "Off at first";
         public SwitchSamplePageViewModel()
         {
 
@@ -27,6 +29,12 @@ public void SizeSelectionChanged(TMRadioButtonEventArgs e)
             SwitchSize = e.RadioButtonIndex == 0 ? SwitchSize.Medium : SwitchSize.Large;
         }
 
+        [RelayCommand]
+        public void PositionSelectionChanged(TMRadioButtonEventArgs e)
+        {
+            SwitchLabelPosition = e.RadioButtonIndex == 0 ? TitlePosition.Right : TitlePosition.Left;
+        }
+
         [RelayCommand]
         private void Switch(object e)
         {

DemoApp/DemoApp/Views/DropDownSamplePage.xaml

@@ -4,19 +4,16 @@
              xmlns:modus="http://modus.trimble.com/components"
              x:Class="DemoApp.Views.DropDownSamplePage"
              Title="DropDownSamplePage">
-  <StackLayout HorizontalOptions="Start"
-               Padding="10"
-               Spacing="20">
-
-    <Label Text="Equipment Type:" />
-    <modus:TMDropDown WidthRequest="250" />
+  <VerticalStackLayout Padding="10"
+                       Spacing="20">
+    <modus:TMDropDown TitleText="{Binding EquipmentType}" />
     <modus:TMDropDown ItemsSource="{Binding EquipmentSource}"
                       SelectedIndex="{Binding SelectedIndexOfEquipment}"
-                      SelectionChangedCommand="{Binding ItemSelectedCommand}"
-                      WidthRequest="250" />
-    <Label Text="Color" />
+                      SelectionChangedCommand="{Binding ItemSelectedCommand}" />
     <modus:TMDropDown ItemsSource="{Binding ColorSource}"
+                      TitleText="Color"
+                      IsRequired="True"
                       SelectedItem="{Binding SelectedItemOfColor}"
                       SelectionChangedCommand="{Binding ItemSelectedCommand}" />
-  </StackLayout>
+  </VerticalStackLayout>
 </ContentPage>

DemoApp/DemoApp/Views/SwitchSamplePage.xaml

@@ -8,7 +8,7 @@
   <VerticalStackLayout Padding="10"
                        Spacing="10"
                        HorizontalOptions="Start"
-                       VerticalOptions="Start">
+                       VerticalOptions="Start">
     <Label Text="IsEnabled" />
     <modus:TMRadioButtonGroup x:Name="IsEnabledRadioGroup"
                               Orientation="Horizontal"
@@ -24,17 +24,43 @@
                               SelectedRadioButtonChangedCommand="{Binding SizeSelectionChangedCommand}">
       <modus:TMRadioButton Text="Medium" />
       <modus:TMRadioButton Text="Large" />
+    </modus:TMRadioButtonGroup>
+
+    <Label Text="Position" />
+    <modus:TMRadioButtonGroup x:Name="PositionRadioGroup"
+                              Orientation="Horizontal"
+                              SelectedIndex="0"
+                              SelectedRadioButtonChangedCommand="{Binding PositionSelectionChangedCommand}">
+      <modus:TMRadioButton Text="Right" />
+      <modus:TMRadioButton Text="Left" />
     </modus:TMRadioButtonGroup>
-    <Label Text="Medium Switches" />
-    <modus:TMSwitch Text="Off at first"
+
+    <modus:TMSwitch Text="{Binding SwitchLabel}"
                     Toggled="TMSwitch_Toggled"
                     IsToggled="false"
                     IsEnabled="{Binding IsEnabled}"
                     SwitchSize="{Binding SwitchSize}"
+                    SwitchLabelPosition="{Binding SwitchLabelPosition}"
                     ToggledCommand="{Binding SwitchCommand}" />
     <modus:TMSwitch Text="On at first"
                     Toggled="TMSwitch_Toggled"
                     IsToggled="True"
+                    SwitchLabelPosition="{Binding SwitchLabelPosition}"
+                    IsEnabled="{Binding IsEnabled}"
+                    SwitchSize="{Binding SwitchSize}"
+                    ToggledCommand="{Binding SwitchCommand}" />
+
+    <modus:TMSwitch Text="Left Side Label"
+                    Toggled="TMSwitch_Toggled"
+                    IsToggled="True"
+                    SwitchLabelPosition="Left"
+                    IsEnabled="{Binding IsEnabled}"
+                    SwitchSize="{Binding SwitchSize}"
+                    ToggledCommand="{Binding SwitchCommand}" />
+    <modus:TMSwitch Text="Right Side Label"
+                    Toggled="TMSwitch_Toggled"
+                    IsToggled="True"
+                    SwitchLabelPosition="Right"
                     IsEnabled="{Binding IsEnabled}"
                     SwitchSize="{Binding SwitchSize}"
                     ToggledCommand="{Binding SwitchCommand}" />

Trimble.Modus.Components/Controls/DropDown/TMDropDown.xaml

@@ -1,8 +1,7 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             HorizontalOptions="Start"
-             VerticalOptions="Start"
+             x:Name="dropDown"
              xmlns:local="clr-namespace:Trimble.Modus.Components"
              xmlns:constants="clr-namespace:Trimble.Modus.Components.Constant"
              xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
@@ -14,39 +13,42 @@
       </ResourceDictionary.MergedDictionaries>
     </ResourceDictionary>
   </ContentView.Resources>
-  <Border x:Name="innerBorder"
-          MinimumWidthRequest="150"
-          HorizontalOptions="Start"
-          StrokeThickness="2"
-          VerticalOptions="Center"
-          Padding="0">
-    <Border.StrokeShape>
-      <RoundRectangle CornerRadius="4" />
-    </Border.StrokeShape>
-    <Border.GestureRecognizers>
-      <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped" />
-    </Border.GestureRecognizers>
-    <Grid x:Name="ContentLayout"
-          ColumnDefinitions="*,auto"
-          HeightRequest="48"
-          Padding="12,0"
-          HorizontalOptions="Fill"
-          VerticalOptions="Center">
-      <Label x:Name="label"
-             FontSize="16"
-             Grid.Column="0"
-             HorizontalTextAlignment="Start"
-             FontFamily="OpenSansSemibold"
-             VerticalOptions="Center" />
+  <VerticalStackLayout BindingContext="{x:Reference dropDown}">
+    <local:ControlLabel TitleText="{Binding TitleText}"
+                        IsRequired="{Binding IsRequired}" />
+    <Border x:Name="innerBorder"
+            HorizontalOptions="Fill"
+            StrokeThickness="2"
+            VerticalOptions="Center"
+            Padding="0">
+      <Border.StrokeShape>
+        <RoundRectangle CornerRadius="4" />
+      </Border.StrokeShape>
+      <Border.GestureRecognizers>
+        <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped" />
+      </Border.GestureRecognizers>
+      <Grid x:Name="ContentLayout"
+            ColumnDefinitions="*,auto"
+            HeightRequest="48"
+            Padding="12,0"
+            HorizontalOptions="Fill"
+            VerticalOptions="Center">
+        <Label x:Name="label"
+               FontSize="16"
+               Grid.Column="0"
+               HorizontalTextAlignment="Start"
+               FontFamily="OpenSansSemibold"
+               VerticalOptions="Center" />
 
-      <Image x:Name="indicatorButton"
-             Source="{Static constants:ImageConstants.ChevronDownIconWhite}"
-             HorizontalOptions="EndAndExpand"
-             VerticalOptions="Center"
-             Grid.Column="1"
-             HeightRequest="32"
-             WidthRequest="32" />
+        <Image x:Name="indicatorButton"
+               Source="{Static constants:ImageConstants.ChevronDownIconWhite}"
+               HorizontalOptions="EndAndExpand"
+               VerticalOptions="Center"
+               Grid.Column="1"
+               HeightRequest="32"
+               WidthRequest="32" />
 
-    </Grid>
-  </Border>
+      </Grid>
+    </Border>
+  </VerticalStackLayout>
 </ContentView>

Trimble.Modus.Components/Controls/DropDown/TMDropDown.xaml.cs

@@ -31,6 +31,24 @@ public IEnumerable ItemsSource
         set { SetValue(ItemsSourceProperty, value); }
     }
 
+    /// <summary>
+    /// Gets or sets the title text
+    /// </summary>
+    public string TitleText
+    {
+        get => (string)GetValue(TitleTextProperty);
+        set => SetValue(TitleTextProperty, value);
+    }
+
+    /// <summary>
+    /// Gets or sets the required property
+    /// </summary>
+    public bool IsRequired
+    {
+        get => (bool)GetValue(IsRequiredProperty);
+        set => SetValue(IsRequiredProperty, value);
+    }
+
     public object SelectedItem
     {
         get => GetValue(SelectedItemProperty);
@@ -81,6 +99,18 @@ public ICommand SelectionChangedCommand
     public static readonly BindableProperty ItemsSourceProperty =
         BindableProperty.Create(nameof(ItemsSource), typeof(IEnumerable), typeof(TMDropDown), null, propertyChanged: OnItemsSourceChanged);
 
+    /// <summary>
+    /// Gets or sets the text for the title label in the control
+    /// </summary>
+    public static readonly BindableProperty TitleTextProperty =
+        BindableProperty.Create(nameof(TitleText), typeof(string), typeof(TMDropDown), null);
+
+    /// <summary>
+    /// Gets or sets the required boolean for the label in the control
+    /// </summary>
+    public static readonly BindableProperty IsRequiredProperty =
+        BindableProperty.Create(nameof(IsRequired), typeof(bool), typeof(TMDropDown), false);
+
     public static readonly BindableProperty SelectedItemProperty =
         BindableProperty.Create(nameof(SelectedItem), typeof(object), typeof(TMDropDown), null, propertyChanged: OnSelectedItemChanged);
 
@@ -184,14 +214,6 @@ private void OnSelected(object sender, SelectedItemChangedEventArgs e)
         }
     }
 
-    private void OnTapped(object sender, EventArgs e)
-    {
-        if (ItemsSource.Cast<object>().Count() > 0)
-        {
-            Open();
-        }
-    }
-
     private async void Close()
     {
         await Task.WhenAll(
@@ -202,29 +224,36 @@ await Task.WhenAll(
 
 
     DropDownContents dropDownContents;
+    private bool _isLoading;
+
     private async void Open()
     {
-        var locationFetcher = new LocationFetcher();
-        var loc = locationFetcher.GetCoordinates(this);
-        var height = Application.Current.MainPage.Window.Height;
-        dropDownContents = new DropDownContents(innerBorder, Enums.ModalPosition.Bottom)
+        if (!_isLoading)
         {
-            ItemSource = this.ItemsSource,
-            SelectedIndex = this.SelectedIndex,
-            SelectedItem = this.SelectedItem,
-            Margin = margin,
-            DesiredHeight = desiredHeight,
-            WidthRequest = innerBorder.Width,
-            SelectedEventHandler = OnSelected,
-            YPosition = loc.Y,
-            Height = height
-        };
-        dropDownContents.Build();
-        await Task.WhenAll(
-            indicatorButton.RotateTo(-180, AnimationDuration)
-        );
-
-        await PopupService.Instance?.PresentAsync(dropDownContents, true);
+            _isLoading = true;
+            var locationFetcher = new LocationFetcher();
+            var loc = locationFetcher.GetCoordinates(this);
+            var height = Application.Current.MainPage.Window.Height;
+            dropDownContents = new DropDownContents(innerBorder, Enums.ModalPosition.Bottom)
+            {
+                ItemSource = this.ItemsSource,
+                SelectedIndex = this.SelectedIndex,
+                SelectedItem = this.SelectedItem,
+                Margin = margin,
+                DesiredHeight = desiredHeight,
+                WidthRequest = innerBorder.Width,
+                SelectedEventHandler = OnSelected,
+                YPosition = loc.Y,
+                Height = height
+            };
+            dropDownContents.Build();
+            await Task.WhenAll(
+                indicatorButton.RotateTo(-180, AnimationDuration)
+            );
+
+            await PopupService.Instance?.PresentAsync(dropDownContents, true);
+            _isLoading = false;
+        }
     }
 
     private void OnPopupRemoved(object sender, EventArgs e)
@@ -274,6 +303,10 @@ private void UpdateSelectedItemText(TMDropDown dropDown)
         {
             label.Text = items.Cast<object>().ElementAt(dropDown.SelectedIndex).ToString();
         }
+        else
+        {
+            label.Text = string.Empty;
+        }
     }
 
     private void UpdateSelectedItemValue(TMDropDown dropDown)

Trimble.Modus.Components/Controls/Label/ControlLabel.xaml

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
+             xmlns:local="clr-namespace:Trimble.Modus.Components;assembly=Trimble.Modus.Components"
+             x:Class="Trimble.Modus.Components.ControlLabel"
+             x:Name="controlLabelView">
+  <ContentView.Resources>
+    <ResourceDictionary>
+      <toolkit:IsStringNotNullOrEmptyConverter x:Key="IsStringNotNullOrEmptyConverter" />
+      <ResourceDictionary.MergedDictionaries>
+        <local:ControlLabelStyles />
+      </ResourceDictionary.MergedDictionaries>
+    </ResourceDictionary>
+  </ContentView.Resources>
+  <Grid x:Name="view"
+        BindingContext="{x:Reference controlLabelView}"
+        ColumnSpacing="4"
+        ColumnDefinitions="*,auto"
+        IsVisible="{Binding TitleText,Converter={StaticResource IsStringNotNullOrEmptyConverter}}">
+    <Label x:Name="inputLabel"
+           Padding="0,0,0,5"
+           Grid.Column="0"
+           FontFamily="OpenSansSemibold"
+           Text="{Binding TitleText}"
+           VerticalOptions="Center"
+           LineBreakMode="WordWrap"
+           HorizontalOptions="Start" />
+    <Label Text="*"
+           Grid.Column="1"
+           IsVisible="{Binding IsRequired}"
+           FontFamily="OpenSansSemibold"
+           TextColor="{DynamicResource Danger}" />
+  </Grid>
+</ContentView>