From a23043fb6d1a73a58c5e2a0457fc496afb68c39e Mon Sep 17 00:00:00 2001
From: DismissedLight <1686188646@qq.com>
Date: Thu, 10 Aug 2023 23:38:35 +0800
Subject: [PATCH] update controls style

---
 src/Snap.Hutao/Snap.Hutao/App.xaml            | 12 +++-
 .../Extension/EnumerableExtension.cs          |  5 ++
 .../Snap.Hutao/View/Card/DailyNoteCard.xaml   | 18 +++---
 .../View/Control/BottomTextControl.xaml       |  6 +-
 .../View/Control/BottomTextControl.xaml.cs    | 21 +-----
 .../View/Control/DescParamComboBox.xaml       |  6 +-
 .../View/Control/DescParamComboBox.xaml.cs    | 14 +---
 .../View/Control/HutaoStatisticsCard.xaml     | 64 ++++++-------------
 .../Snap.Hutao/View/Control/ItemIcon.xaml     |  5 +-
 .../Control/LaunchGameResourceExpander.xaml   | 14 ++--
 .../Snap.Hutao/View/Control/SkillPivot.xaml   |  9 +--
 .../View/Control/StatisticsCard.xaml          | 38 +++++------
 ...rolHelper.cs => FrameworkElementHelper.cs} |  2 +-
 13 files changed, 84 insertions(+), 130 deletions(-)
 rename src/Snap.Hutao/Snap.Hutao/View/Helper/{ControlHelper.cs => FrameworkElementHelper.cs} (93%)

diff --git a/src/Snap.Hutao/Snap.Hutao/App.xaml b/src/Snap.Hutao/Snap.Hutao/App.xaml
index 7295be9f..ee0bec1a 100644
--- a/src/Snap.Hutao/Snap.Hutao/App.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/App.xaml
@@ -56,6 +56,7 @@
 
             <!--  Brushes  -->
             <SolidColorBrush x:Key="AvatarPropertyAddValueBrush" Color="{ThemeResource AvatarPropertyAddValueColor}"/>
+            <SolidColorBrush x:Key="BlueBrush" Color="#FF5180CB"/>
             <SolidColorBrush x:Key="PurpleBrush" Color="#FFA156E0"/>
             <SolidColorBrush x:Key="OrangeBrush" Color="#FFBC6932"/>
             <!--  Settings  -->
@@ -103,6 +104,9 @@
 
             <!--  FontIcon Content  -->
             <x:String x:Key="FontIconContentSetting">&#xE713;</x:String>
+            <x:String x:Key="FontIconContentFolder">&#xE8B7;</x:String>
+            <x:String x:Key="FontIconContentAsteriskBadge12">&#xEDAD;</x:String>
+            <x:String x:Key="FontIconContentZipFolder">&#xF012;</x:String>
             <!--  Converters  -->
             <cwuc:BoolNegationConverter x:Key="BoolNegationConverter"/>
             <cwuc:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
@@ -132,8 +136,8 @@
             <shvc:Int32ToVisibilityConverter x:Key="Int32ToVisibilityConverter"/>
             <shvc:Int32ToVisibilityRevertConverter x:Key="Int32ToVisibilityRevertConverter"/>
             <shvc:StringBoolConverter x:Key="StringBoolConverter"/>
-            <!--  Styles  -->
 
+            <!--  Styles  -->
             <Style
                 x:Key="LargeGridViewItemStyle"
                 BasedOn="{StaticResource DefaultGridViewItemStyle}"
@@ -473,7 +477,6 @@
                                         <VisualState x:Name="AccentColorBorder">
                                             <VisualState.Setters>
                                                 <Setter Target="BackgroundElement.BorderBrush" Value="{ThemeResource SystemControlForegroundAccentBrush}"/>
-
                                             </VisualState.Setters>
                                         </VisualState>
 
@@ -484,6 +487,7 @@
                     </Setter.Value>
                 </Setter>
             </Style>
+
             <!--  ItemsPanelTemplate  -->
             <ItemsPanelTemplate x:Key="ItemsStackPanelTemplate">
                 <ItemsStackPanel/>
@@ -494,6 +498,10 @@
             <ItemsPanelTemplate x:Key="HorizontalStackPanelTemplate">
                 <StackPanel Orientation="Horizontal"/>
             </ItemsPanelTemplate>
+            <!--  Transitions  -->
+            <TransitionCollection x:Key="ReorderThemeTransitions">
+                <ReorderThemeTransition/>
+            </TransitionCollection>
         </ResourceDictionary>
     </Application.Resources>
 </Application>
\ No newline at end of file
diff --git a/src/Snap.Hutao/Snap.Hutao/Extension/EnumerableExtension.cs b/src/Snap.Hutao/Snap.Hutao/Extension/EnumerableExtension.cs
index 46bfb50d..e18b653b 100644
--- a/src/Snap.Hutao/Snap.Hutao/Extension/EnumerableExtension.cs
+++ b/src/Snap.Hutao/Snap.Hutao/Extension/EnumerableExtension.cs
@@ -12,6 +12,11 @@ namespace Snap.Hutao.Extension;
 [HighQuality]
 internal static partial class EnumerableExtension
 {
+    public static TElement? ElementAtOrLastOrDefault<TElement>(this IEnumerable<TElement> source, int index)
+    {
+        return source.ElementAtOrDefault(index) ?? source.LastOrDefault();
+    }
+
     /// <summary>
     /// 如果传入集合不为空则原路返回，
     /// 如果传入集合为空返回一个集合的空集
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Card/DailyNoteCard.xaml b/src/Snap.Hutao/Snap.Hutao/View/Card/DailyNoteCard.xaml
index 5868e050..6f7fa4f7 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Card/DailyNoteCard.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Card/DailyNoteCard.xaml
@@ -48,7 +48,7 @@
                                 Text="{Binding Uid}"/>
                             <Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
                                 <StackPanel VerticalAlignment="Center">
-                                    <shci:CachedImage shvh:ControlHelper.SquareLength="64" Source="{StaticResource UI_ItemIcon_210}"/>
+                                    <shci:CachedImage shvh:FrameworkElementHelper.SquareLength="64" Source="{StaticResource UI_ItemIcon_210}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
@@ -59,7 +59,7 @@
                                     Margin="8"
                                     HorizontalAlignment="Right"
                                     VerticalAlignment="Top"
-                                    shvh:ControlHelper.SquareLength="8"
+                                    shvh:FrameworkElementHelper.SquareLength="8"
                                     Style="{ThemeResource AttentionDotInfoBadgeStyle}"
                                     Visibility="{Binding ResinNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
                             </Grid>
@@ -73,7 +73,7 @@
 
                             <Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
                                 <StackPanel VerticalAlignment="Center">
-                                    <shci:CachedImage shvh:ControlHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_204}"/>
+                                    <shci:CachedImage shvh:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_204}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
@@ -84,14 +84,14 @@
                                     Margin="8"
                                     HorizontalAlignment="Right"
                                     VerticalAlignment="Top"
-                                    shvh:ControlHelper.SquareLength="8"
+                                    shvh:FrameworkElementHelper.SquareLength="8"
                                     Style="{ThemeResource AttentionDotInfoBadgeStyle}"
                                     Visibility="{Binding HomeCoinNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
                             </Grid>
 
                             <Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
                                 <StackPanel VerticalAlignment="Center">
-                                    <shci:CachedImage shvh:ControlHelper.SquareLength="32" Source="{StaticResource UI_MarkQuest_Events_Proce}"/>
+                                    <shci:CachedImage shvh:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkQuest_Events_Proce}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
@@ -102,7 +102,7 @@
                                     Margin="8"
                                     HorizontalAlignment="Right"
                                     VerticalAlignment="Top"
-                                    shvh:ControlHelper.SquareLength="8"
+                                    shvh:FrameworkElementHelper.SquareLength="8"
                                     Style="{ThemeResource AttentionDotInfoBadgeStyle}"
                                     Visibility="{Binding DailyTaskNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
                             </Grid>
@@ -116,7 +116,7 @@
 
                             <Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
                                 <StackPanel VerticalAlignment="Center">
