-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Windows] Update CollectionView changing ItemsLayout (#14532)
* Added sample * Testing * Fix the issue * Small refactoring * Refactored code --------- Co-authored-by: Rui Marinho <[email protected]>
- Loading branch information
1 parent
e629560
commit d569287
Showing
7 changed files
with
172 additions
and
100 deletions.
There are no files selected for viewing
38 changes: 38 additions & 0 deletions
38
...amples/Controls.Sample/Pages/Controls/CollectionViewGalleries/AdaptiveCollectionView.xaml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| <?xml version="1.0" encoding="utf-8" ?> | ||
| <ContentPage | ||
| xmlns="http://schemas.microsoft.com/dotnet/2021/maui" | ||
| xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" | ||
| x:Class="Maui.Controls.Sample.Pages.CollectionViewGalleries.AdaptiveCollectionView" | ||
| Title="Adaptive CollectionView"> | ||
| <ContentPage.Content> | ||
| <Grid> | ||
| <CollectionView | ||
| x:Name="CollectionView"> | ||
| <CollectionView.ItemsSource> | ||
| <x:Array Type="{x:Type x:String}"> | ||
| <x:String>Item 1</x:String> | ||
| <x:String>Item 2</x:String> | ||
| <x:String>Item 3</x:String> | ||
| <x:String>Item 4</x:String> | ||
| <x:String>Item 5</x:String> | ||
| <x:String>Item 6</x:String> | ||
| <x:String>Item 7</x:String> | ||
| <x:String>Item 8</x:String> | ||
| </x:Array> | ||
| </CollectionView.ItemsSource> | ||
| <CollectionView.ItemTemplate> | ||
| <DataTemplate> | ||
| <Grid | ||
| HeightRequest="60" | ||
| Padding="12"> | ||
| <Label | ||
| HorizontalOptions="Center" | ||
| VerticalOptions="Center" | ||
| Text="{Binding}"/> | ||
| </Grid> | ||
| </DataTemplate> | ||
| </CollectionView.ItemTemplate> | ||
| </CollectionView> | ||
| </Grid> | ||
| </ContentPage.Content> | ||
| </ContentPage> |
35 changes: 35 additions & 0 deletions
35
...les/Controls.Sample/Pages/Controls/CollectionViewGalleries/AdaptiveCollectionView.xaml.cs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| using Microsoft.Maui.Controls; | ||
| using Microsoft.Maui.Controls.Xaml; | ||
|
|
||
| namespace Maui.Controls.Sample.Pages.CollectionViewGalleries | ||
| { | ||
| [XamlCompilation(XamlCompilationOptions.Compile)] | ||
| public partial class AdaptiveCollectionView : ContentPage | ||
| { | ||
| public AdaptiveCollectionView() | ||
| { | ||
| InitializeComponent(); | ||
| } | ||
|
|
||
| protected override void OnAppearing() | ||
| { | ||
| base.OnAppearing(); | ||
|
|
||
| SizeChanged += OnAdaptiveCollectionViewSizeChanged; | ||
| } | ||
|
|
||
| protected override void OnDisappearing() | ||
| { | ||
| base.OnDisappearing(); | ||
|
|
||
| SizeChanged -= OnAdaptiveCollectionViewSizeChanged; | ||
| } | ||
|
|
||
| void OnAdaptiveCollectionViewSizeChanged(object sender, System.EventArgs e) | ||
| { | ||
| CollectionView.ItemsLayout = Width > 600 | ||
| ? new GridItemsLayout(3, ItemsLayoutOrientation.Vertical) | ||
| : new LinearItemsLayout(ItemsLayoutOrientation.Vertical); | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
54 changes: 54 additions & 0 deletions
54
src/Controls/src/Core/Platform/Windows/Extensions/CollectionViewExtensions.cs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
| #nullable enable | ||
| using Microsoft.UI.Xaml; | ||
| using Microsoft.UI.Xaml.Controls; | ||
| using WSetter = Microsoft.UI.Xaml.Setter; | ||
| using WStyle = Microsoft.UI.Xaml.Style; | ||
|
|
||
| namespace Microsoft.Maui.Controls.Platform | ||
| { | ||
| public static class CollectionViewExtensions | ||
| { | ||
| public static WStyle? GetItemContainerStyle(this LinearItemsLayout? layout) | ||
| { | ||
| if (layout is null) | ||
| return null; | ||
|
|
||
| var h = layout?.ItemSpacing ?? 0; | ||
| var v = layout?.ItemSpacing ?? 0; | ||
| var margin = WinUIHelpers.CreateThickness(h, v, h, v); | ||
|
|
||
| var style = new WStyle(typeof(GridViewItem)); | ||
|
|
||
| style.Setters.Add(new WSetter(FrameworkElement.MarginProperty, margin)); | ||
| style.Setters.Add(new WSetter(Control.PaddingProperty, WinUIHelpers.CreateThickness(0))); | ||
| style.Setters.Add(new WSetter(Control.HorizontalContentAlignmentProperty, HorizontalAlignment.Stretch)); | ||
|
|
||
| return style; | ||
| } | ||
|
|
||
| public static WStyle? GetItemContainerStyle(this GridItemsLayout? layout) | ||
| { | ||
| if (layout is null) | ||
| return null; | ||
|
|
||
| var h = layout?.HorizontalItemSpacing ?? 0; | ||
| var v = layout?.VerticalItemSpacing ?? 0; | ||
| var margin = WinUIHelpers.CreateThickness(h, v, h, v); | ||
|
|
||
| var style = new WStyle(typeof(GridViewItem)); | ||
|
|
||
| style.Setters.Add(new WSetter(FrameworkElement.MarginProperty, margin)); | ||
| style.Setters.Add(new WSetter(Control.PaddingProperty, WinUIHelpers.CreateThickness(0))); | ||
| style.Setters.Add(new WSetter(Control.HorizontalContentAlignmentProperty, HorizontalAlignment.Stretch)); | ||
|
|
||
| return style; | ||
| } | ||
|
|
||
| public static Orientation ToPlatform(this ItemsLayout layout) | ||
| { | ||
| return layout.Orientation == ItemsLayoutOrientation.Horizontal | ||
| ? Orientation.Horizontal | ||
| : Orientation.Vertical; | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters