chore: stretch the combo box.

* fix: add icons to TabbedPage content and improve layout.

* fix: only update Placement=Top/Bottom in TabbedPage.

.editorconfig

@@ -1,243 +0,0 @@
-# editorconfig.org
-
-# top-most EditorConfig file
-root = true
-
-# Default settings:
-# A newline ending every file
-# Use 4 spaces as indentation
-[*]
-insert_final_newline = true
-indent_style = space
-indent_size = 4
-
-# C# files
-[*.cs]
-# New line preferences
-csharp_new_line_before_open_brace = all
-csharp_new_line_before_else = true
-csharp_new_line_before_catch = true
-csharp_new_line_before_finally = true
-csharp_new_line_before_members_in_object_initializers = true
-csharp_new_line_before_members_in_anonymous_types = true
-csharp_new_line_between_query_expression_clauses = true
-# trim_trailing_whitespace = true
-
-# Indentation preferences
-csharp_indent_block_contents = true
-csharp_indent_braces = false
-csharp_indent_case_contents = true
-csharp_indent_switch_labels = true
-csharp_indent_labels = one_less_than_current
-
-# avoid this. unless absolutely necessary
-dotnet_style_qualification_for_field = false:suggestion
-dotnet_style_qualification_for_property = false:suggestion
-dotnet_style_qualification_for_method = false:suggestion
-dotnet_style_qualification_for_event = false:suggestion
-
-# prefer var
-csharp_style_var_for_built_in_types = true
-csharp_style_var_when_type_is_apparent = true
-csharp_style_var_elsewhere = true:suggestion
-
-# use language keywords instead of BCL types
-dotnet_style_predefined_type_for_locals_parameters_members = true:suggestion
-dotnet_style_predefined_type_for_member_access = true:suggestion
-
-# name all constant fields using PascalCase
-dotnet_naming_rule.constant_fields_should_be_pascal_case.severity = suggestion
-dotnet_naming_rule.constant_fields_should_be_pascal_case.symbols  = constant_fields
-dotnet_naming_rule.constant_fields_should_be_pascal_case.style    = pascal_case_style
-
-dotnet_naming_symbols.constant_fields.applicable_kinds   = field
-dotnet_naming_symbols.constant_fields.required_modifiers = const
-
-dotnet_naming_style.pascal_case_style.capitalization = pascal_case
-
-# private static fields should have s_ prefix
-dotnet_naming_rule.private_static_fields_should_have_prefix.severity = suggestion
-dotnet_naming_rule.private_static_fields_should_have_prefix.symbols  = private_static_fields
-dotnet_naming_rule.private_static_fields_should_have_prefix.style    = private_static_prefix_style
-
-dotnet_naming_symbols.private_static_fields.applicable_kinds   = field
-dotnet_naming_symbols.private_static_fields.required_modifiers = static
-dotnet_naming_symbols.private_static_fields.applicable_accessibilities = private
-
-dotnet_naming_style.private_static_prefix_style.required_prefix = s_
-dotnet_naming_style.private_static_prefix_style.capitalization = camel_case
-
-# internal and private fields should be _camelCase
-dotnet_naming_rule.camel_case_for_private_internal_fields.severity = suggestion
-dotnet_naming_rule.camel_case_for_private_internal_fields.symbols  = private_internal_fields
-dotnet_naming_rule.camel_case_for_private_internal_fields.style    = camel_case_underscore_style
-
-dotnet_naming_symbols.private_internal_fields.applicable_kinds = field
-dotnet_naming_symbols.private_internal_fields.applicable_accessibilities = private, internal
-
-dotnet_naming_style.camel_case_underscore_style.required_prefix = _
-dotnet_naming_style.camel_case_underscore_style.capitalization = camel_case
-
-# use accessibility modifiers
-dotnet_style_require_accessibility_modifiers = for_non_interface_members:suggestion
-
-# Code style defaults
-dotnet_sort_system_directives_first = true
-csharp_preserve_single_line_blocks = true
-csharp_preserve_single_line_statements = false
-
-# Expression-level preferences
-dotnet_style_object_initializer = true:suggestion
-dotnet_style_collection_initializer = true:suggestion
-dotnet_style_explicit_tuple_names = true:suggestion
-dotnet_style_coalesce_expression = true:suggestion
-dotnet_style_null_propagation = true:suggestion
-
-# Expression-bodied members
-csharp_style_expression_bodied_methods = false:none
-csharp_style_expression_bodied_constructors = false:none
-csharp_style_expression_bodied_operators = false:none
-csharp_style_expression_bodied_properties = true:none
-csharp_style_expression_bodied_indexers = true:none
-csharp_style_expression_bodied_accessors = true:none
-
-# Pattern matching
-csharp_style_pattern_matching_over_is_with_cast_check = true:suggestion
-csharp_style_pattern_matching_over_as_with_null_check = true:suggestion
-csharp_style_inlined_variable_declaration = true:suggestion
-
-# Null checking preferences
-csharp_style_throw_expression = true:suggestion
-csharp_style_conditional_delegate_call = true:suggestion
-
-# Space preferences
-csharp_space_after_cast = false
-csharp_space_after_colon_in_inheritance_clause = true
-csharp_space_after_comma = true
-csharp_space_after_dot = false
-csharp_space_after_keywords_in_control_flow_statements = true
-csharp_space_after_semicolon_in_for_statement = true
-csharp_space_around_binary_operators = before_and_after
-csharp_space_around_declaration_statements = false
-csharp_space_before_colon_in_inheritance_clause = true
-csharp_space_before_comma = false
-csharp_space_before_dot = false
-csharp_space_before_open_square_brackets = false
-csharp_space_before_semicolon_in_for_statement = false
-csharp_space_between_empty_square_brackets = false
-csharp_space_between_method_call_empty_parameter_list_parentheses = false
-csharp_space_between_method_call_name_and_opening_parenthesis = false
-csharp_space_between_method_call_parameter_list_parentheses = false
-csharp_space_between_method_declaration_empty_parameter_list_parentheses = false
-csharp_space_between_method_declaration_name_and_open_parenthesis = false
-csharp_space_between_method_declaration_parameter_list_parentheses = false
-csharp_space_between_parentheses = false
-csharp_space_between_square_brackets = false
-space_within_single_line_array_initializer_braces = true
-
-#Net Analyzer
-dotnet_analyzer_diagnostic.category-Performance.severity = none #error - Uncomment when all violations are fixed.
-
-# CA1018: Mark attributes with AttributeUsageAttribute
-dotnet_diagnostic.CA1018.severity = warning
-# CA1304: Specify CultureInfo
-dotnet_diagnostic.CA1304.severity = warning
-# CA1802: Use literals where appropriate
-dotnet_diagnostic.CA1802.severity = warning
-# CA1813: Avoid unsealed attributes
-dotnet_diagnostic.CA1813.severity = warning
-# CA1815: Override equals and operator equals on value types
-dotnet_diagnostic.CA1815.severity = warning
-# CA1820: Test for empty strings using string length
-dotnet_diagnostic.CA1820.severity = warning
-# CA1821: Remove empty finalizers
-dotnet_diagnostic.CA1821.severity = warning
-# CA1822: Mark members as static
-dotnet_diagnostic.CA1822.severity = suggestion
-dotnet_code_quality.CA1822.api_surface = private, internal
-# CA1823: Avoid unused private fields
-dotnet_diagnostic.CA1823.severity = warning
-# CA1825: Avoid zero-length array allocations
-dotnet_diagnostic.CA1825.severity = warning
-# CA1826: Use property instead of Linq Enumerable method
-dotnet_diagnostic.CA1826.severity = suggestion
-# CA1827: Do not use Count/LongCount when Any can be used
-dotnet_diagnostic.CA1827.severity = warning
-# CA1828: Do not use CountAsync/LongCountAsync when AnyAsync can be used
-dotnet_diagnostic.CA1828.severity = warning
-# CA1829: Use Length/Count property instead of Enumerable.Count method
-dotnet_diagnostic.CA1829.severity = warning
-#CA1847: Use string.Contains(char) instead of string.Contains(string) with single characters
-dotnet_diagnostic.CA1847.severity = warning
-# CA1851: Possible multiple enumerations of IEnumerable collection
-dotnet_diagnostic.CA1851.severity = warning
-#CA1854: Prefer the IDictionary.TryGetValue(TKey, out TValue) method
-dotnet_diagnostic.CA1854.severity = warning
-#CA2211:Non-constant fields should not be visible
-dotnet_diagnostic.CA2211.severity = warning
-
-# Wrapping preferences
-csharp_wrap_before_ternary_opsigns = false
-
-# Avalonia DevAnalyzer preferences
-dotnet_diagnostic.AVADEV2001.severity = warning
-
-# Avalonia PublicAnalyzer preferences
-dotnet_diagnostic.AVP1000.severity = warning
-dotnet_diagnostic.AVP1001.severity = warning
-dotnet_diagnostic.AVP1002.severity = warning
-dotnet_diagnostic.AVP1010.severity = warning
-dotnet_diagnostic.AVP1011.severity = warning
-dotnet_diagnostic.AVP1012.severity = warning
-dotnet_diagnostic.AVP1013.severity = warning
-dotnet_diagnostic.AVP1020.severity = warning
-dotnet_diagnostic.AVP1021.severity = warning
-dotnet_diagnostic.AVP1022.severity = warning
-dotnet_diagnostic.AVP1030.severity = warning
-dotnet_diagnostic.AVP1031.severity = warning
-dotnet_diagnostic.AVP1032.severity = warning
-dotnet_diagnostic.AVP1040.severity = warning
-dotnet_diagnostic.AVA2001.severity = warning
-
-# Xaml files
-[*.{xaml,axaml}]
-indent_size = 2
-# DuplicateSetterError
-avalonia_xaml_diagnostic.AVLN2203.severity = warning
-# StyleInMergedDictionaries
-avalonia_xaml_diagnostic.AVLN2204.severity = warning
-# RequiredTemplatePartMissing
-avalonia_xaml_diagnostic.AVLN2205.severity = warning
-# OptionalTemplatePartMissing
-avalonia_xaml_diagnostic.AVLN2206.severity = info
-# TemplatePartWrongType
-avalonia_xaml_diagnostic.AVLN2207.severity = warning
-# ItemContainerInsideTemplate
-avalonia_xaml_diagnostic.AVLN2208.severity = warning
-# Obsolete
-avalonia_xaml_diagnostic.AVLN5001.severity = warning
-
-# Xml project files
-[*.{csproj,vcxproj,vcxproj.filters,proj,nativeproj,locproj}]
-indent_size = 2
-
-# Xml build files
-[*.builds]
-indent_size = 2
-
-# Xml files
-[*.{xml,stylecop,resx,ruleset}]
-indent_size = 2
-
-# Xml config files
-[*.{props,targets,config,nuspec}]
-indent_size = 2
-
-[*.json]
-indent_size = 2
-
-# Shell scripts
-[*.sh]
-end_of_line = lf
-[*.{cmd,bat}]
-end_of_line = crlf

.github/workflows/pack-nightly.yml

@@ -6,7 +6,7 @@ on:
       Version_Prefix:
         description: 'Version Prefix'
         required: true
-        default: '11.2.999'
+        default: '12.0.999'
         type: string
       Semi_Avalonia:
         description: 'Pack Semi.Avalonia'

.github/workflows/pack.yml

@@ -40,6 +40,7 @@ on:
       Semi_Avalonia_TreeDataGrid:
         type: boolean
         default: true
+    secrets: {}
 
 jobs:
   Pack_to_NuGet:

.github/workflows/release-tag.yml

@@ -33,6 +33,7 @@ jobs:
       Semi_Avalonia_ColorPicker: ${{ inputs.Semi_Avalonia_ColorPicker }}
       Semi_Avalonia_DataGrid: ${{ inputs.Semi_Avalonia_DataGrid }}
       Semi_Avalonia_TreeDataGrid: ${{ inputs.Semi_Avalonia_TreeDataGrid }}
+    secrets: inherit
 
   publish:
     uses: ./.github/workflows/publish.yml

demo/Semi.Avalonia.Demo/Pages/NavigationPageDemo.axaml

@@ -12,7 +12,7 @@
             <ScrollViewer DockPanel.Dock="Right" Width="260">
                 <StackPanel Margin="12" Spacing="8">
                     <TextBlock Text="Configuration" FontWeight="SemiBold" FontSize="16" />