-                                    <shci:CachedImage shvh:ControlHelper.SquareLength="32" Source="{StaticResource UI_MarkTower}"/>
+                                    <shci:CachedImage shvh:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkTower}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
@@ -127,7 +127,7 @@
 
                             <Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
                                 <StackPanel VerticalAlignment="Center">
-                                    <shci:CachedImage shvh:ControlHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_220021}"/>
+                                    <shci:CachedImage shvh:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_220021}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
@@ -138,7 +138,7 @@
                                     Margin="8"
                                     HorizontalAlignment="Right"
                                     VerticalAlignment="Top"
-                                    shvh:ControlHelper.SquareLength="8"
+                                    shvh:FrameworkElementHelper.SquareLength="8"
                                     Style="{ThemeResource AttentionDotInfoBadgeStyle}"
                                     Visibility="{Binding TransformerNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
                             </Grid>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml
index a871b38e..bac52a6d 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml
@@ -7,13 +7,13 @@
     mc:Ignorable="d">
 
     <Border Style="{StaticResource BorderCardStyle}">
-        <StackPanel Name="BackgroundStack">
-            <ContentPresenter Name="ContentHost"/>
+        <StackPanel Background="{x:Bind Fill}">
+            <ContentPresenter Content="{x:Bind TopContent, Mode=OneWay}"/>
             <TextBlock
-                Name="TextHost"
                 MaxWidth="80"
                 Margin="0,0,0,2"
                 HorizontalAlignment="Center"
+                Text="{x:Bind Text, Mode=OneWay}"
                 TextTrimming="CharacterEllipsis"
                 TextWrapping="NoWrap"/>
         </StackPanel>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml.cs b/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml.cs
index 60e047af..7b812821 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml.cs
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/BottomTextControl.xaml.cs
@@ -14,9 +14,9 @@ namespace Snap.Hutao.View.Control;
 /// </summary>
 [HighQuality]
 [ContentProperty(Name = nameof(TopContent))]
-[DependencyProperty("Text", typeof(string), "", nameof(OnTextChanged))]
-[DependencyProperty("TopContent", typeof(UIElement), default!, nameof(OnContentChanged))]
-[DependencyProperty("Fill", typeof(Brush), default!, nameof(OnFillChanged))]
+[DependencyProperty("Text", typeof(string), "")]
+[DependencyProperty("TopContent", typeof(UIElement), default!)]
+[DependencyProperty("Fill", typeof(Brush), default!)]
 internal sealed partial class BottomTextControl : ContentControl
 {
     /// <summary>
@@ -26,19 +26,4 @@ internal sealed partial class BottomTextControl : ContentControl
     {
         InitializeComponent();
     }
-
-    private static void OnTextChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
-    {
-        ((BottomTextControl)sender).TextHost.Text = (string)args.NewValue;
-    }
-
-    private static void OnContentChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
-    {
-        ((BottomTextControl)sender).ContentHost.Content = args.NewValue;
-    }
-
-    private static void OnFillChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
-    {
-        ((BottomTextControl)sender).BackgroundStack.Background = (Brush)args.NewValue;
-    }
 }
\ No newline at end of file
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml
index 176ded13..1e58033f 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml
@@ -16,8 +16,8 @@
         <StackPanel Margin="0,0,0,0" VerticalAlignment="Top">
             <cwc:SettingsCard Header="{shcm:ResourceString Name=ViewControlBaseValueSliderLevel}">
                 <ComboBox
-                    x:Name="ItemHost"
-                    SelectionChanged="ItemHostSelectionChanged"
+                    ItemsSource="{x:Bind Source, Mode=OneWay}"
+                    SelectedItem="{x:Bind SelectedItem, Mode=TwoWay}"
                     Style="{StaticResource SettingsContentComboBoxStyle}">
                     <ComboBox.ItemTemplate>
                         <DataTemplate>
@@ -28,7 +28,7 @@
             </cwc:SettingsCard>
         </StackPanel>
 
-        <ItemsControl x:Name="DetailsHost" VerticalAlignment="Top">
+        <ItemsControl VerticalAlignment="Top" ItemsSource="{x:Bind SelectedItem.Parameters, Mode=OneWay}">
             <ItemsControl.ItemContainerTransitions>
                 <TransitionCollection>
                     <ContentThemeTransition/>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml.cs b/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml.cs
