Merge pull request #28 from janusw/net10_cleanup

Replace ListView by CollectionView in sample app

Author: janusw

Source/OxyplotMauiSample/Pages/ExampleBrowser.xaml

@@ -20,18 +20,33 @@
                 TextTransform="None" />
         </Grid>
 
-        <ListView
+        <CollectionView
             x:Name="LvExamples"
             Grid.Row="1"
-            GroupDisplayBinding="{Binding Category}"
-            IsGroupingEnabled="true"
-            ItemSelected="ListView_OnItemSelected"
+            IsGrouped="true"
             ItemsSource="{Binding Examples}">
-            <ListView.ItemTemplate>
+            <CollectionView.ItemsLayout>
+                <LinearItemsLayout Orientation="Vertical"
+                                   ItemSpacing="8" />
+            </CollectionView.ItemsLayout>
+            <CollectionView.GroupHeaderTemplate>
+                <DataTemplate x:DataType="oxyplotMauiSample:ExampleGroup">
+                    <Label Text="{Binding Category}"
+                           BackgroundColor="Gray"
+                           FontSize="20"
+                           FontAttributes="Bold" />
+                </DataTemplate>
+            </CollectionView.GroupHeaderTemplate>
+            <CollectionView.ItemTemplate>
                 <DataTemplate x:DataType="exampleLibrary:ExampleInfo">
-                    <TextCell Text="{Binding Title}" />
+                    <Label Text="{Binding Title}" FontSize="18">
+                        <Label.GestureRecognizers>
+                            <TapGestureRecognizer Tapped="CollectionView_OnItemTapped"
+                                                  NumberOfTapsRequired="1" />
+                        </Label.GestureRecognizers>
+                    </Label>
                 </DataTemplate>
-            </ListView.ItemTemplate>
-        </ListView>
+            </CollectionView.ItemTemplate>
+        </CollectionView>
     </Grid>
-</ContentPage>
+</ContentPage>

Source/OxyplotMauiSample/Pages/ExampleBrowser.xaml.cs

@@ -23,12 +23,10 @@ protected override void OnAppearing()
             this.BindingContext = _viewModel;
         }
 
-        private async void ListView_OnItemSelected(object sender, SelectedItemChangedEventArgs e)
+        private async void CollectionView_OnItemTapped(object sender, TappedEventArgs e)
         {
-            if (e.SelectedItemIndex < 0)
-                return;
-
-            var exampleInfo = e.SelectedItem as ExampleInfo;
+            var lbl = (Label)sender;
+            var exampleInfo = lbl.BindingContext as ExampleInfo;
             var page = new PlotViewPage
             {
                 ExampleInfo = exampleInfo

Source/OxyplotMauiSample/Pages/IssueDemos/IssueDemoPage.xaml

@@ -5,16 +5,25 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
     xmlns:oxyplotMauiSample="clr-namespace:OxyplotMauiSample"
     Title="Select demo">
-    <ListView
+    <CollectionView
         x:Name="list1"
         HorizontalOptions="Fill"
-        ItemTapped="ListView_OnItemTapped"
         VerticalOptions="Fill">
-        <ListView.ItemTemplate>
+        <CollectionView.ItemTemplate>
             <DataTemplate x:DataType="oxyplotMauiSample:DemoInfo">
-                <TextCell Detail="{Binding Details}"
-                          Text="{Binding Title}"/>
+                <Grid Padding="10">
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                    </Grid.RowDefinitions>
+                    <Label Grid.Row="0" Text="{Binding Title}" FontAttributes="Bold" />
+                    <Label Grid.Row="1" Text="{Binding Details}" FontSize="Small" TextColor="Gray" />
+                    <Grid.GestureRecognizers>
+                        <TapGestureRecognizer Tapped="CollectionView_OnItemTapped"
+                                              NumberOfTapsRequired="1" />
+                    </Grid.GestureRecognizers>
+                </Grid>
             </DataTemplate>
-        </ListView.ItemTemplate>
-    </ListView>
+        </CollectionView.ItemTemplate>
+    </CollectionView>
 </ContentPage>

Source/OxyplotMauiSample/Pages/IssueDemos/IssueDemoPage.xaml.cs

@@ -20,9 +20,10 @@ public IssueDemoPage()
             this.list1.ItemsSource = demoPages;
         }
 
-        private async void ListView_OnItemTapped(object sender, ItemTappedEventArgs e)
+        private async void CollectionView_OnItemTapped(object sender, TappedEventArgs e)
         {
-            var demoInfo = (DemoInfo)e.Item;
+            var grid = (Grid)sender;
+            var demoInfo = (DemoInfo)grid.BindingContext;
             var page = demoInfo.CreatePage();
             page.Title = demoInfo.Title;
             await Navigation.PushAsync(page);

Source/OxyplotMauiSample/Resources/Styles/Styles.xaml

@@ -163,11 +163,6 @@
         </Setter>
     </Style>
 
-    <Style TargetType="ListView">
-        <Setter Property="SeparatorColor" Value="{AppThemeBinding Light={StaticResource Gray200}, Dark={StaticResource Gray500}}" />
-        <Setter Property="RefreshControlColor" Value="{AppThemeBinding Light={StaticResource Gray900}, Dark={StaticResource Gray200}}" />
-    </Style>
-
     <Style TargetType="Picker">
         <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Gray900}, Dark={StaticResource White}}" />
         <Setter Property="TitleColor" Value="{AppThemeBinding Light={StaticResource Gray900}, Dark={StaticResource Gray200}}" />