-                    <TextBlock Text="Navigation" FontWeight="SemiBold" FontSize="13" />
+                    <TextBlock Text="Navigation" FontWeight="SemiBold" FontSize="14" />
 
                     <Button Content="Push Page"
                             HorizontalAlignment="Stretch"
@@ -26,6 +26,20 @@
 
                     <Separator />
 
+                    <TextBlock Text="Modal Actions" FontWeight="SemiBold" FontSize="14" />
+                    <Button Name="PushModalButton"
+                            Content="Push Modal"
+                            HorizontalAlignment="Stretch"
+                            Click="OnPushModal" />
+                    <Button Name="PopModalButton"
+                            Content="Pop Modal"
+                            HorizontalAlignment="Stretch"
+                            Click="OnPopModal" />
+                    <Button Name="PopAllModalsButton"
+                            Content="Pop All Modals"
+                            HorizontalAlignment="Stretch"
+                            Click="OnPopAllModals" />
+
                     <TextBlock Text="Options" FontWeight="SemiBold" FontSize="14" />
 
                     <CheckBox Name="HasNavBarCheck"
@@ -34,21 +48,39 @@
                               IsCheckedChanged="OnHasNavBarChanged" />
                     <CheckBox Name="HasBackButtonCheck"
                               Content="Has Back Button"
