Merge pull request #1452 from DGP-Studio/fix/layoutcycle_2

src/Snap.Hutao/Snap.Hutao/App.xaml

@@ -23,6 +23,7 @@
                 <ResourceDictionary Source="ms-appx:///Control/Theme/PageOverride.xaml"/>
                 <ResourceDictionary Source="ms-appx:///Control/Theme/PivotOverride.xaml"/>
                 <ResourceDictionary Source="ms-appx:///Control/Theme/ScrollViewer.xaml"/>
+                <ResourceDictionary Source="ms-appx:///Control/Theme/SegmentedOverride.xaml"/>
                 <ResourceDictionary Source="ms-appx:///Control/Theme/SettingsStyle.xaml"/>
                 <ResourceDictionary Source="ms-appx:///Control/Theme/Thickness.xaml"/>
                 <ResourceDictionary Source="ms-appx:///Control/Theme/TransitionCollection.xaml"/>

src/Snap.Hutao/Snap.Hutao/Control/Panel/EqualPanel.cs

@@ -0,0 +1,89 @@
+// Copyright (c) DGP Studio. All rights reserved.
+// Licensed under the MIT license.
+
+using Microsoft.UI.Xaml;
+using System.Data;
+using System.Runtime.InteropServices;
+using Windows.Foundation;
+
+namespace Snap.Hutao.Control.Panel;
+
+[DependencyProperty("Spacing", typeof(double), default(double), nameof(OnSpacingChanged))]
+internal partial class EqualPanel : Microsoft.UI.Xaml.Controls.Panel
+{
+    private double maxItemWidth;
+    private double maxItemHeight;
+    private int visibleItemsCount;
+
+    public EqualPanel()
+    {
+        RegisterPropertyChangedCallback(HorizontalAlignmentProperty, OnHorizontalAlignmentChanged);
+    }
+
+    protected override Size MeasureOverride(Size availableSize)
+    {
+        maxItemWidth = 0;
+        maxItemHeight = 0;
+
+        List<UIElement> elements = [.. Children.Where(element => element.Visibility == Visibility.Visible)];
+        visibleItemsCount = elements.Count;
+
+        foreach (ref readonly UIElement child in CollectionsMarshal.AsSpan(elements))
+        {
+            child.Measure(availableSize);
+            maxItemWidth = Math.Max(maxItemWidth, child.DesiredSize.Width);
+            maxItemHeight = Math.Max(maxItemHeight, child.DesiredSize.Height);
+        }
+
+        if (visibleItemsCount > 0)
+        {
+            // Return equal widths based on the widest item
+            // In very specific edge cases the AvailableWidth might be infinite resulting in a crash.
+            if (HorizontalAlignment is not HorizontalAlignment.Stretch || double.IsInfinity(availableSize.Width))
+            {
+                return new Size((maxItemWidth * visibleItemsCount) + (Spacing * (visibleItemsCount - 1)), maxItemHeight);
+            }
+            else
+            {
+                // Equal columns based on the available width, adjust for spacing
+                double totalWidth = availableSize.Width - (Spacing * (visibleItemsCount - 1));
+                maxItemWidth = totalWidth / visibleItemsCount;
+                return new Size(availableSize.Width, maxItemHeight);
+            }
+        }
+        else
+        {
+            return new Size(0, 0);
+        }
+    }
+
+    protected override Size ArrangeOverride(Size finalSize)
+    {
+        double x = 0;
+
+        // Check if there's more (little) width available - if so, set max item width to the maximum possible as we have an almost perfect height.
+        if (finalSize.Width > (visibleItemsCount * maxItemWidth) + (Spacing * (visibleItemsCount - 1)))
+        {
+            maxItemWidth = (finalSize.Width - (Spacing * (visibleItemsCount - 1))) / visibleItemsCount;
+        }
+
+        IEnumerable<UIElement> elements = Children.Where(static e => e.Visibility == Visibility.Visible);
+        foreach (UIElement child in elements)
+        {
+            child.Arrange(new Rect(x, 0, maxItemWidth, maxItemHeight));
+            x += maxItemWidth + Spacing;
+        }
+
+        return finalSize;
+    }
+
+    private static void OnSpacingChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+    {
+        (d as EqualPanel)?.InvalidateMeasure();
+    }
+
+    private void OnHorizontalAlignmentChanged(DependencyObject sender, DependencyProperty dp)
+    {
+        InvalidateMeasure();
+    }
+}