index cfee7ed0..addab035 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml.cs
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/DescParamComboBox.xaml.cs
@@ -13,6 +13,7 @@ namespace Snap.Hutao.View.Control;
 /// </summary>
 [HighQuality]
 [DependencyProperty("Source", typeof(List<LevelParameters<string, ParameterDescription>>), default!, nameof(OnSourceChanged))]
+[DependencyProperty("SelectedItem", typeof(LevelParameters<string, ParameterDescription>), default!)]
 [DependencyProperty("PreferredSelectedIndex", typeof(int), 0)]
 internal sealed partial class DescParamComboBox : UserControl
 {
@@ -26,23 +27,12 @@ internal sealed partial class DescParamComboBox : UserControl
 
     private static void OnSourceChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
     {
-        // Some of the {x:Bind} feature is not working properly,
-        // so we use this simple code behind approach to achieve selection function
         if (sender is DescParamComboBox descParamComboBox)
         {
             if (args.NewValue != args.OldValue && args.NewValue is List<LevelParameters<string, ParameterDescription>> list)
             {
-                descParamComboBox.ItemHost.ItemsSource = list;
-                descParamComboBox.ItemHost.SelectedIndex = Math.Min(descParamComboBox.PreferredSelectedIndex, list.Count - 1);
+                descParamComboBox.SelectedItem = list.ElementAtOrLastOrDefault(descParamComboBox.PreferredSelectedIndex);
             }
         }
     }
-
-    private void ItemHostSelectionChanged(object sender, SelectionChangedEventArgs e)
-    {
-        if (sender is ComboBox { SelectedIndex: >= 0 } comboBox)
-        {
-            DetailsHost.ItemsSource = Source[comboBox.SelectedIndex]?.Parameters;
-        }
-    }
 }
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/HutaoStatisticsCard.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/HutaoStatisticsCard.xaml
index dc41e180..a8fa5e8f 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/HutaoStatisticsCard.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/HutaoStatisticsCard.xaml
@@ -10,6 +10,7 @@
     xmlns:shcp="using:Snap.Hutao.Control.Panel"
     xmlns:shvcont="using:Snap.Hutao.View.Control"
     xmlns:shvg="using:Snap.Hutao.ViewModel.GachaLog"
+    xmlns:shvh="using:Snap.Hutao.View.Helper"
     d:DataContext="{d:DesignInstance shvg:HutaoWishSummary}"
     mc:Ignorable="d">
 
@@ -21,8 +22,7 @@
                 Style="{StaticResource BorderCardStyle}">
                 <StackPanel>
                     <shvcont:ItemIcon
-                        Width="40"
-                        Height="40"
+                        shvh:FrameworkElementHelper.SquareLength="40"
                         Icon="{Binding Icon}"
                         Quality="{Binding Quality}"/>
                     <TextBlock
@@ -35,6 +35,7 @@
             </Border>
         </DataTemplate>
     </UserControl.Resources>
+
     <Border Style="{StaticResource BorderCardStyle}">
         <Grid>
             <Grid.RowDefinitions>
@@ -56,64 +57,37 @@
                         Margin="0,16,0,8"
                         Style="{StaticResource BaseTextBlockStyle}"
                         Text="{shcm:ResourceString Name=ViewControlStatisticsCardUpText}"/>
-                    <ItemsControl ItemTemplate="{StaticResource GridTemplate}" ItemsPanel="{StaticResource WrapPanelTemplate}" ItemsSource="{Binding UpItems}">
-                        <ItemsControl.Transitions>
-                            <TransitionCollection>
-                                <ReorderThemeTransition/>
-                            </TransitionCollection>
-                        </ItemsControl.Transitions>
-                    </ItemsControl>
+                    <ItemsControl
+                        ItemTemplate="{StaticResource GridTemplate}"
+                        ItemsPanel="{StaticResource WrapPanelTemplate}"
+                        ItemsSource="{Binding UpItems}"/>
 
                     <TextBlock
                         Margin="0,16,0,8"
                         Style="{StaticResource BaseTextBlockStyle}"
                         Text="{shcm:ResourceString Name=ViewControlStatisticsCardOrangeText}"/>