-                              IsChecked="True" 
+                              IsChecked="True"
-                              IsCheckedChanged="OnHasBackButonChanged" />
+                              IsCheckedChanged="OnHasBackButtonChanged" />
+                    <CheckBox Name="HasShadowCheck"
+                              Content="Has Shadow"
+                              IsChecked="True"
+                              IsCheckedChanged="OnHasShadowChanged" />
+                    <CheckBox Name="large" Content="Large" />
+
+                    <Separator />
+
+                    <TextBlock Text="Modal Transition" FontWeight="SemiBold" FontSize="14" />
+                    <ComboBox Name="TransitionCombo"
+                              SelectedIndex="0"
+                              HorizontalAlignment="Stretch"
+                              SelectionChanged="OnTransitionChanged">
+                        <ComboBoxItem Content="Slide from Bottom" />
+                        <ComboBoxItem Content="CrossFade" />
+                        <ComboBoxItem Content="None" />
+                    </ComboBox>
 
                     <Separator />
 
                     <TextBlock Text="Status" FontWeight="SemiBold" FontSize="14" />
                     <TextBlock Name="StatusText"
                                Text="Depth: 1"
-                               Opacity="0.7"
                                TextWrapping="Wrap" />
                     <TextBlock Name="HeaderText"
                                Text="Current: Home"
-                               Opacity="0.7"
                                TextWrapping="Wrap" />
-                    <ToggleSwitch Content="Large" Name="large" />
+                    <TextBlock Name="ModalText"
+                               Text="Modals: 0"
+                               TextWrapping="Wrap" />
+
                 </StackPanel>
             </ScrollViewer>
 
@@ -59,8 +91,8 @@
                     BorderThickness="1"
                     CornerRadius="6"
                     ClipToBounds="True">
-                <NavigationPage 
+                <NavigationPage
-                    Name="DemoNav" 
+                    Name="DemoNav"
                     Classes.Large="{Binding #large.IsChecked}" />
             </Border>
         </DockPanel>

demo/Semi.Avalonia.Demo/Pages/NavigationPageDemo.axaml.cs

@@ -1,3 +1,5 @@
+using System;
+using Avalonia.Animation;
 using Avalonia.Controls;
 using Avalonia.Interactivity;
 
