UI/UX fine tuning

This commit is contained in:
DismissedLight
2023-09-20 23:50:24 +08:00
parent 5a99488582
commit 2a757dce51
7 changed files with 206 additions and 196 deletions

View File

@@ -20,10 +20,12 @@
<ResourceDictionary x:Key="Light">
<Color x:Key="AvatarPropertyAddValueColor">#FF74BF00</Color>
<Color x:Key="CompatBackgroundColor">#FFF4F4F4</Color>
<SolidColorBrush x:Key="DarkOnlyOverlayMaskBrush" Color="#00000000"/>
</ResourceDictionary>
<ResourceDictionary x:Key="Dark">
<Color x:Key="AvatarPropertyAddValueColor">#FF90E800</Color>
<Color x:Key="CompatBackgroundColor">#FF242424</Color>
<SolidColorBrush x:Key="DarkOnlyOverlayMaskBrush" Color="#60000000"/>
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
<!-- Modify Window title bar color -->

View File

@@ -20,54 +20,57 @@
<mxi:Interaction.Behaviors>
<shcb:InvokeCommandOnLoadedBehavior Command="{Binding OpenUICommand}"/>
</mxi:Interaction.Behaviors>
<Button.Resources>
<DataTemplate x:Key="AchievementTempate" x:DataType="shva:AchievementView">
<StackPanel Margin="0,4,0,0">
<TextBlock
Opacity="0.8"
Style="{StaticResource SubtitleTextBlockStyle}"
Text="{Binding Inner.Title}"
TextTrimming="CharacterEllipsis"
TextWrapping="NoWrap"/>
<TextBlock
Opacity="0.6"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding Time}"
TextWrapping="NoWrap"/>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="AchievementArchiveTempate" x:DataType="shva:AchievementStatistics">
<Grid Margin="12">
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{shcm:ResourceString Name=ViewCardAchievementStatisticsTitle}"/>
<TextBlock
Grid.Row="0"
HorizontalAlignment="Right"
Text="{Binding DisplayName}"/>
<TextBlock
Grid.Row="1"
Margin="0,4,0,0"
Style="{StaticResource TitleTextBlockStyle}"
Text="{Binding FinishDescription}"/>
<ItemsControl
Grid.Row="2"
ItemTemplate="{StaticResource AchievementTempate}"
ItemsSource="{Binding Achievements}"/>
</Grid>
</DataTemplate>
</Button.Resources>
<Grid>
<Grid Visibility="{Binding IsInitialized, Converter={StaticResource BoolToVisibilityConverter}}">
<Grid Visibility="{Binding StatisticsList.Count, Converter={StaticResource Int32ToVisibilityConverter}}">
<FlipView
x:Name="RootFlipView"
Background="{x:Null}"
ItemsSource="{Binding StatisticsList}">
<FlipView.ItemTemplate>
<DataTemplate>
<Grid Margin="12">
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{shcm:ResourceString Name=ViewCardAchievementStatisticsTitle}"/>
<TextBlock
Grid.Row="0"
HorizontalAlignment="Right"
Text="{Binding DisplayName}"/>
<TextBlock
Grid.Row="1"
Margin="0,4,0,0"
Style="{StaticResource TitleTextBlockStyle}"
Text="{Binding FinishDescription}"/>
<ItemsControl Grid.Row="2" ItemsSource="{Binding Achievements}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,4,0,0">
<TextBlock
Opacity="0.8"
Style="{StaticResource SubtitleTextBlockStyle}"
Text="{Binding Inner.Title}"
TextTrimming="CharacterEllipsis"
TextWrapping="NoWrap"/>
<TextBlock
Opacity="0.6"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding Time}"
TextWrapping="NoWrap"/>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</DataTemplate>
</FlipView.ItemTemplate>
</FlipView>
ItemTemplate="{StaticResource AchievementArchiveTempate}"
ItemsSource="{Binding StatisticsList}"/>
<PipsPager
Height="16"

View File

@@ -5,7 +5,11 @@ using Microsoft.UI.Xaml.Controls;
namespace Snap.Hutao.View.Card;
/// <summary>
/// 保存对卡片的引用
/// ItemsRepeater 无法直接使用带有 DataContext 属性的类为直接的源
/// </summary>
internal sealed class CardReference
{
public Button? Card { get; set; }
}
}

View File

