mirror of
https://gitcode.com/gh_mirrors/se/Semi.Avalonia
synced 2026-04-10 03:06:35 +08:00
Fix CarouselPage ControlTemplate and sync NavigationPage template (#791)
* fix: specify TargetType in ControlTemplate for CarouselPage and remove redundant ItemsSource bindings in TabbedPage. * feat: sync ContentPage with Avalonia Fluent version. * fix: sync upstream NavigationPage template. * feat: adjust NavigationPage bar height and add large style support * feat: add ToggleSwitch for large style support in NavigationPageDemo --------- Co-authored-by: Dong Bin <popmessiah@hotmail.com>
This commit is contained in:
Zhang Dian
@@ -48,6 +48,7 @@
|
||||
Text="Current: Home"
|
||||
Opacity="0.7"
|
||||
TextWrapping="Wrap" />
|
||||
<ToggleSwitch Content="Large" Name="large" />
|
||||
</StackPanel>
|
||||
</ScrollViewer>
|
||||
|
||||
@@ -58,7 +59,9 @@
|
||||
BorderThickness="1"
|
||||
CornerRadius="6"
|
||||
ClipToBounds="True">
|
||||
<NavigationPage Name="DemoNav" />
|
||||
<NavigationPage
|
||||
Name="DemoNav"
|
||||
Classes.Large="{Binding #large.IsChecked}" />
|
||||
</Border>
|
||||
</DockPanel>
|
||||
</ScrollViewer>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ControlTheme x:Key="{x:Type CarouselPage}" TargetType="CarouselPage">
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate>
|
||||
<ControlTemplate TargetType="CarouselPage">
|
||||
<Carousel
|
||||
Name="PART_Carousel"
|
||||
Background="{TemplateBinding Background}"
|
||||
|
||||
@@ -16,28 +16,27 @@
|
||||
<ControlTheme x:Key="{x:Type ContentPage}" TargetType="ContentPage">
|
||||
<Setter Property="Background" Value="{DynamicResource ContentPageBackground}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource ContentPageForeground}" />
|
||||
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
|
||||
<Setter Property="VerticalContentAlignment" Value="Stretch" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="ContentPage">
|
||||
<Grid RowDefinitions="Auto,*,Auto" Background="{TemplateBinding Background}">
|
||||
<DockPanel>
|
||||
<ContentPresenter
|
||||
Name="PART_TopCommandBar"
|
||||
Grid.Row="0"
|
||||
Content="{TemplateBinding TopCommandBar}" />
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter"
|
||||
Grid.Row="1"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
|
||||
DockPanel.Dock="Top" />
|
||||
<ContentPresenter
|
||||
Name="PART_BottomCommandBar"
|
||||
Grid.Row="2"
|
||||
Content="{TemplateBinding BottomCommandBar}" />
|
||||
</Grid>
|
||||
DockPanel.Dock="Bottom" />
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}" />
|
||||
</DockPanel>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
</ResourceDictionary>
|
||||
@@ -6,89 +6,118 @@
|
||||
</Design.PreviewWith>
|
||||
|
||||
<ControlTheme x:Key="{x:Type NavigationPage}" TargetType="NavigationPage">
|
||||
<Setter Property="Background" Value="{DynamicResource NavigationPageBackground}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource NavigationPageForeground}" />
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="BarHeight" Value="{DynamicResource NavigationPageBarMinHeight}" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="NavigationPage">
|
||||
<Grid RowDefinitions="Auto,*,Auto" Background="{TemplateBinding Background}">
|
||||
<!-- Top command bar -->
|
||||
<ContentPresenter
|
||||
Name="PART_TopCommandBar"
|
||||
Grid.Row="0" />
|
||||
|
||||
<!-- Content host (pages + navigation bar) -->
|
||||
<Panel Name="PART_ContentHost" Grid.Row="1">
|
||||
<!-- Previous page (back animation target) -->
|
||||
<ContentPresenter Name="PART_PageBackPresenter" />
|
||||
|
||||
<!-- Current page -->
|
||||
<ContentPresenter Name="PART_PagePresenter" />
|
||||
|
||||
<!-- Modal back page -->
|
||||
<ContentPresenter Name="PART_ModalBackPresenter" />
|
||||
|
||||
<!-- Modal page -->
|
||||
<ContentPresenter Name="PART_ModalPresenter" />
|
||||
|
||||
<!-- Navigation bar (overlaid on content by default) -->
|
||||
<Panel ClipToBounds="True">
|
||||
<DockPanel>
|
||||
<Border
|
||||
Name="PART_NavigationBar"
|
||||
MinHeight="{TemplateBinding BarHeight}"
|
||||
Padding="{DynamicResource NavigationPageBarPadding}"
|
||||
VerticalAlignment="Top"
|
||||
Background="{DynamicResource NavigationPageBarBackground}"
|
||||
BorderBrush="{DynamicResource NavigationPageBarBorderBrush}"
|
||||
BorderThickness="{DynamicResource NavigationPageBarBorderThickness}">
|
||||
<Grid ColumnDefinitions="Auto,*,Auto">
|
||||
<Button
|
||||
Name="PART_BackButton"
|
||||
Grid.Column="0"
|
||||
MinHeight="{DynamicResource NavigationPageBarMinHeight}"
|
||||
MinWidth="{DynamicResource NavigationPageBarMinHeight}"
|
||||
Padding="8"
|
||||
VerticalAlignment="Center"
|
||||
IsVisible="{TemplateBinding IsBackButtonEffectivelyVisible}"
|
||||
Background="{DynamicResource NavigationPageBackButtonBackground}"
|
||||
Theme="{StaticResource BorderlessButton}">
|
||||
<Panel Background="Transparent">
|
||||
<PathIcon
|
||||
Theme="{StaticResource InnerPathIcon}"
|
||||
Classes="Large"
|
||||
Data="{DynamicResource NavigationPageBackButtonGlyph}"
|
||||
Foreground="{DynamicResource NavigationPageBackButtonForeground}"
|
||||
IsVisible="{Binding CurrentPage?.(NavigationPage.BackButtonContent), RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static ObjectConverters.IsNull}, FallbackValue=False}" />
|
||||
<ContentPresenter
|
||||
Content="{Binding CurrentPage?.(NavigationPage.BackButtonContent), RelativeSource={RelativeSource TemplatedParent}, FallbackValue={x:Null}}"
|
||||
IsVisible="{Binding CurrentPage?.(NavigationPage.BackButtonContent), RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static ObjectConverters.IsNotNull}, FallbackValue=False}"
|
||||
VerticalAlignment="Center"
|
||||
HorizontalAlignment="Center" />
|
||||
</Panel>
|
||||
</Button>
|
||||
<ContentPresenter
|
||||
Grid.Column="1"
|
||||
HorizontalAlignment="Center"
|
||||
VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</Border>
|
||||
</Panel>
|
||||
Name="PART_NavBarSpacer"
|
||||
Height="{TemplateBinding EffectiveBarHeight}"
|
||||
IsVisible="False"
|
||||
DockPanel.Dock="Top" />
|
||||
<ContentPresenter
|
||||
Name="PART_BottomCommandBar"
|
||||
DockPanel.Dock="Bottom"
|
||||
Background="{TemplateBinding Background}"
|
||||
Content="{Binding CurrentPage.(NavigationPage.BottomCommandBar), RelativeSource={RelativeSource TemplatedParent}, FallbackValue={x:Null}}" />
|
||||
<Panel
|
||||
Name="PART_ContentHost"
|
||||
Background="{TemplateBinding Background}"
|
||||
ClipToBounds="True">
|
||||
<ContentPresenter Name="PART_PageBackPresenter" />
|
||||
<ContentPresenter Name="PART_PagePresenter" />
|
||||
</Panel>
|
||||
</DockPanel>
|
||||
|
||||
<!-- Bottom command bar -->
|
||||
<Border
|
||||
Name="PART_NavigationBar"
|
||||
VerticalAlignment="Top"
|
||||
MinHeight="{TemplateBinding EffectiveBarHeight}"
|
||||
Padding="{DynamicResource NavigationPageBarPadding}"
|
||||
Background="{DynamicResource NavigationPageBarBackground}"
|
||||
BorderBrush="{DynamicResource NavigationPageBarBorderBrush}"
|
||||
BorderThickness="{DynamicResource NavigationPageBarBorderThickness}">
|
||||
<Grid ColumnDefinitions="Auto,*,Auto">
|
||||
<Button
|
||||
Name="PART_BackButton"
|
||||
Grid.Column="0"
|
||||
Classes="Tertiary"
|
||||
Height="{TemplateBinding BarHeight}"
|
||||
Width="{TemplateBinding BarHeight}"
|
||||
Padding="8"
|
||||
IsVisible="{TemplateBinding IsBackButtonEffectivelyVisible}"
|
||||
Theme="{StaticResource BorderlessButton}">
|
||||
<Panel Background="Transparent">
|
||||
<PathIcon
|
||||
Name="PART_BackButtonDefaultIcon"
|
||||
Theme="{StaticResource InnerPathIcon}"
|
||||
Data="{DynamicResource NavigationPageBackButtonGlyph}" />
|
||||
<ContentPresenter
|
||||
Name="PART_BackButtonContentPresenter"
|
||||
VerticalAlignment="Center"
|
||||
HorizontalAlignment="Center" />
|
||||
</Panel>
|
||||
</Button>
|
||||
<ContentPresenter
|
||||
Name="PART_Header"
|
||||
Grid.Column="1"
|
||||
FontWeight="SemiBold"
|
||||
Content="{Binding CurrentPage?.Header, RelativeSource={RelativeSource TemplatedParent}, FallbackValue={x:Null}}"
|
||||
ContentTemplate="{Binding CurrentPage?.HeaderTemplate, RelativeSource={RelativeSource TemplatedParent}, FallbackValue={x:Null}}"
|
||||
VerticalAlignment="Center"
|
||||
Margin="12,0" />
|
||||
<ContentPresenter
|
||||
Name="PART_TopCommandBar"
|
||||
Grid.Column="2"
|
||||
HorizontalAlignment="Right"
|
||||
Content="{Binding CurrentPage?.(NavigationPage.TopCommandBar), RelativeSource={RelativeSource TemplatedParent}, FallbackValue={x:Null}}" />
|
||||
</Grid>
|
||||
</Border>
|
||||
|
||||
<Border
|
||||
Name="PART_NavBarShadow"
|
||||
ZIndex="1"
|
||||
VerticalAlignment="Top"
|
||||
IsVisible="False"
|
||||
Height="4"
|
||||
IsHitTestVisible="False">
|
||||
<Border.Background>
|
||||
<LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
|
||||
<GradientStop Color="#0C000000" Offset="0" />
|
||||
<GradientStop Color="#00000000" Offset="1" />
|
||||
</LinearGradientBrush>
|
||||
</Border.Background>
|
||||
</Border>
|
||||
<ContentPresenter
|
||||
Name="PART_BottomCommandBar"
|
||||
Grid.Row="2" />
|
||||
</Grid>
|
||||
Name="PART_ModalBackPresenter"
|
||||
ZIndex="99"
|
||||
IsVisible="False"
|
||||
Background="{TemplateBinding Background}" />
|
||||
<ContentPresenter
|
||||
Name="PART_ModalPresenter"
|
||||
ZIndex="100"
|
||||
IsVisible="False"
|
||||
Background="{TemplateBinding Background}" />
|
||||
</Panel>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
|
||||
<!-- Navigation bar is inset (content flows under the bar) -->
|
||||
<Style Selector="^:nav-bar-inset /template/ Border#PART_NavigationBar">
|
||||
<Setter Property="BorderThickness" Value="0" />
|
||||
<Style Selector="^ /template/ Border#PART_NavigationBar">
|
||||
<Setter Property="Background" Value="{DynamicResource NavigationBarBackground}" />
|
||||
</Style>
|
||||
|
||||
<!-- Compact navigation bar -->
|
||||
<Style Selector="^:nav-bar-compact /template/ Border#PART_NavigationBar">
|
||||
<Setter Property="MinHeight" Value="0" />
|
||||
<Style Selector="^:nav-bar-inset /template/ Border#PART_NavBarSpacer">
|
||||
<Setter Property="IsVisible" Value="True" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^:nav-bar-compact /template/ ContentPresenter#PART_TopCommandBar CommandBar">
|
||||
<Setter Property="DefaultLabelPosition" Value="Collapsed" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^.Large">
|
||||
<Setter Property="BarHeight" Value="{DynamicResource NavigationPageBarLargeMinHeight}" />
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
@@ -11,8 +11,7 @@
|
||||
<TabControl
|
||||
Name="PART_TabControl"
|
||||
Background="{TemplateBinding Background}"
|
||||
Theme="{StaticResource LineTabControl}"
|
||||
ItemsSource="{TemplateBinding Pages}" />
|
||||
Theme="{StaticResource LineTabControl}" />
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
</ControlTheme>
|
||||
@@ -22,8 +21,7 @@
|
||||
<TabControl
|
||||
Name="PART_TabControl"
|
||||
Background="{TemplateBinding Background}"
|
||||
Theme="{StaticResource CardTabControl}"
|
||||
ItemsSource="{TemplateBinding Pages}" />
|
||||
Theme="{StaticResource CardTabControl}" />
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
</ControlTheme>
|
||||
@@ -33,8 +31,7 @@
|
||||
<TabControl
|
||||
Name="PART_TabControl"
|
||||
Background="{TemplateBinding Background}"
|
||||
Theme="{StaticResource ButtonTabControl}"
|
||||
ItemsSource="{TemplateBinding Pages}" />
|
||||
Theme="{StaticResource ButtonTabControl}" />
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
</ControlTheme>
|
||||
|
||||
@@ -1,14 +1,5 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- NavigationPage -->
|
||||
<StaticResource x:Key="NavigationPageBackground" ResourceKey="SemiColorBackground0" />
|
||||
<StaticResource x:Key="NavigationPageForeground" ResourceKey="SemiColorText0" />
|
||||
<!-- Navigation bar -->
|
||||
<StaticResource x:Key="NavigationPageBarBackground" ResourceKey="SemiColorBackground1" />
|
||||
<StaticResource x:Key="NavigationPageBarForeground" ResourceKey="SemiColorText0" />
|
||||
<StaticResource x:Key="NavigationPageBarBorderBrush" ResourceKey="SemiColorBorder" />
|
||||
<!-- Back button -->
|
||||
<SolidColorBrush x:Key="NavigationPageBackButtonBackground" Color="Transparent" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonForeground" ResourceKey="SemiColorText0" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPointeroverBackground" ResourceKey="SemiColorFill0" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPressedBackground" ResourceKey="SemiColorFill1" />
|
||||
</ResourceDictionary>
|
||||
|
||||
@@ -1,14 +1,5 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- NavigationPage -->
|
||||
<StaticResource x:Key="NavigationPageBackground" ResourceKey="SemiColorWindow" />
|
||||
<StaticResource x:Key="NavigationPageForeground" ResourceKey="SemiColorWindowText" />
|
||||
<!-- Navigation bar -->
|
||||
<StaticResource x:Key="NavigationPageBarBackground" ResourceKey="SemiColorWindow" />
|
||||
<StaticResource x:Key="NavigationPageBarForeground" ResourceKey="SemiColorWindowText" />
|
||||
<StaticResource x:Key="NavigationPageBarBorderBrush" ResourceKey="SemiColorWindowText" />
|
||||
<!-- Back button -->
|
||||
<SolidColorBrush x:Key="NavigationPageBackButtonBackground" Color="Transparent" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonForeground" ResourceKey="SemiColorWindowText" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPointeroverBackground" ResourceKey="SemiColorHighlight" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPressedBackground" ResourceKey="SemiColorHighlightText" />
|
||||
</ResourceDictionary>
|
||||
|
||||
@@ -1,14 +1,5 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- NavigationPage -->
|
||||
<StaticResource x:Key="NavigationPageBackground" ResourceKey="SemiColorBackground0" />
|
||||
<StaticResource x:Key="NavigationPageForeground" ResourceKey="SemiColorText0" />
|
||||
<!-- Navigation bar -->
|
||||
<StaticResource x:Key="NavigationPageBarBackground" ResourceKey="SemiColorBackground1" />
|
||||
<StaticResource x:Key="NavigationPageBarForeground" ResourceKey="SemiColorText0" />
|
||||
<StaticResource x:Key="NavigationPageBarBorderBrush" ResourceKey="SemiColorBorder" />
|
||||
<!-- Back button -->
|
||||
<SolidColorBrush x:Key="NavigationPageBackButtonBackground" Color="Transparent" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonForeground" ResourceKey="SemiColorText0" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPointeroverBackground" ResourceKey="SemiColorFill0" />
|
||||
<StaticResource x:Key="NavigationPageBackButtonPressedBackground" ResourceKey="SemiColorFill1" />
|
||||
</ResourceDictionary>
|
||||
</ResourceDictionary>
|
||||
@@ -1,6 +1,7 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- NavigationPage -->
|
||||
<x:Double x:Key="NavigationPageBarMinHeight">48</x:Double>
|
||||
<x:Double x:Key="NavigationPageBarMinHeight">32</x:Double>
|
||||
<x:Double x:Key="NavigationPageBarLargeMinHeight">48</x:Double>
|
||||
<Thickness x:Key="NavigationPageBarPadding">4 0</Thickness>
|
||||
<Thickness x:Key="NavigationPageBarBorderThickness">0 0 0 1</Thickness>
|
||||
<StaticResource x:Key="NavigationPageBackButtonGlyph" ResourceKey="SemiIconChevronLeft" />
|
||||
|
||||
Reference in New Issue
Block a user