@@ -6,6 +8,7 @@ namespace Semi.Avalonia.Demo.Pages;
 public partial class NavigationPageDemo : UserControl
 {
     private int _pageCount;
+    private int _modalCount;
 
     public NavigationPageDemo()
     {
@@ -15,7 +18,7 @@ public partial class NavigationPageDemo : UserControl
 
     private async void OnLoaded(object? sender, RoutedEventArgs e)
     {
-        await DemoNav.PushAsync(NavigationDemoHelper.MakePage("Home", "Welcome!\nUse the buttons to push and pop pages.", 0), null);
+        await DemoNav.PushAsync(NavigationDemoHelper.MakePage("Home", "Welcome!\nUse the buttons to push and pop pages/modals.", 0), null);
         UpdateStatus();
     }
 
@@ -42,6 +45,27 @@ public partial class NavigationPageDemo : UserControl
         UpdateStatus();
     }
 
+    private async void OnPushModal(object? sender, RoutedEventArgs e)
+    {
+        _modalCount++;
+        var modal = NavigationDemoHelper.MakePage($"Modal {_modalCount}", "This page was presented modally.\nTap 'Pop Modal' to dismiss.", _modalCount);
+        await DemoNav.PushModalAsync(modal);
+        UpdateStatus();
+    }
+
+    private async void OnPopModal(object? sender, RoutedEventArgs e)
+    {
+        await DemoNav.PopModalAsync();
+        UpdateStatus();
+    }
+
+    private async void OnPopAllModals(object? sender, RoutedEventArgs e)
+    {
+        await DemoNav.PopAllModalsAsync();
+        _modalCount = 0;
+        UpdateStatus();
+    }
+
     private void OnHasNavBarChanged(object? sender, RoutedEventArgs e)
     {
         if (DemoNav == null)
@@ -50,7 +74,7 @@ public partial class NavigationPageDemo : UserControl
             NavigationPage.SetHasNavigationBar(DemoNav.CurrentPage, HasNavBarCheck.IsChecked == true);
     }
 
-    private void OnHasBackButonChanged(object? sender, RoutedEventArgs e)
+    private void OnHasBackButtonChanged(object? sender, RoutedEventArgs e)
     {
         if (DemoNav == null)
             return;
@@ -58,9 +82,30 @@ public partial class NavigationPageDemo : UserControl
             NavigationPage.SetHasBackButton(DemoNav.CurrentPage, HasBackButtonCheck.IsChecked == true);
     }
 
+    private void OnHasShadowChanged(object? sender, RoutedEventArgs e)
+    {
+        if (DemoNav == null)
+            return;
+        if (DemoNav.CurrentPage != null)
+            DemoNav.HasShadow = HasShadowCheck.IsChecked == true;
+    }
+
+    private void OnTransitionChanged(object? sender, SelectionChangedEventArgs e)
+    {
+        if (DemoNav == null)
+            return;
+        DemoNav.ModalTransition = TransitionCombo.SelectedIndex switch
+        {
+            1 => new CrossFade(TimeSpan.FromMilliseconds(250)),
+            2 => null,
+            _ => new PageSlide(TimeSpan.FromMilliseconds(300), PageSlide.SlideAxis.Vertical)
+        };
+    }
+
     private void UpdateStatus()
     {
         StatusText.Text = $"Depth: {DemoNav.StackDepth}";
         HeaderText.Text = $"Current: {DemoNav.CurrentPage?.Header ?? "(none)"}";
+        ModalText.Text = $"Modals: {DemoNav.ModalStack.Count}";
     }
 }

demo/Semi.Avalonia.Demo/Pages/TabbedPageDemo.axaml

@@ -50,7 +50,7 @@
             <TabbedPage Name="DemoTabs"
                         TabPlacement="Top"
                         SelectionChanged="OnSelectionChanged">
-                <ContentPage Header="Home">
+                <ContentPage Icon="{DynamicResource SemiIconHome}" Header="Home">
                     <StackPanel Margin="16" Spacing="8">
                         <TextBlock Text="Home Tab" FontSize="24" FontWeight="Bold" />
                         <TextBlock Text="Welcome to the Home tab. This is a TabbedPage sample."
@@ -59,14 +59,14 @@
                                    TextWrapping="Wrap" Opacity="0.7" />
                     </StackPanel>
                 </ContentPage>