@@ -9,6 +9,7 @@
xmlns:shch="using:Snap.Hutao.Control.Helper"
xmlns:shci="using:Snap.Hutao.Control.Image"
xmlns:shcm="using:Snap.Hutao.Control.Markup"
xmlns:shme="using:Snap.Hutao.Model.Entity"
xmlns:shvc="using:Snap.Hutao.View.Control"
xmlns:shvd="using:Snap.Hutao.ViewModel.DailyNote"
Padding="0"
@@ -23,155 +24,157 @@
<mxi:Interaction.Behaviors>
<shcb:InvokeCommandOnLoadedBehavior Command="{Binding OpenUICommand}"/>
</mxi:Interaction.Behaviors>
<Button.Resources>
<DataTemplate x:Key="DailyNoteTemplate" x:DataType="shme:DailyNoteEntry">
<Grid
Margin="12"
ColumnSpacing="6"
RowSpacing="6">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock
Grid.Row="0"
HorizontalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding Uid}"/>
<TextBlock
Grid.Row="0"
Grid.Column="1"
Grid.ColumnSpan="2"
HorizontalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding RefreshTimeFormatted}"/>
<Grid
Grid.Row="1"
Grid.Column="0"
RowSpacing="6">
<Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="64" Source="{StaticResource UI_ItemIcon_210}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.ResinFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding ResinNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
<Grid
Grid.Row="1"
Grid.Column="1"
RowSpacing="6">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_204}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.HomeCoinFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch: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 shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkQuest_Events_Proce}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.TaskFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding DailyTaskNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
<Grid
Grid.Row="1"
Grid.Column="2"
RowSpacing="6">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkTower}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.ResinDiscountFormatted}"/>
</StackPanel>
</Grid>
<Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_220021}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.Transformer.RecoveryTime.TimeLeftFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding TransformerNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
</Grid>
</DataTemplate>
</Button.Resources>
<Grid>
<Grid Visibility="{Binding IsInitialized, Converter={StaticResource BoolToVisibilityConverter}}">
<Grid Visibility="{Binding DailyNoteEntries.Count, Converter={StaticResource Int32ToVisibilityConverter}}">
<FlipView
x:Name="RootFlipView"
Background="{x:Null}"
ItemsSource="{Binding DailyNoteEntries}">
<FlipView.ItemTemplate>
<DataTemplate>
<Grid
Margin="12"
ColumnSpacing="6"
RowSpacing="6">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock
Grid.Row="0"
HorizontalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding Uid}"/>
<TextBlock
Grid.Row="0"
Grid.Column="1"
Grid.ColumnSpan="2"
HorizontalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding RefreshTimeFormatted}"/>
<Grid
Grid.Row="1"
Grid.Column="0"
RowSpacing="6">
<Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="64" Source="{StaticResource UI_ItemIcon_210}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.ResinFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding ResinNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
<Grid
Grid.Row="1"
Grid.Column="1"
RowSpacing="6">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_204}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.HomeCoinFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch: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 shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkQuest_Events_Proce}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.TaskFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding DailyTaskNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
<Grid
Grid.Row="1"
Grid.Column="2"
RowSpacing="6">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_MarkTower}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.ResinDiscountFormatted}"/>
</StackPanel>
</Grid>
<Grid Grid.Row="1" Style="{StaticResource BorderGridStyle}">
<StackPanel VerticalAlignment="Center">
<shci:CachedImage shch:FrameworkElementHelper.SquareLength="32" Source="{StaticResource UI_ItemIcon_220021}"/>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
Style="{StaticResource CaptionTextBlockStyle}"
Text="{Binding DailyNote.Transformer.RecoveryTime.TimeLeftFormatted}"/>
</StackPanel>
<InfoBadge
Margin="8"
HorizontalAlignment="Right"
VerticalAlignment="Top"
shch:FrameworkElementHelper.SquareLength="8"
Style="{ThemeResource AttentionDotInfoBadgeStyle}"
Visibility="{Binding TransformerNotifySuppressed, Converter={StaticResource BoolToVisibilityConverter}}"/>
</Grid>
</Grid>
</Grid>
</DataTemplate>
</FlipView.ItemTemplate>
</FlipView>
ItemTemplate="{StaticResource DailyNoteTemplate}"
ItemsSource="{Binding DailyNoteEntries}"/>
<PipsPager
Height="16"

View File

@@ -12,7 +12,7 @@
VerticalContentAlignment="Stretch"
mc:Ignorable="d">
<Grid>
<clw:Shimmer IsActive="{x:Bind IsLoading, Mode=OneWay}"/>
<clw:Shimmer CornerRadius="0" IsActive="{x:Bind IsLoading, Mode=OneWay}"/>
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<shci:CachedImage
Width="120"

View File

@@ -10,5 +10,8 @@
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
mc:Ignorable="d">
<clw:Shimmer IsActive="{x:Bind IsLoading}" Duration="0:0:1"/>
<clw:Shimmer
CornerRadius="0"
IsActive="{x:Bind IsLoading}"
Duration="0:0:1"/>
</shc:Loading>

View File

@@ -136,22 +136,17 @@
<mxi:Interaction.Behaviors>
<shcb:AutoHeightBehavior TargetHeight="1024" TargetWidth="2048"/>
</mxi:Interaction.Behaviors>
<Border Grid.ColumnSpan="2" Background="{ThemeResource DarkOnlyOverlayMaskBrush}"/>
<ScrollViewer
Grid.Column="0"
Margin="16"
VerticalScrollBarVisibility="Hidden">
<StackPanel>
<shvc:BottomTextControl
MaxWidth="80"
RequestedTheme="Light"
Text="{shcm:ResourceString Name=ViewPageWiKiWeaponBeforeAscensionTitle}">
<shvc:BottomTextControl MaxWidth="80" Text="{shcm:ResourceString Name=ViewPageWiKiWeaponBeforeAscensionTitle}">
<shvc:ItemIcon Icon="{Binding Selected.Icon, Converter={StaticResource EquipIconConverter}}" Quality="{Binding Selected.RankLevel}"/>
</shvc:BottomTextControl>
<shvc:BottomTextControl
Margin="0,16,0,0"
RequestedTheme="Light"
Text="{shcm:ResourceString Name=ViewPageWiKiWeaponAfterAscensionTitle}">
<shvc:BottomTextControl Margin="0,16,0,0" Text="{shcm:ResourceString Name=ViewPageWiKiWeaponAfterAscensionTitle}">
<shvc:ItemIcon Icon="{Binding Selected.AwakenIcon, Converter={StaticResource EquipIconConverter}}" Quality="{Binding Selected.RankLevel}"/>
</shvc:BottomTextControl>
</StackPanel>