src/Snap.Hutao/Snap.Hutao/Control/Panel/PanelSelector.xaml

@@ -6,6 +6,7 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:shcm="using:Snap.Hutao.Control.Markup"
+    Style="{StaticResource DefaultSegmentedStyle}"
     mc:Ignorable="d">
 
     <cwc:SegmentedItem

src/Snap.Hutao/Snap.Hutao/Control/Theme/SegmentedOverride.xaml

@@ -0,0 +1,115 @@
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:cw="using:CommunityToolkit.WinUI"
+    xmlns:cwc="using:CommunityToolkit.WinUI.Controls"
+    xmlns:shcp="using:Snap.Hutao.Control.Panel"
+    xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
+
+    <ResourceDictionary.MergedDictionaries>
+        <ResourceDictionary Source="ms-appx:///CommunityToolkit.WinUI.Controls.Segmented/SegmentedItem/SegmentedItem.xaml"/>
+    </ResourceDictionary.MergedDictionaries>
+    <ResourceDictionary.ThemeDictionaries>
+        <ResourceDictionary x:Key="Default">
+            <StaticResource x:Key="SegmentedBackground" ResourceKey="ControlAltFillColorSecondaryBrush"/>
+            <StaticResource x:Key="SegmentedBorderBrush" ResourceKey="ControlStrokeColorDefaultBrush"/>
+            <Thickness x:Key="SegmentedBorderThickness">1</Thickness>
+        </ResourceDictionary>
+        <ResourceDictionary x:Key="Light">
+            <StaticResource x:Key="SegmentedBackground" ResourceKey="ControlAltFillColorSecondaryBrush"/>
+            <StaticResource x:Key="SegmentedBorderBrush" ResourceKey="ControlStrokeColorDefaultBrush"/>
+            <Thickness x:Key="SegmentedBorderThickness">1</Thickness>
+        </ResourceDictionary>
+        <ResourceDictionary x:Key="HighContrast">
+            <StaticResource x:Key="SegmentedBackground" ResourceKey="SystemColorButtonFaceColor"/>
+            <StaticResource x:Key="SegmentedBorderBrush" ResourceKey="SystemColorHighlightColorBrush"/>
+            <Thickness x:Key="SegmentedBorderThickness">1</Thickness>
+        </ResourceDictionary>
+    </ResourceDictionary.ThemeDictionaries>
+
+    <x:Double x:Key="SegmentedItemSpacing">1</x:Double>
+    <x:Double x:Key="ButtonItemSpacing">2</x:Double>
+
+    <Style BasedOn="{StaticResource DefaultSegmentedStyle}" TargetType="cwc:Segmented"/>
+
+    <Style x:Key="DefaultSegmentedStyle" TargetType="cwc:Segmented">
+        <Style.Setters>
+            <Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}"/>
+            <Setter Property="Background" Value="{ThemeResource SegmentedBackground}"/>
+            <Setter Property="BorderBrush" Value="{ThemeResource SegmentedBorderBrush}"/>
+            <Setter Property="BorderThickness" Value="{ThemeResource SegmentedBorderThickness}"/>
+            <Setter Property="HorizontalAlignment" Value="Left"/>
+            <Setter Property="VerticalAlignment" Value="Center"/>
+            <Setter Property="SelectionMode" Value="Single"/>
+            <Setter Property="IsItemClickEnabled" Value="False"/>
+            <win:Setter Property="SingleSelectionFollowsFocus" Value="False"/>
+            <Setter Property="IsTabStop" Value="False"/>
+            <Setter Property="TabNavigation" Value="Once"/>
+            <Setter Property="ItemsPanel">
+                <Setter.Value>
+                    <ItemsPanelTemplate>
+                        <shcp:EqualPanel
+                            HorizontalAlignment="{Binding (cw:FrameworkElementExtensions.Ancestor).HorizontalAlignment, RelativeSource={RelativeSource Self}}"
+                            cw:FrameworkElementExtensions.AncestorType="cwc:Segmented"
+                            Spacing="{ThemeResource SegmentedItemSpacing}"/>
+                    </ItemsPanelTemplate>
+                </Setter.Value>
+            </Setter>
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="cwc:Segmented">
+                        <Grid>
+                            <Border
+                                VerticalAlignment="Stretch"
+                                Background="{TemplateBinding Background}"
+                                BorderBrush="{TemplateBinding BorderBrush}"
+                                BorderThickness="{TemplateBinding BorderThickness}"
+                                CornerRadius="{TemplateBinding CornerRadius}"/>
+                            <ItemsPresenter Margin="{TemplateBinding Padding}"/>
+                        </Grid>
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style.Setters>
+    </Style>
+
+    <Style
+        x:Key="PivotSegmentedStyle"
+        BasedOn="{StaticResource DefaultSegmentedStyle}"
+        TargetType="cwc:Segmented">
+        <Style.Setters>
+            <Setter Property="Background" Value="Transparent"/>
+            <Setter Property="BorderBrush" Value="Transparent"/>
+            <Setter Property="BorderThickness" Value="0"/>
+            <Setter Property="Padding" Value="0"/>
+            <Setter Property="ItemContainerStyle" Value="{StaticResource PivotSegmentedItemStyle}"/>
+            <Setter Property="ItemsPanel">
+                <Setter.Value>
+                    <ItemsPanelTemplate>
+                        <StackPanel Orientation="Horizontal" Spacing="{ThemeResource SegmentedItemSpacing}"/>
+                    </ItemsPanelTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style.Setters>
+    </Style>
+
+    <Style
+        x:Key="ButtonSegmentedStyle"
+        BasedOn="{StaticResource DefaultSegmentedStyle}"
+        TargetType="cwc:Segmented">
+        <Style.Setters>
+            <Setter Property="Background" Value="Transparent"/>
+            <Setter Property="BorderBrush" Value="Transparent"/>
+            <Setter Property="BorderThickness" Value="0"/>
+            <Setter Property="Padding" Value="0"/>
+            <Setter Property="ItemContainerStyle" Value="{StaticResource ButtonSegmentedItemStyle}"/>
+            <Setter Property="ItemsPanel">
+                <Setter.Value>
+                    <ItemsPanelTemplate>
+                        <StackPanel Orientation="Horizontal" Spacing="{ThemeResource ButtonItemSpacing}"/>
+                    </ItemsPanelTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style.Setters>
+    </Style>
+</ResourceDictionary>