-                <ContentPage Header="Search">
+                <ContentPage Icon="{DynamicResource SemiIconSearch}" Header="Search">
                     <StackPanel Margin="16" Spacing="8">
                         <TextBlock Text="Search Tab" FontSize="24" FontWeight="Bold" />
                         <TextBox PlaceholderText="Type to search..." />
                         <TextBlock Text="Search results will appear here." Opacity="0.7" />
                     </StackPanel>
                 </ContentPage>
-                <ContentPage Header="Settings">
+                <ContentPage Icon="{DynamicResource SemiIconSetting}" Header="Settings">
                     <StackPanel Margin="16" Spacing="8">
                         <TextBlock Text="Settings Tab" FontSize="24" FontWeight="Bold" />
                         <CheckBox Content="Enable notifications" />

src/Semi.Avalonia/Controls/NavigationPage.axaml

@@ -8,6 +8,26 @@
     <ControlTheme x:Key="{x:Type NavigationPage}" TargetType="NavigationPage">
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="BarHeight" Value="{DynamicResource NavigationPageBarMinHeight}" />
+        <Setter Property="PageTransition">
+            <PageSlide Duration="0:0:0.3" Orientation="Horizontal" FillMode="Forward">
+                <PageSlide.SlideInEasing>
+                    <SplineEasing X1="0.16" Y1="1" X2="0.3" Y2="1" />
+                </PageSlide.SlideInEasing>
+                <PageSlide.SlideOutEasing>
+                    <SplineEasing X1="0.2" Y1="0.85" X2="0.3" Y2="1" />
+                </PageSlide.SlideOutEasing>
+            </PageSlide>
+        </Setter>
+        <Setter Property="ModalTransition">
+            <PageSlide Duration="0:0:0.25" Orientation="Vertical" FillMode="Forward">
+                <PageSlide.SlideInEasing>
+                    <SplineEasing X1="0.16" Y1="1" X2="0.3" Y2="1" />
+                </PageSlide.SlideInEasing>
+                <PageSlide.SlideOutEasing>
+                    <SplineEasing X1="0.2" Y1="0.85" X2="0.3" Y2="1" />
+                </PageSlide.SlideOutEasing>
+            </PageSlide>
+        </Setter>
         <Setter Property="Template">
             <ControlTemplate TargetType="NavigationPage">
                 <Panel ClipToBounds="True">
@@ -115,7 +135,7 @@
         <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>

src/Semi.Avalonia/Controls/TabItem.axaml

@@ -31,7 +31,6 @@
                     <DockPanel HorizontalSpacing="{DynamicResource TabItemIconHeaderSpacing}">
                         <ContentPresenter
                             Name="PART_IconPresenter"
-                            DockPanel.Dock="Left"
                             Content="{TemplateBinding Icon}"
                             ContentTemplate="{TemplateBinding IconTemplate}"
                             IsVisible="{Binding $self.Content, Converter={x:Static ObjectConverters.IsNotNull}}">
@@ -61,6 +60,10 @@
             <Setter Property="RecognizesAccessKey" Value="True" />
         </Style>
 
+        <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
+            <Setter Property="DockPanel.Dock" Value="Left" />
+        </Style>
+
         <Style Selector="^:selected">
             <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
                 <Setter Property="FontWeight" Value="{DynamicResource TabItemSelectedFontWeight}" />

src/Semi.Avalonia/Controls/TabbedPage.axaml

@@ -2,7 +2,11 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <Design.PreviewWith>
-        <TabbedPage Width="400" Height="300" />
+        <TabbedPage Width="400" Height="800" TabPlacement="Bottom">
+            <ContentPage Icon="{DynamicResource SemiIconHome}" Header="Home" />
+            <ContentPage Icon="{DynamicResource SemiIconSearch}" Header="Search" />
+            <ContentPage Icon="{DynamicResource SemiIconSetting}" Header="Settings" />
+        </TabbedPage>
     </Design.PreviewWith>
 
     <ControlTheme x:Key="{x:Type TabbedPage}" TargetType="TabbedPage">
@@ -11,27 +15,91 @@
                 <TabControl
                     Name="PART_TabControl"
                     Background="{TemplateBinding Background}"
