Home/ Questions/Q 8495985
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T23:43:32+00:00

I have a WPF usercontrol with a Button. I’ve replicated the standard button shading

  • 0

I have a WPF usercontrol with a Button. I’ve replicated the standard button shading of System.Windows.Media.LinearGradientBrush by Extract Value to Resource to get sight of the default setup in resources

I’ve then copied the resource but substituted the default colours to the ones I want

    <LinearGradientBrush EndPoint="0,1">
        <GradientStop Color="#FFF3F3F3" Offset="0" />
        <GradientStop Color="#FFEBEBEB" Offset="0.5" />
        <GradientStop Color="#FFDDDDDD" Offset="0.5" />
        <GradientStop Color="#FFCDCDCD" Offset="1" />
    </LinearGradientBrush>

I’ve then deleted the resource so my full XAML looks like

<UserControl x:Class="Project.Detail"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="30" d:DesignWidth="800" BorderBrush="#FF5380E7" BorderThickness="0,0,0,1" >
    <Grid Height="30" Width="800">
        <Button Height="30" HorizontalAlignment="Left" Margin="254,0,0,0" Name="bOption3" VerticalAlignment="Top" Width="50" Click="bOption_Click" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" FontSize="10" FontStretch="SemiCondensed">
            <Button.Background>
                <LinearGradientBrush EndPoint="0,1">
                    <GradientStop Color="#FFD2DEF9" Offset="0" />
                    <GradientStop Color="#FFC5D4F7" Offset="0.5" />
                    <GradientStop Color="#FFAEC3F4" Offset="0.5" />
                    <GradientStop Color="#FF8FACF0" Offset="1" />
                </LinearGradientBrush>
            </Button.Background>
        </Button>
    </Grid>
</UserControl>

In the designer I see the colours I’ve set with the correct gradient but when I build and run the buttons are the default grey colour.

Can anyone tell what I am doing wrong?

EDIT:

I want to retain the default button style except the initial state background I want my own colours. I’ve now tried adding specific resources for the background

<UserControl.Resources>
    <LinearGradientBrush x:Key="NewBackground" EndPoint="0,1">
        <GradientStop Color="#FFD2DEF9" Offset="0" />
        <GradientStop Color="#FFC5D4F7" Offset="0.5" />
        <GradientStop Color="#FFAEC3F4" Offset="0.5" />
        <GradientStop Color="#FF8FACF0" Offset="1" />
    </LinearGradientBrush>
</UserControl.Resources>

and then adding 

<Button Height="30" HorizontalAlignment="Left" Margin="360,0,0,0"  Background="{StaticResource NewBackground}">

Again in the designer I can see the colour being applied but when the app runs it has the default grey colour at all times.

Button in design mode

enter image description here

Button in App

enter image description here

I now have a few questions

  1. Is there a simple way to change just 1 property of the default button rather than create complete new style?

  2. If I have to recreate a full style where can I access all the default properties to make it look the same?

Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    1. Yes you can for certain properties and it depends. Say if you want to change the FontSize, FontFamily, FontSize, FontStretch, etc. There are some attach properties provided by WPF to override it e.g.

      <Grid TextElement.FontFamily=""/>
      or <Button TextElement.FontFamily=""/>

    2. You can try going to Expression blend and extract the default template of WPF controls. Customize the templates from there.

    More info can be found here

    • 0