Set button background style in wpf

前端 未结 2 1284
花落未央
花落未央 2020-12-17 01:52

i have one button and i set button background style with LinearGradientBrush. everything works fine but when i run button and press click on button then gra

相关标签:
2条回答
  • 2020-12-17 02:15

    You need to redefine button style, You can do it using ControlTemplate. Here is example how to write reusable style that redefines button.

    I have added also an example how to implement color change on IsPressed event.

    <Window x:Class="ColorTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ResourceDictionary>
            <LinearGradientBrush x:Key="ButtonBackground" StartPoint="0,0" EndPoint="1,1">
                <GradientStop Color="#FFD9EDFF" Offset="0"/>
                <GradientStop Color="#FFC0DEFF" Offset="0.445"/>
                <GradientStop Color="#FFAFD1F8" Offset="0.53"/>
            </LinearGradientBrush>
            <Style x:Key="SimpleButtonStyle" TargetType="{x:Type Button}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Button}">
                            <Grid>
                                <Border Background="{StaticResource ButtonBackground}" VerticalAlignment="Stretch" CornerRadius="2" HorizontalAlignment="Stretch"/>
                                <Border x:Name="BorderPressed"  Opacity="0" Background="Blue" VerticalAlignment="Stretch" CornerRadius="2" HorizontalAlignment="Stretch"/>
                                <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" x:Name="MainContent" />
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsPressed" Value="True">
                                    <Trigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetName="BorderPressed" Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.2"/>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </Trigger.EnterActions>
                                    <Trigger.ExitActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetName="BorderPressed" Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.2"/>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </Trigger.ExitActions>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Window.Resources>
    <DockPanel>
        <Button Content="Button" Height="23" Name="button1" Width="75" Style="{StaticResource SimpleButtonStyle}"/>
    </DockPanel>
    

    0 讨论(0)
  • 2020-12-17 02:24

    This happens because of the buttons default style.

    You need to set a new Style.

    EDIT :

    <Button Content="Button" Height="23" Name="button1" Width="75">
     <Button.Style>
       <Style TargetType="Button">
         <Setter Property="Background">
          <Setter.Value>
            <LinearGradientBrush  StartPoint="0,0" EndPoint="1,1">
                <GradientStop Color="#FFD9EDFF" Offset="0"/>
                <GradientStop Color="#FFC0DEFF" Offset="0.445"/>
                <GradientStop Color="#FFAFD1F8" Offset="0.53"/>
            </LinearGradientBrush>
          </Setter.Value>
         </Setter>
           <Setter Property="Template">
             <Setter.Value>
               <ControlTemplate TargetType="{x:Type Button}">
                  <Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}" SnapsToDevicePixels="true">
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                  </Microsoft_Windows_Themes:ButtonChrome>
               </ControlTemplate>
             </Setter.Value>
          </Setter>
       </Style>
     <Button.Style>
    </Button>
    

    If you want to have this style more than once use it as a resource: Putting it to sets you this style for every button in your Window.xaml

    Moving the style to a higher scope like App.xaml applies the style for every button in your application

    0 讨论(0)
提交回复
热议问题