[UWP] [XAML] Contentdialog，如何更改按钮的样式 [英] [UWP][XAML]Contentdialog, how to change button's style
问题描述
你好，
我需要更改内容对话框样式，包括两个不同syle的按钮。
I need to change content dialog style including two buttons of different syle.
所以在app.xaml文件中我设置了内容对话框模板，在自定义contentdialog中，我在page_loaded事件中设置了两个按钮的不同背景。
So in app.xaml file i set content dialog template, and in custom contentdialog ,i set two buttons' different backgroud in page_loaded event.
运行应用程序时，自定义contentdialog很好。
When running the app,custom contentdialog is fine.
但是当自定义contentdialog是如何，然后我改变背页的大小，
But when custom contentdialog is how, then i change size of back page,
自定义contentdialog是改变了样式，两个按钮的不同背景在page_loaded事件中设置无效自定义contentdialog。
custom contentdialog is changed style, two buttons' different backgroud is invalid setted in page_loaded event of custom contentdialog.
自定义contentdialog的样式在app.xaml文件中更改为模板。
custom contentdialog's style is changed to template in app.xaml file.
我不知道为什么。并想知道如何此时有效按钮stlye。
I don not know why.and want to know how to valid buttons stlye at this time.
谢谢
推荐答案
Hello Little_little，
Hello Little_little,
可能之后，ContentDialog会创建按钮，因此任何在Loaded事件上更改样式的尝试都不会成功。相反，尝试在Button1Host.Resources和Button2Host.Resources中放置按钮样式，以便这些样式将自动
应用于按钮。
Probably, ContentDialog creates buttons afterwards, so any attempts to change styles on Loaded event won't succeed. Instead, try putting button styles in Button1Host.Resources and Button2Host.Resources inside the Template, so that those styles will be automatically applied to the buttons.
<Application.Resources>
<Style TargetType="Button" x:Key="primaryButtonStyle">
<Setter Property="Background" Value="Red"/>
</Style>
<Style TargetType="Button" x:Key="secondaryButtonStyle">
<Setter Property="Background" Value="Blue"/>
</Style>
<Style TargetType="ContentDialog">
<Setter Property="Foreground" Value="{ThemeResource ContentDialogForeground}" />
<Setter Property="Background" Value="{ThemeResource ContentDialogBackground}" />
<Setter Property="BorderBrush" Value="{ThemeResource ContentDialogBorderBrush}" />
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="MaxHeight" Value="{ThemeResource ContentDialogMaxHeight}" />
<Setter Property="MinHeight" Value="{ThemeResource ContentDialogMinHeight}" />
<Setter Property="MaxWidth" Value="{ThemeResource ContentDialogMaxWidth}" />
<Setter Property="MinWidth" Value="{ThemeResource ContentDialogMinWidth}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ContentDialog">
<Border x:Name="Container">
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Border x:Name="BackgroundElement"
Background="{TemplateBinding Background}"
FlowDirection="{TemplateBinding FlowDirection}"
BorderThickness="{ThemeResource ContentDialogBorderWidth}"
BorderBrush="{TemplateBinding BorderBrush}"
MaxWidth="{TemplateBinding MaxWidth}"
MaxHeight="{TemplateBinding MaxHeight}"
MinWidth="{TemplateBinding MinWidth}"
MinHeight="{TemplateBinding MinHeight}">
<Grid x:Name="DialogSpace" VerticalAlignment="Stretch" Padding="{ThemeResource ContentDialogPadding}">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ScrollViewer x:Name="ContentScrollViewer"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Disabled"
ZoomMode="Disabled"
Margin="{ThemeResource ContentDialogContentScrollViewerMargin}"
IsTabStop="False">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ContentControl x:Name="Title"
Margin="{ThemeResource ContentDialogTitleMargin}"
Content="{TemplateBinding Title}"
ContentTemplate="{TemplateBinding TitleTemplate}"
FontSize="20"
FontFamily="XamlAutoFontFamily"
FontWeight="Normal"
Foreground="{TemplateBinding Foreground}"
HorizontalAlignment="Left"
VerticalAlignment="Top"
IsTabStop="False">
<ContentControl.Template>
<ControlTemplate TargetType="ContentControl">
<ContentPresenter Content="{TemplateBinding Content}"
MaxLines="2"
TextWrapping="Wrap"
ContentTemplate="{TemplateBinding ContentTemplate}"
Margin="{TemplateBinding Padding}"
ContentTransitions="{TemplateBinding ContentTransitions}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</ControlTemplate>
</ContentControl.Template>
</ContentControl>
<ContentPresenter x:Name="Content"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
FontSize="{ThemeResource ControlContentThemeFontSize}"
FontFamily="{ThemeResource ContentControlThemeFontFamily}"
Margin="{ThemeResource ContentDialogContentMargin}"
Foreground="{TemplateBinding Foreground}"
Grid.Row="1"
TextWrapping="Wrap" />
</Grid>
</ScrollViewer>
<Grid x:Name="CommandSpace"
Grid.Row="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Border x:Name="Button1Host"
Margin="{ThemeResource ContentDialogButton1HostMargin}"
MinWidth="{ThemeResource ContentDialogButtonMinWidth}"
MinHeight="{ThemeResource ContentDialogButtonMinHeight}" >
<Border.Resources>
<Style TargetType="Button" BasedOn="{StaticResource primaryButtonStyle}"/>
</Border.Resources>
</Border>
<Border x:Name="Button2Host"
Margin="{ThemeResource ContentDialogButton2HostMargin}"
MinWidth="{ThemeResource ContentDialogButtonMinWidth}"
MinHeight="{ThemeResource ContentDialogButtonMinHeight}"
Grid.Column="1">
<Border.Resources>
<Style TargetType="Button" BasedOn="{StaticResource secondaryButtonStyle}"/>
</Border.Resources>
</Border>
</Grid>
</Grid>
</Border>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Application.Resources>
这篇关于[UWP] [XAML] Contentdialog，如何更改按钮的样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
