■ ControlTemplate 엘리먼트를 사용해 버튼의 배경색을 그라데이션 처리한 Button 엘리먼트를 정의하는 방법을 보여준다.
▶ MainWindow.xaml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
<Window x:Class="TestProject.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="800" Height="600" Title="TestProject" FontFamily="나눔고딕코딩" FontSize="16"> <Grid> <Button Width="200" Height="60" BorderThickness="3" BorderBrush="Black" FontSize="24" FontWeight="Bold" Content="테스트"> <Button.Template> <ControlTemplate TargetType="Button"> <Border Name="Border" CornerRadius="20" BorderThickness="{Binding BorderThickness, RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{Binding BorderBrush, RelativeSource={RelativeSource TemplatedParent}}"> <Border.Background> <LinearGradientBrush StartPoint="0 0.5" EndPoint="1 0.5"> <GradientStop Offset="0.0" Color="{Binding Background.Color, RelativeSource={RelativeSource TemplatedParent}}" /> <GradientStop Offset="0.9" Color="White" /> </LinearGradientBrush> </Border.Background> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2" RecognizesAccessKey="True" /> </Border> <ControlTemplate.Triggers> <Trigger Property="IsPressed" Value="true"> <Setter TargetName="Border" Property="Background"> <Setter.Value> <LinearGradientBrush StartPoint="0 0.5" EndPoint="1 0.5"> <GradientStop Offset="0.0" Color="{Binding Background.Color, RelativeSource={RelativeSource TemplatedParent}}" /> <GradientStop Offset="0.9" Color="DarkSlateGray" /> </LinearGradientBrush> </Setter.Value> </Setter> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Button.Template> <Button.Background> <SolidColorBrush Color="RoyalBlue" /> </Button.Background> </Button> </Grid> </Window> |