src/Snap.Hutao/Snap.Hutao/Snap.Hutao.csproj

@@ -156,6 +156,7 @@
     <None Remove="View\Control\LoadingView.xaml" />
     <None Remove="View\Control\LoadingViewSlim.xaml" />
     <None Remove="View\Control\SkillPivot.xaml" />
+    <None Remove="View\Control\SegmentedOverride.xaml" />
     <None Remove="View\Control\StatisticsCard.xaml" />
     <None Remove="View\Control\StatisticsSegmented.xaml" />
     <None Remove="View\Control\WebViewer.xaml" />
@@ -348,6 +349,11 @@
   <ItemGroup>
     <None Include="..\.editorconfig" Link=".editorconfig" />
   </ItemGroup>
+  <ItemGroup>
+    <Page Update="Control\Theme\SegmentedOverride.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+  </ItemGroup>
   <ItemGroup>
     <Page Update="Control\Theme\Thickness.xaml">
       <Generator>MSBuild:Compile</Generator>

src/Snap.Hutao/Snap.Hutao/View/Control/StatisticsSegmented.xaml

@@ -6,6 +6,7 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:shcm="using:Snap.Hutao.Control.Markup"
+    Style="{StaticResource DefaultSegmentedStyle}"
     mc:Ignorable="d">
     <cwc:SegmentedItem Content="{shcm:ResourceString Name=ViewControlStatisticsSegmentedItemContentStatistics}" Icon="{shcm:FontIcon Glyph=&#xE9D2;}"/>
     <cwc:SegmentedItem Content="{shcm:ResourceString Name=ViewControlStatisticsSegmentedItemContentProportion}" Icon="{shcm:FontIcon Glyph=&#xEB05;}"/>