-                    <ItemsControl ItemTemplate="{StaticResource GridTemplate}" ItemsSource="{Binding OrangeItems}">
-                        <ItemsControl.Transitions>
-                            <TransitionCollection>
-                                <ReorderThemeTransition/>
-                            </TransitionCollection>
-                        </ItemsControl.Transitions>
-                        <ItemsControl.ItemsPanel>
-                            <ItemsPanelTemplate>
-                                <cwucont:WrapPanel/>
-                            </ItemsPanelTemplate>
-                        </ItemsControl.ItemsPanel>
-                    </ItemsControl>
+                    <ItemsControl
+                        ItemTemplate="{StaticResource GridTemplate}"
+                        ItemsPanel="{StaticResource WrapPanelTemplate}"
+                        ItemsSource="{Binding OrangeItems}"/>
 
                     <TextBlock
                         Margin="0,16,0,8"
                         Style="{StaticResource BaseTextBlockStyle}"
                         Text="{shcm:ResourceString Name=ViewControlStatisticsCardPurpleText}"/>
-                    <ItemsControl ItemTemplate="{StaticResource GridTemplate}" ItemsSource="{Binding PurpleItems}">
-                        <ItemsControl.Transitions>
-                            <TransitionCollection>
-                                <ReorderThemeTransition/>
-                            </TransitionCollection>
-                        </ItemsControl.Transitions>
-                        <ItemsControl.ItemsPanel>
-                            <ItemsPanelTemplate>
-                                <cwucont:WrapPanel/>
-                            </ItemsPanelTemplate>
-                        </ItemsControl.ItemsPanel>
-                    </ItemsControl>
+                    <ItemsControl
+                        ItemTemplate="{StaticResource GridTemplate}"
+                        ItemsPanel="{StaticResource WrapPanelTemplate}"
+                        ItemsSource="{Binding PurpleItems}"/>
 
                     <TextBlock
                         Margin="0,16,0,8"
                         Style="{StaticResource BaseTextBlockStyle}"
                         Text="{shcm:ResourceString Name=ViewControlStatisticsCardBlueText}"/>
-                    <ItemsControl ItemTemplate="{StaticResource GridTemplate}" ItemsSource="{Binding BlueItems}">
-                        <ItemsControl.Transitions>
-                            <TransitionCollection>
-                                <ReorderThemeTransition/>
-                            </TransitionCollection>
-                        </ItemsControl.Transitions>
-                        <ItemsControl.ItemsPanel>
-                            <ItemsPanelTemplate>
-                                <cwucont:WrapPanel/>
-                            </ItemsPanelTemplate>
-                        </ItemsControl.ItemsPanel>
-                    </ItemsControl>
+                    <ItemsControl
+                        ItemTemplate="{StaticResource GridTemplate}"
+                        ItemsPanel="{StaticResource WrapPanelTemplate}"
+                        ItemsSource="{Binding BlueItems}"/>
                 </StackPanel>
             </ScrollViewer>
         </Grid>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/ItemIcon.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/ItemIcon.xaml
index 08f17c3b..cf92fca4 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/ItemIcon.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/ItemIcon.xaml
@@ -6,9 +6,8 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:shci="using:Snap.Hutao.Control.Image"
     xmlns:shmmc="using:Snap.Hutao.Model.Metadata.Converter"
-    xmlns:shvc="using:Snap.Hutao.View.Control"
-    Width="80"
-    Height="80"
+    xmlns:shvh="using:Snap.Hutao.View.Helper"
+    shvh:FrameworkElementHelper.SquareLength="80"
     mc:Ignorable="d">
     <UserControl.Resources>
         <shmmc:QualityConverter x:Key="QualityConverter"/>
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/LaunchGameResourceExpander.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/LaunchGameResourceExpander.xaml
index 4947b339..503ea07e 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/LaunchGameResourceExpander.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/LaunchGameResourceExpander.xaml
@@ -4,8 +4,10 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:shwhshl="using:Snap.Hutao.Web.Hoyolab.SdkStatic.Hk4e.Launcher"
     HorizontalAlignment="Stretch"
     HorizontalContentAlignment="Stretch"
