Custom WPF window style

cepbuch picture cepbuch · Oct 5, 2016 · Viewed 20.5k times · Source

I'm trying to make a custom window style. The goal is to create a template that migth be used by every window in my application. Template contains the toolbar, title and "the area which will be used by window". The problem is: When I use my style I can no longer add grid and conrols.

App.xaml

<Style x:Key="CustomWindowStyle" TargetType="{x:Type Window}">
  <Setter Property="WindowStyle" Value="None"/>
  <Setter Property="AllowsTransparency" Value="True"/>
  <Setter Property="ResizeMode" Value="NoResize"/>
  <Setter Property="Background" Value="MintCream"/>
  <Setter Property="BorderBrush" Value="#0046E7"/>
  <Setter Property="BorderThickness" Value="2"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type Window}">
        <Grid Background="{TemplateBinding Background}">
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
          </Grid.RowDefinitions>
          <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="Auto"/>
          </Grid.ColumnDefinitions>
          <StackPanel Grid.ColumnSpan="2">
            <TextBlock TextAlignment="Center"
                       Margin="0 10 0 0"
                       FontSize="22"
                       FontWeight="DemiBold"
                       Foreground="RoyalBlue"
                       Text="{TemplateBinding Title}"/>
          </StackPanel>
          <StackPanel Grid.Row="0" Grid.Column="1"
                      Orientation="Horizontal"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Center"
                      Margin="0 10 15 0">
            <Button Style="{StaticResource MinimizeButtonStyle}"
                    Width="25"
                    Height="22"
                    Margin="0 0 10 0"/>
            <Button Style="{StaticResource CloseButtonStyle}"
                    Width="25"
                    Height="22"/>
          </StackPanel>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

MainWindow.xaml

<Window x:Class="WindowForHW2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WindowForHW2"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525"
    Style="{StaticResource CustomWindowStyle}">
<Grid>
  <Button Width="100" Height="40" Content="Hello"/>
</Grid>

Template Works, but I cannot add smth anymore: Window:

Answer

Ayyappan Subramanian picture Ayyappan Subramanian · Oct 5, 2016

You need to add a ContentPresenter where the Content of your Window goes. Try this.

<Style x:Key="CustomWindowStyle" TargetType="{x:Type Window}">
  <Setter Property="WindowStyle" Value="None"/>
  <Setter Property="AllowsTransparency" Value="True"/>
  <Setter Property="ResizeMode" Value="NoResize"/>
  <Setter Property="Background" Value="MintCream"/>
  <Setter Property="BorderBrush" Value="#0046E7"/>
  <Setter Property="BorderThickness" Value="2"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type Window}">
        <Grid Background="{TemplateBinding Background}">
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
          </Grid.RowDefinitions>
          <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="Auto"/>
          </Grid.ColumnDefinitions>
          <StackPanel Grid.ColumnSpan="2">
            <TextBlock TextAlignment="Center"
                       Margin="0 10 0 0"
                       FontSize="22"
                       FontWeight="DemiBold"
                       Foreground="RoyalBlue"
                       Text="{TemplateBinding Title}"/>
          </StackPanel>
          <StackPanel Grid.Row="0" Grid.Column="1"
                      Orientation="Horizontal"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Center"
                      Margin="0 10 15 0">
            <Button Content="+"
                    Width="25"
                    Height="22"
                    Margin="0 0 10 0"/>
            <Button Content="X"
                    Width="25"
                    Height="22" />
          </StackPanel>
        <!-- here goes the content -->
        <ContentPresenter Grid.Row="1"/>
       </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>