WPF按钮和TextBlock样式如何相关? [英] How are WPF Buttons and TextBlock styles related?

问题描述

我为默认"按钮使用了自定义样式，并且还为TextBlocks创建了自定义样式.如果我完全删除TextBlock样式，则一切正常，但是一旦出于某种原因添加了TextBlock样式，则在Button的文本默认"状态下使用Button样式.似乎这里正在进行某种继承，但是我看不到msdn文档中的什么地方.发生了什么事?

I have a custom style for my 'default' Buttons, and also created a custom style for TextBlocks. If I remove the TextBlock style entirely, everything works fine, but once the TextBlock styling is added in for some reason the Button style is used on the Button's text 'default' state. It seems like some kind of inheritance is going on here but I can't see where in the msdn docs. What's going on?

我使用的是Expression Blend 4-，另外一个奇怪的是，Blend中的预览看起来不错，但是当我运行该应用程序时，按钮样式在默认状态下是不正确的.以下是似乎冲突的样式:

I'm using Expression Blend 4-- and also another odd thing is that the preview in Blend looks fine, but when I RUN the application, the button styles are incorrect in their default state. Here's the styles which seem to be conflicting:

        <ResourceDictionary>

        <Style TargetType="{x:Type Button}">
            <Style.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="True">
                    <Setter Property="Foreground">
                        <Setter.Value>
                            <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                <GradientStop Color="White" Offset="0"/>
                                <GradientStop Color="#FFFDFF00" Offset="1"/>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
                    <Setter Property="RenderTransform">
                        <Setter.Value>
                            <TransformGroup>
                                <ScaleTransform ScaleY="1.20" ScaleX="1.20"/>
                                <SkewTransform/>
                                <RotateTransform/>
                                <TranslateTransform/>
                            </TransformGroup>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <ContentPresenter RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                                <ContentPresenter.Effect>
                                    <DropShadowEffect BlurRadius="3" ShadowDepth="4"/>
                                </ContentPresenter.Effect>
                            </ContentPresenter>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsFocused" Value="True"/>
                            <Trigger Property="IsDefaulted" Value="True"/>
                            <Trigger Property="IsMouseOver" Value="True"/>
                            <Trigger Property="IsPressed" Value="True"/>
                            <Trigger Property="IsEnabled" Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="FontFamily" Value="/Rtk;component/Fonts/#Segoe Print"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="FontSize" Value="18"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="HorizontalAlignment" Value="Center"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="Background" Value="{x:Null}"/>
        </Style>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="TextWrapping" Value="NoWrap"/>
            <Setter Property="TextTrimming" Value="None"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontSize" Value="16"/>
            <Setter Property="Effect">
                <Setter.Value>
                    <DropShadowEffect BlurRadius="3" ShadowDepth="4"/>
                </Setter.Value>
            </Setter>
            <Setter Property="FontFamily" Value="/Rtk;component/Fonts/#Segoe Print"/>
        </Style>
    </ResourceDictionary>

这是我使用Button控件本身的方式:

This is how I am using the Button control itself:

<Button Content="Button Text" FontSize="24"/>  

(请注意，此字体大小与我在默认样式中指定的大小不同，18-在此按钮的情况下，我想覆盖它)

(note that this fontsize is different from the size I specified in the default style, 18 - I want to override it in this button's case)

修改: 实际的按钮条目在MainWindow.xaml中看起来像这样，除了我对App.xaml进行的样式更改之外，没有其他自定义项:

The actual button entry looks like this in MainWindow.xaml, there's no other customizations other than the style changes I posed from App.xaml:

<Button Content="Button" HorizontalAlignment="Left" Margin="336,0,0,274.226" VerticalAlignment="Bottom" Width="75"/>

为了说明我所看到的:

To illustrate what I'm seeing:

推荐答案

正如人们所建议的那样，您的Button包含一个创建的Textblock以容纳内容，它是从app.xaml中拾取样式的，您可以在其中解决几种方法，这是几个:

As people have suggested, your Button contains a Textblock created to hold the content, it is picking up the style from app.xaml, you can work around this in a few ways, here are a couple:

在您的按钮中放置一个明确的文本块，并且不应用任何样式:

Put an explicit textblock into your button, and apply no style:

  <Button Margin="272,192,277,0" VerticalAlignment="Top">
        <TextBlock Text="Button" Style="{x:Null}"/>
    </Button>

将文本块也设置为按钮样式，同时使用null样式:

Put a textblock into your button style, also with a null style:

 <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="{x:Type Button}">
                <Grid>
      <TextBlock Text="{TemplateBinding Content}" Style="{x:Null}">
                       <TextBlock.Effect>
                          <DropShadowEffect BlurRadius="3" ShadowDepth="4"/>
                       </TextBlock.Effect>
      </TextBlock>
         </Grid>
              <ControlTemplate.Triggers>
                  <Trigger Property="IsFocused" Value="True"/>
                  <Trigger Property="IsDefaulted" Value="True"/>
                  <Trigger Property="IsMouseOver" Value="True"/>
                  <Trigger Property="IsPressed" Value="True"/>
                  <Trigger Property="IsEnabled" Value="False"/>
                </ControlTemplate.Triggers>
              </ControlTemplate>
            </Setter.Value>

希望这2个能为您工作.

Hopefully one of those 2 will work for you.

这篇关于WPF按钮和TextBlock样式如何相关?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！