+    d:DataContext="{d:DesignInstance shwhshl:Package}"
     IsExpanded="True"
     mc:Ignorable="d">
 
@@ -21,20 +23,20 @@
             Grid.Row="1"
             Margin="0,4,0,0"
             Orientation="Horizontal">
-            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xF012;"/>
+            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentZipFolder}"/>
             <TextBlock
                 Width="80"
                 Margin="8,0,0,0"
                 HorizontalAlignment="Left"
                 Style="{StaticResource CaptionTextBlockStyle}"
                 Text="{Binding PackageSize, Converter={StaticResource FileSizeToFriendlyStringConverter}}"/>
-            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xE8B7;"/>
+            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentFolder}"/>
             <TextBlock
                 Width="80"
                 Margin="8,0,0,0"
                 Style="{StaticResource CaptionTextBlockStyle}"
                 Text="{Binding Size, Converter={StaticResource FileSizeToFriendlyStringConverter}}"/>
-            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xEDAD;"/>
+            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentAsteriskBadge12}"/>
             <TextBlock
                 Margin="8,0,0,0"
                 IsTextSelectionEnabled="True"
@@ -63,20 +65,20 @@
                             Grid.Row="1"
                             Margin="0,4,0,0"
                             Orientation="Horizontal">
-                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xF012;"/>
+                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentZipFolder}"/>
                             <TextBlock
                                 Width="80"
                                 Margin="8,0,0,0"
                                 HorizontalAlignment="Left"
                                 Style="{StaticResource CaptionTextBlockStyle}"
                                 Text="{Binding PackageSize, Converter={StaticResource FileSizeToFriendlyStringConverter}}"/>
-                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xE8B7;"/>
+                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentFolder}"/>
                             <TextBlock
                                 Width="80"
                                 Margin="8,0,0,0"
                                 Style="{StaticResource CaptionTextBlockStyle}"
                                 Text="{Binding Size, Converter={StaticResource FileSizeToFriendlyStringConverter}}"/>
-                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="&#xEDAD;"/>
+                            <FontIcon FontSize="{StaticResource CaptionTextBlockFontSize}" Glyph="{StaticResource FontIconContentAsteriskBadge12}"/>
                             <TextBlock
                                 Margin="8,0,0,0"
                                 IsTextSelectionEnabled="True"
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/SkillPivot.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/SkillPivot.xaml
index 25c02eab..54b8166d 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/SkillPivot.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/SkillPivot.xaml
@@ -6,14 +6,12 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:shci="using:Snap.Hutao.Control.Image"
     xmlns:shmmc="using:Snap.Hutao.Model.Metadata.Converter"
+    xmlns:shvh="using:Snap.Hutao.View.Helper"
     mc:Ignorable="d">
 
     <UserControl.Resources>
         <shmmc:SkillIconConverter x:Key="SkillIconConverter"/>
-
         <Thickness x:Key="PivotHeaderItemMargin">0,0,16,0</Thickness>
-        <Thickness x:Key="PivotItemMargin">0</Thickness>
-
         <Style BasedOn="{StaticResource DefaultPivotHeaderItemStyle}" TargetType="PivotHeaderItem">
             <Setter Property="Height" Value="80"/>
         </Style>
@@ -28,10 +26,7 @@
         <Pivot.HeaderTemplate>
             <DataTemplate>
                 <StackPanel>
-                    <shci:MonoChrome
-                        Width="36"
-                        Height="36"
-                        Source="{Binding Icon, Converter={StaticResource SkillIconConverter}}"/>
+                    <shci:MonoChrome shvh:FrameworkElementHelper.SquareLength="36" Source="{Binding Icon, Converter={StaticResource SkillIconConverter}}"/>
                     <TextBlock
                         Margin="0,8,0,0"
                         HorizontalAlignment="Center"
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Control/StatisticsCard.xaml b/src/Snap.Hutao/Snap.Hutao/View/Control/StatisticsCard.xaml
index 3eba6420..466aa61c 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Control/StatisticsCard.xaml
+++ b/src/Snap.Hutao/Snap.Hutao/View/Control/StatisticsCard.xaml
@@ -13,41 +13,37 @@
     xmlns:shvcont="using:Snap.Hutao.View.Control"
     xmlns:shvconv="using:Snap.Hutao.View.Converter"
     xmlns:shvg="using:Snap.Hutao.ViewModel.GachaLog"