-                    Theme="{StaticResource LineTabControl}" />
+                    Theme="{StaticResource LineTabControl}">
+                    <TabControl.ItemContainerTheme>
+                        <ControlTheme
+                            BasedOn="{StaticResource LineTabItem}"
+                            TargetType="TabItem">
+                            <Style Selector="^[TabStripPlacement=Top], ^[TabStripPlacement=Bottom]">
+                                <Setter Property="TabItem.Margin" Value="0" />
+                                <Setter Property="TabItem.HorizontalContentAlignment" Value="Center" />
+                                <Setter Property="TabItem.VerticalContentAlignment" Value="Center" />
+                                <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
+                                    <Setter Property="DockPanel.Dock" Value="Top" />
+                                </Style>
+                            </Style>
+                        </ControlTheme>
+                    </TabControl.ItemContainerTheme>
+                    <TabControl.ItemsPanel>
+                        <ItemsPanelTemplate>
+                            <UniformGrid Columns="{Binding $parent[TabControl].ItemCount}" />
+                        </ItemsPanelTemplate>
+                    </TabControl.ItemsPanel>
+                </TabControl>
             </ControlTemplate>
         </Setter>
     </ControlTheme>
+
     <ControlTheme x:Key="CardTabbedPage" TargetType="TabbedPage">
         <Setter Property="Template">
             <ControlTemplate TargetType="TabbedPage">
                 <TabControl
                     Name="PART_TabControl"
                     Background="{TemplateBinding Background}"
-                    Theme="{StaticResource CardTabControl}" />
+                    Theme="{StaticResource CardTabControl}">
+                    <TabControl.ItemContainerTheme>
+                        <ControlTheme
+                            BasedOn="{StaticResource CardTabItem}"
+                            TargetType="TabItem">
+                            <Style Selector="^[TabStripPlacement=Top], ^[TabStripPlacement=Bottom]">
+                                <Setter Property="TabItem.Padding" Value="8" />
+                                <Setter Property="TabItem.Margin" Value="0" />
+                                <Setter Property="TabItem.HorizontalContentAlignment" Value="Center" />
+                                <Setter Property="TabItem.VerticalContentAlignment" Value="Center" />
+                                <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
+                                    <Setter Property="DockPanel.Dock" Value="Top" />
+                                </Style>
+                            </Style>
+                        </ControlTheme>
+                    </TabControl.ItemContainerTheme>
+                    <TabControl.ItemsPanel>
+                        <ItemsPanelTemplate>
+                            <UniformGrid Columns="{Binding $parent[TabControl].ItemCount}" />
+                        </ItemsPanelTemplate>
+                    </TabControl.ItemsPanel>
+                </TabControl>
             </ControlTemplate>
         </Setter>
     </ControlTheme>
+
     <ControlTheme x:Key="ButtonTabbedPage" TargetType="TabbedPage">
         <Setter Property="Template">
             <ControlTemplate TargetType="TabbedPage">
                 <TabControl
                     Name="PART_TabControl"
                     Background="{TemplateBinding Background}"
-                    Theme="{StaticResource ButtonTabControl}" />
+                    Theme="{StaticResource ButtonTabControl}">
+                    <TabControl.ItemContainerTheme>
+                        <ControlTheme
+                            BasedOn="{StaticResource ButtonTabItem}"
+                            TargetType="TabItem">
+                            <Style Selector="^[TabStripPlacement=Top], ^[TabStripPlacement=Bottom]">
+                                <Setter Property="TabItem.Padding" Value="12" />
+                                <Setter Property="TabItem.Margin" Value="0" />
+                                <Setter Property="TabItem.HorizontalContentAlignment" Value="Center" />
+                                <Setter Property="TabItem.VerticalContentAlignment" Value="Center" />
+                                <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
+                                    <Setter Property="DockPanel.Dock" Value="Top" />
+                                </Style>
+                            </Style>
+                        </ControlTheme>
+                    </TabControl.ItemContainerTheme>
+                    <TabControl.ItemsPanel>
+                        <ItemsPanelTemplate>
+                            <UniformGrid Columns="{Binding $parent[TabControl].ItemCount}" />
+                        </ItemsPanelTemplate>
+                    </TabControl.ItemsPanel>
+                </TabControl>
             </ControlTemplate>
         </Setter>
     </ControlTheme>