XAML Button Style Oluşturmak

Dockpanel ve stackpanel içerisine eklediğimiz nesnelerin daha düzgün görünmesini ve ayarlanmasını sağlar.
İç içe gridlerimizi oluşturduktan sonra işlem yapmak istediğimiz yere border ekliyoruz.
Button ekleyeceğimiz yere önce bir dockpanel ekleyip onun içerisine buttonlarımızı ekliyoruz. Bizim şeklimiz aşağıdaki gibi oldu.

















Pencerenin hazır kapatma butonu ve başlık çubuğunu kaldırmak için window’un apparence özelliğinden allowstransparan ı aktif ediyoruz.

Butona tıklandığında ne yapacağını yazmak için önce buton seçilir. Butona isim verilir x:Name="btn_KAPAT" Click="btn_KAPAT_Click" özelliği yazılır. Kodlar ise buttonun propertiesindeki event sekmesi açılarak yazılır. this.Close();


Herhangi bir nesneye style belirlemek
App.xaml dosyası açılır ve styller yazılır


Style Kodları 

<Application x:Class="hafta02112018_1.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <!-- Button sitilleri buraya dikkat-->
        <Style x:Key="minibuttonlar" TargetType="Button">
            <Setter Property="Width" Value="35"/>

            <Setter Property="Foreground" Value="Pink"/>
            <Setter Property="BorderThickness" Value="0,0,0,0"/>
            <Setter Property="Background" Value="Green"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Name="border" Background="YellowGreen" BorderThickness="0,0,0,0" BorderBrush="Bisque" >
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                              
                               <Setter TargetName="border" Property="BorderBrush" Value="Blue"></Setter>
                                <Setter TargetName="border" Property="Background" Value="White"></Setter>
                              
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
       
       
       
       
    </Application.Resources>
  
   


</Application>


MainWindow.xaml KODLARI

<Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="150"></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0" Grid.Row="0" Background="Aqua">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition></RowDefinition>
                    <RowDefinition></RowDefinition>
                    <RowDefinition ></RowDefinition>
                    <RowDefinition></RowDefinition>
                    <RowDefinition></RowDefinition>
                </Grid.RowDefinitions>
                <Border Grid.Column="0" Grid.Row="0" />
                <Border Grid.Column="0" Grid.Row="1" >
                    <DockPanel>
                        <Button Content="DENEME" Name="btn_deneme" Style="{DynamicResource ResourceKey=yenibutton}"/>
                        
                    </DockPanel>
                </Border>
                <Border Grid.Column="0" Grid.Row="2" Background="Black">
                    <DockPanel>
                        <Button Content="DENEME" Name="btn_deneme2" />

                    </DockPanel>
                </Border>
                <Border Grid.Column="0" Grid.Row="3" Background="Black"/>
            </Grid>
        </Border>
        <Border Grid.Column="1" Grid.Row="0" Background="Bisque">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="30"></RowDefinition>
                    <RowDefinition></RowDefinition>
                </Grid.RowDefinitions>
                <Border Grid.Column="0" Grid.Row="0" >
                    <DockPanel  Width="72" HorizontalAlignment="Right">
                        <Button Content="__"  Style="{DynamicResource ResourceKey=yenibutton}"></Button>
                        <Button Content="X"  x:Name="btn_KAPAT" Click="btn_KAPAT_Click" Style="{DynamicResource ResourceKey= minibuttonlar}"></Button>
                    </DockPanel>
                </Border>
                <Border Grid.Column="0" Grid.Row="1" ></Border>
            </Grid>
        </Border>



    </Grid>



Yorumlar

Yorum Gönder