+    xmlns:shvh="using:Snap.Hutao.View.Helper"
     d:DataContext="{d:DesignInstance shvg:TypedWishSummary}"
     mc:Ignorable="d">
 
     <UserControl.Resources>
-        <SolidColorBrush x:Key="BlueBrush" Color="#FF5180CB"/>
-        <SolidColorBrush x:Key="PurpleBrush" Color="#FFA156E0"/>
-        <SolidColorBrush x:Key="OrangeBrush" Color="#FFBC6932"/>
-
         <shvconv:Int32ToGradientColorConverter x:Key="Int32ToGradientColorConverter" MaximumValue="{Binding GuaranteeOrangeThreshold}"/>
-        <shc:BindingProxy x:Key="SummaryProxy" DataContext="{Binding}"/>
 
         <DataTemplate x:Key="OrangeListTemplate" d:DataType="shvg:SummaryItem">
-            <Grid Margin="0,4,0,0" Background="Transparent">
+            <Grid
+                Margin="0,4,0,0"
+                Background="Transparent"
+                Style="{StaticResource BorderGridStyle}">
                 <ToolTipService.ToolTip>
                     <TextBlock Text="{Binding TimeFormatted}"/>
                 </ToolTipService.ToolTip>
 
-                <Border Style="{StaticResource BorderCardStyle}">
-                    <ProgressBar
-                        MinHeight="32"
-                        Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
-                        CornerRadius="{StaticResource CompatCornerRadius}"
-                        Maximum="{Binding GuaranteeOrangeThreshold}"
-                        Opacity="0.2"
-                        Value="{Binding LastPull}">
-                        <ProgressBar.Foreground>
-                            <SolidColorBrush Color="{Binding LastPull, Converter={StaticResource Int32ToGradientColorConverter}}"/>
-                        </ProgressBar.Foreground>
-                    </ProgressBar>
-                </Border>
+                <ProgressBar
+                    MinHeight="32"
+                    Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
+                    CornerRadius="{StaticResource CompatCornerRadius}"
+                    Maximum="{Binding GuaranteeOrangeThreshold}"
+                    Opacity="{StaticResource LargeBackgroundProgressBarOpacity}"
+                    Value="{Binding LastPull}">
+                    <ProgressBar.Foreground>
+                        <SolidColorBrush Color="{Binding LastPull, Converter={StaticResource Int32ToGradientColorConverter}}"/>
+                    </ProgressBar.Foreground>
+                </ProgressBar>
 
                 <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                     <shci:CachedImage
-                        Width="32"
-                        Height="32"
+                        shvh:FrameworkElementHelper.SquareLength="32"
                         CornerRadius="{ThemeResource ControlCornerRadius}"
                         Source="{Binding Icon}"/>
                     <TextBlock
diff --git a/src/Snap.Hutao/Snap.Hutao/View/Helper/ControlHelper.cs b/src/Snap.Hutao/Snap.Hutao/View/Helper/FrameworkElementHelper.cs
similarity index 93%
rename from src/Snap.Hutao/Snap.Hutao/View/Helper/ControlHelper.cs
rename to src/Snap.Hutao/Snap.Hutao/View/Helper/FrameworkElementHelper.cs
index f7c321fb..ae1e25f6 100644
--- a/src/Snap.Hutao/Snap.Hutao/View/Helper/ControlHelper.cs
+++ b/src/Snap.Hutao/Snap.Hutao/View/Helper/FrameworkElementHelper.cs
@@ -9,7 +9,7 @@ namespace Snap.Hutao.View.Helper;
 
 [SuppressMessage("", "SH001")]
 [DependencyProperty("SquareLength", typeof(double), 0D, nameof(OnSquareLengthChanged), IsAttached = true, AttachedType = typeof(Microsoft.UI.Xaml.Controls.Control))]
-public sealed partial class ControlHelper
+public sealed partial class FrameworkElementHelper
 {
     private static void OnSquareLengthChanged(DependencyObject dp, DependencyPropertyChangedEventArgs e)
     {