From 4d24b43280cbf784a0c64d34657ac402c67f2305 Mon Sep 17 00:00:00 2001
From: TheXamlGuy <dan_clark@outlook.com>
Date: Sun, 6 Oct 2024 21:36:44 +0100
Subject: [PATCH] Tweak TaskDialog

---
 .../TaskDialog/TaskDialog.axaml               | 395 ++++++++++++++++++
 .../Themes/ControlResources.axaml             |   4 +-
 2 files changed, 397 insertions(+), 2 deletions(-)
 create mode 100644 Toolkit.UI.Controls.Avalonia/TaskDialog/TaskDialog.axaml

diff --git a/Toolkit.UI.Controls.Avalonia/TaskDialog/TaskDialog.axaml b/Toolkit.UI.Controls.Avalonia/TaskDialog/TaskDialog.axaml
new file mode 100644
index 0000000..f6e97e2
--- /dev/null
+++ b/Toolkit.UI.Controls.Avalonia/TaskDialog/TaskDialog.axaml
@@ -0,0 +1,395 @@
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:core="using:FluentAvalonia.Core"
+    xmlns:ui="using:FluentAvalonia.UI.Controls"
+    xmlns:uip="using:FluentAvalonia.UI.Controls.Primitives"
+    x:CompileBindings="True">
+    <Design.PreviewWith>
+        <Border
+            Width="600"
+            Height="530"
+            Padding="20"
+            Background="#CDCDCD">
+            <Border BorderBrush="#35EFEFEF" BorderThickness="1">
+                <ui:TaskDialog
+                    core:VisualStateHelper.ForcedClassesProperty=":open,:progressSuspend:hosted"
+                    Content="Dialog Content goes here"
+                    FooterVisibility="Auto"
+                    Header="Dialog Heading"
+                    IconSource="SaveFilled"
+                    IsVisible="True"
+                    ShowProgressBar="True"
+                    SubHeader="Dialog SubHeader">
+                    <ui:TaskDialog.Buttons>
+                        <ui:TaskDialogButton
+                            IconSource="Checkmark"
+                            IsDefault="True"
+                            Text="OK" />
+                        <ui:TaskDialogButton
+                            IconSource="Dismiss"
+                            IsEnabled="False"
+                            Text="Cancel" />
+                    </ui:TaskDialog.Buttons>
+
+                    <ui:TaskDialog.Commands>
+                        <ui:TaskDialogCommand
+                            Description="A bigger description goes here"
+                            IconSource="Map"
+                            Text="Text here" />
+                        <ui:TaskDialogCommand
+                            Description="A bigger description goes here"
+                            IsEnabled="False"
+                            Text="Text here" />
+                        <ui:TaskDialogCommand Text="Text here" />
+                        <ui:TaskDialogCheckBox Text="CheckBox" />
+                        <ui:TaskDialogRadioButton Text="RadioButton" />
+                    </ui:TaskDialog.Commands>
+
+                    <ui:TaskDialog.Footer>
+                        <CheckBox Content="Never show me this again" />
+                    </ui:TaskDialog.Footer>
+                </ui:TaskDialog>
+            </Border>
+        </Border>
+    </Design.PreviewWith>
+
+    <x:Double x:Key="TaskDialogMinWidth">320</x:Double>
+    <x:Double x:Key="TaskDialogMaxWidth">648</x:Double>
+    <x:Double x:Key="TaskDialogMinHeight">184</x:Double>
+    <x:Double x:Key="TaskDialogMaxHeight">800</x:Double>
+
+    <x:String x:Key="TaskDialogFooterButtonNormalText">More Details</x:String>
+    <x:String x:Key="TaskDialogFooterButtonExpandedText">Less Details</x:String>
+
+    <Thickness x:Key="TaskDialogIconMargin">12</Thickness>
+    <Thickness x:Key="TaskDialogHeaderPadding">60 0 24 12</Thickness>
+    <Thickness x:Key="TaskDialogHeaderPaddingNoIcon">24 0 24 12</Thickness>
+    <Thickness x:Key="TaskDialogSubHeaderPadding">18 4</Thickness>
+    <x:Double x:Key="TaskDialogIconSize">36</x:Double>
+    <Thickness x:Key="TaskDialogContentMargin">24 0 24 0</Thickness>
+    <Thickness x:Key="TaskDialogButtonHostMargin">18</Thickness>
+
+    <FontWeight x:Key="TaskDialogHeaderFontWeight">SemiBold</FontWeight>
+    <x:Double x:Key="TaskDialogHeaderFontSize">20</x:Double>
+    <FontWeight x:Key="TaskDialogSubHeaderFontWeight">Normal</FontWeight>
+    <x:Double x:Key="TaskDialogSubHeaderFontSize">16</x:Double>
+
+    <ControlTheme x:Key="TaskDialogMoreDetailsButton" TargetType="Button">
+        <Setter Property="Foreground" Value="{DynamicResource TaskDialogFooterButtonForeground}" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border Background="Transparent">
+                    <TextBlock Text="{TemplateBinding Content}" />
+                </Border>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^ /template/ TextBlock">
+            <Setter Property="Foreground" Value="{DynamicResource TaskDialogFooterButtonForegroundPointerOver}" />
+        </Style>
+        <Style Selector="^ /template/ TextBlock">
+            <Setter Property="Foreground" Value="{DynamicResource TaskDialogFooterButtonForegroundPressed}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme x:Key="{x:Type ui:TaskDialog}" TargetType="ui:TaskDialog">
+        <Setter Property="Background" Value="{DynamicResource ContentDialogBackground}" />
+        <Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Panel Name="LayoutRoot" Background="{x:Null}">
+                    <Border
+                        Name="ContentRoot"
+                        MinWidth="{DynamicResource TaskDialogMinWidth}"
+                        MinHeight="{DynamicResource TaskDialogMinHeight}"
+                        MaxWidth="{DynamicResource TaskDialogMaxWidth}"
+                        MaxHeight="{DynamicResource TaskDialogMaxHeight}"
+                        HorizontalAlignment="Stretch"
+                        VerticalAlignment="Stretch"
+                        Background="{TemplateBinding Background}"
+                        BackgroundSizing="{TemplateBinding BackgroundSizing}">
+                        <Grid RowDefinitions="Auto,Auto,*,Auto">
+                            <Panel
+                                Name="HeaderHost"
+                                Grid.Row="0"
+                                Background="{TemplateBinding HeaderBackground}"
+                                IsVisible="False">
+                                <Viewbox
+                                    Name="IconHost"
+                                    Width="{StaticResource TaskDialogIconSize}"
+                                    Height="{StaticResource TaskDialogIconSize}"
+                                    Margin="{DynamicResource TaskDialogIconMargin}"
+                                    HorizontalAlignment="Left"
+                                    VerticalAlignment="Center"
+                                    IsVisible="False">
+                                    <ui:IconSourceElement Name="IconElement" IconSource="{TemplateBinding IconSource}" />
+                                </Viewbox>
+                                <TextBlock
+                                    Name="HeaderText"
+                                    Margin="{DynamicResource TaskDialogHeaderPadding}"
+                                    HorizontalAlignment="Left"
+                                    VerticalAlignment="Center"
+                                    FontSize="{DynamicResource TaskDialogHeaderFontSize}"
+                                    FontWeight="{StaticResource TaskDialogHeaderFontWeight}"
+                                    IsVisible="False"
+                                    Text="{TemplateBinding Header}"
+                                    TextWrapping="Wrap" />
+
+                            </Panel>
+
+                            <TextBlock
+                                Name="SubHeaderText"
+                                Grid.Row="1"
+                                Margin="{DynamicResource TaskDialogSubHeaderPadding}"
+                                HorizontalAlignment="Left"
+                                VerticalAlignment="Center"
+                                FontSize="{StaticResource TaskDialogSubHeaderFontSize}"
+                                FontWeight="{StaticResource TaskDialogSubHeaderFontWeight}"
+                                IsVisible="False"
+                                Text="{TemplateBinding SubHeader}"
+                                TextWrapping="Wrap" />
+
+                            <ScrollViewer
+                                Grid.Row="2"
+                                Margin="{StaticResource TaskDialogContentMargin}"
+                                HorizontalScrollBarVisibility="Disabled"
+                                VerticalScrollBarVisibility="Auto">
+                                <StackPanel Spacing="18">
+                                    <ContentPresenter
+                                        Name="ContentPresenter"
+                                        Grid.Row="2"
+                                        HorizontalAlignment="Stretch"
+                                        VerticalAlignment="Stretch"
+                                        HorizontalContentAlignment="Stretch"
+                                        VerticalContentAlignment="Stretch"
+                                        Content="{TemplateBinding Content}"
+                                        ContentTemplate="{TemplateBinding ContentTemplate}">
+                                        <ContentPresenter.Styles>
+                                            <Style Selector="TextBlock">
+                                                <Setter Property="TextWrapping" Value="Wrap" />
+                                            </Style>
+                                        </ContentPresenter.Styles>
+                                    </ContentPresenter>
+                                    <ProgressBar
+                                        Name="ProgressBar"
+                                        Grid.Row="3"
+                                        IsVisible="False" />
+                                    <ItemsControl
+                                        Name="CommandsHost"
+                                        Grid.Row="4"
+                                        IsVisible="False">
+                                        <ItemsControl.ItemsPanel>
+                                            <ItemsPanelTemplate>
+                                                <StackPanel Spacing="2" />
+                                            </ItemsPanelTemplate>
+                                        </ItemsControl.ItemsPanel>
+                                    </ItemsControl>
+                                    <StackPanel
+                                        Name="MoreDetailsPanel"
+                                        Grid.Row="5"
+                                        IsVisible="False">
+                                        <Button
+                                            Name="MoreDetailsButton"
+                                            Classes="TaskDialog_MoreDetails"
+                                            Content="{StaticResource TaskDialogFooterButtonNormalText}"
+                                            IsVisible="False"
+                                            Theme="{StaticResource TaskDialogMoreDetailsButton}" />
+                                        <ContentPresenter
+                                            Name="FooterHost"
+                                            HorizontalAlignment="Stretch"
+                                            VerticalAlignment="Top"
+                                            HorizontalContentAlignment="Stretch"
+                                            VerticalContentAlignment="Top"
+                                            Content="{TemplateBinding Footer}"
+                                            ContentTemplate="{TemplateBinding FooterTemplate}"
+                                            IsVisible="False" />
+                                    </StackPanel>
+                                </StackPanel>
+                            </ScrollViewer>
+                            <Border
+                                Name="ButtonBorder"
+                                Grid.Row="3"
+                                Padding="{StaticResource TaskDialogButtonHostMargin}"
+                                Background="{DynamicResource TaskDialogButtonAreaBackground}">
+                                <ItemsControl Name="ButtonsHost" KeyboardNavigation.TabNavigation="Continue">
+                                    <ItemsControl.ItemsPanel>
+                                        <ItemsPanelTemplate>
+                                            <uip:TaskDialogButtonsPanel Spacing="8" />
+                                        </ItemsPanelTemplate>
+                                    </ItemsControl.ItemsPanel>
+                                </ItemsControl>
+                            </Border>
+                        </Grid>
+                    </Border>
+                </Panel>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^:hidden:not(:hosted) /template/ Panel#LayoutRoot">
+            <Setter Property="IsVisible" Value="False" />
+        </Style>
+        <Style Selector="^:open:not(:hosted) /template/ Panel#LayoutRoot">
+            <Setter Property="IsVisible" Value="True" />
+        </Style>
+
+        <Style Selector="^:header">
+            <Style Selector="^ /template/ Panel#HeaderHost">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+            <Style Selector="^ /template/ TextBlock#HeaderText">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+            <Style Selector="^:not(:icon) /template/ TextBlock#HeaderText">
+                <Setter Property="Margin" Value="{DynamicResource TaskDialogHeaderPaddingNoIcon}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:subheader /template/ TextBlock#SubHeaderText">
+            <Setter Property="IsVisible" Value="True" />
+        </Style>
+
+        <Style Selector="^:icon">
+            <Style Selector="^ /template/ DockPanel#SubHeaderRoot">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+
+            <Style Selector="^ /template/ Viewbox#IconHost">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+            <Style Selector="^ /template/ Panel#HeaderHost">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+        </Style>
+
+        <!--<Style Selector="^:footerAuto">
+            <Style Selector="^ /template/ Button#MoreDetailsButton">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+
+            <Style Selector="^:expanded /template/ Button#MoreDetailsButton">
+                <Setter Property="Content" Value="{StaticResource TaskDialogFooterButtonExpandedText}" />
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+        </Style>
+        <Style Selector="^:footer">
+            <Style Selector="^:expanded /template/ ContentPresenter#FooterHost">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+            <Style Selector="^ /template/ StackPanel#MoreDetailsPanel">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+        </Style>-->
+
+        <!--<Style Selector="^:progress /template/ ProgressBar#ProgressBar">
+            <Setter Property="IsVisible" Value="True" />
+        </Style>
+
+        <Style Selector="^:progressError /template/ ProgressBar#ProgressBar">
+            <Setter Property="Foreground" Value="{DynamicResource TaskDialogProgressBarErrorColor}" />
+            <Setter Property="Background" Value="{DynamicResource TaskDialogProgressBarErrorBackgroundColor}" />
+        </Style>
+
+        <Style Selector="^:progressSuspend /template/ ProgressBar#ProgressBar">
+            <Setter Property="Foreground" Value="{DynamicResource TaskDialogProgressBarSuspendColor}" />
+            <Setter Property="Background" Value="{DynamicResource TaskDialogProgressBarSuspendBackgroundColor}" />
+        </Style>
+
+        <Style Selector="^:headerForeground /template/ TextBlock#HeaderText">
+            <Setter Property="Foreground" Value="{Binding $parent[ui:TaskDialog].HeaderForeground}" />
+        </Style>-->
+
+        <Style Selector="^:iconForeground /template/ ui|IconSourceElement#IconElement">
+            <Setter Property="Foreground" Value="{Binding $parent[ui:TaskDialog].IconForeground}" />
+        </Style>
+
+
+        <Style Selector="^:hosted">
+            <Style Selector="^ /template/ Panel#LayoutRoot">
+                <Setter Property="Background" Value="{DynamicResource TaskDialogSmokeFill}" />
+            </Style>
+            <Style Selector="^ /template/ Border#ContentRoot">
+                <Setter Property="BorderBrush" Value="{DynamicResource TaskDialogBorderBrush}" />
+                <Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
+                <Setter Property="BorderThickness" Value="{DynamicResource TaskDialogBorderWidth}" />
+                <Setter Property="HorizontalAlignment" Value="Center" />
+                <Setter Property="VerticalAlignment" Value="Center" />
+                <Setter Property="BoxShadow" Value="0 8 32 0 #66000000" />
+            </Style>
+            <Style Selector="^ /template/ Border#HeaderRoot">
+                <Setter Property="CornerRadius" Value="{Binding Source={StaticResource OverlayCornerRadius}, Converter={StaticResource TopCornerRadiusFilterConverter}}}" />
+            </Style>
+            <Style Selector="^ /template/ Border#ButtonBorder">
+                <Setter Property="CornerRadius" Value="{Binding Source={StaticResource OverlayCornerRadius}, Converter={StaticResource BottomCornerRadiusFilterConverter}}}" />
+            </Style>
+
+
+            <Style Selector="^:hidden /template/ Panel#LayoutRoot">
+                <Style.Animations>
+                    <Animation FillMode="Forward" Duration="00:00:00.167">
+                        <KeyFrame Cue="0%">
+                            <Setter Property="Opacity" Value="1.0" />
+                        </KeyFrame>
+                        <KeyFrame Cue="100%">
+                            <Setter Property="Opacity" Value="0.0" />
+                            <Setter Property="IsVisible" Value="False" />
+                        </KeyFrame>
+                    </Animation>
+                </Style.Animations>
+            </Style>
+            <Style Selector="^:hidden /template/ Border#ContentRoot">
+                <Style.Animations>
+                    <Animation FillMode="Forward" Duration="00:00:00.167">
+                        <KeyFrame Cue="0%">
+                            <Setter Property="ScaleTransform.ScaleX" Value="1.0" />
+                            <Setter Property="ScaleTransform.ScaleY" Value="1.0" />
+                        </KeyFrame>
+                        <KeyFrame Cue="100%" KeySpline="0,0 0,1">
+                            <Setter Property="ScaleTransform.ScaleX" Value="1.05" />
+                            <Setter Property="ScaleTransform.ScaleY" Value="1.05" />
+                        </KeyFrame>
+                    </Animation>
+                </Style.Animations>
+            </Style>
+
+            <!--  Handle open dialog  -->
+            <Style Selector="^:open /template/ Panel#LayoutRoot">
+                <Setter Property="IsVisible" Value="True" />
+                <Style.Animations>
+                    <!--
+                        Animation applies with priority of LocalValue
+                        To overrule the IsVisible=False in :hidden, set
+                        IsVisible=True in BOTH KeyFrames here
+                    -->
+                    <Animation FillMode="Forward" Duration="00:00:00.250">
+                        <KeyFrame Cue="0%">
+                            <Setter Property="IsVisible" Value="True" />
+                            <Setter Property="Opacity" Value="0.0" />
+                        </KeyFrame>
+                        <KeyFrame Cue="100%">
+                            <Setter Property="IsVisible" Value="True" />
+                            <Setter Property="Opacity" Value="1.0" />
+                        </KeyFrame>
+                    </Animation>
+                </Style.Animations>
+            </Style>
+            <Style Selector="^:open /template/ Border#ContentRoot">
+                <Style.Animations>
+                    <Animation FillMode="Forward" Duration="00:00:00.250">
+                        <KeyFrame Cue="0%">
+                            <Setter Property="ScaleTransform.ScaleX" Value="1.05" />
+                            <Setter Property="ScaleTransform.ScaleY" Value="1.05" />
+                        </KeyFrame>
+                        <KeyFrame Cue="100%" KeySpline="0,0 0,1">
+                            <Setter Property="ScaleTransform.ScaleX" Value="1.00" />
+                            <Setter Property="ScaleTransform.ScaleY" Value="1.00" />
+                        </KeyFrame>
+                    </Animation>
+                </Style.Animations>
+            </Style>
+
+        </Style>
+
+    </ControlTheme>
+
+</ResourceDictionary>
diff --git a/Toolkit.UI.Controls.Avalonia/Themes/ControlResources.axaml b/Toolkit.UI.Controls.Avalonia/Themes/ControlResources.axaml
index cfa360a..b569b2c 100644
--- a/Toolkit.UI.Controls.Avalonia/Themes/ControlResources.axaml
+++ b/Toolkit.UI.Controls.Avalonia/Themes/ControlResources.axaml
@@ -2,8 +2,6 @@
     <Styles.Resources>
         <ResourceDictionary>
             <FontFamily x:Key="FluentThemeFontFamily">/Fonts/#FluentSystemIcons-Resizable</FontFamily>
-			<Thickness x:Key="TaskDialogHeaderPadding">60 0 12 9</Thickness>
-			<Thickness x:Key="TaskDialogHeaderPaddingNoIcon">18 0 12 9</Thickness>
             <ControlTheme x:Key="TextBoxButtonStyle" TargetType="Button">
                 <Setter Property="Foreground" Value="{DynamicResource TextControlButtonForeground}" />
                 <Setter Property="Background" Value="Transparent" />
@@ -73,6 +71,8 @@
                 <MergeResourceInclude Source="../TabStrip/TabStrip.axaml" />
                 <MergeResourceInclude Source="../ImageCropper/ImageCropper.axaml" />
                 <MergeResourceInclude Source="../ContentCard/ContentCard.axaml" />
+                <MergeResourceInclude Source="../TaskDialog/TaskDialog.axaml" />
+
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Styles.Resources>