How to create Custom Window Style in WPF [Drag Window]

XAML WPF Developer 31 Reputation points
2021-09-30T08:50:08.393+00:00

Hi To All,
How to create Custom Window Style in WPF with Drag-able window

XAML
XAML
A language based on Extensible Markup Language (XML) that enables developers to specify a hierarchy of objects with a set of properties and logic.
767 questions
0 comments No comments
{count} vote

Accepted answer
  1. Hui Liu-MSFT 40,786 Reputation points Microsoft Vendor
    2021-10-01T06:16:49.81+00:00

    For creating custom window styles that can be dragged and dropped, you could try to refer to the following code.

    The code of xaml:

       <Window x:Class="CustomWindowStyleofDragWindow.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:CustomWindowStyleofDragWindow"  
                mc:Ignorable="d" WindowStyle="None" AllowsTransparency="True" Background="Transparent"  >  
            <Window.Template>  
                <ControlTemplate TargetType="Window">  
                    <Border BorderBrush="Transparent"  BorderThickness="5" CornerRadius="10" Background="Transparent" >  
                        <Border BorderBrush="Red" BorderThickness="4" CornerRadius="10" Name="MainBorder" Background="GreenYellow" >  
                            <Border.Effect>  
                                <DropShadowEffect BlurRadius="10" Direction="-90" RenderingBias="Quality" ShadowDepth="2" Color="Red"/>  
                            </Border.Effect>  
                              
                            <Grid Margin="10">  
                                <Grid.RowDefinitions>  
                                    <RowDefinition Height="30"/>  
                                    <RowDefinition Height="*"/>  
                                </Grid.RowDefinitions>  
                                <Grid x:Name="sp" Grid.Row="0" Loaded="header_Loaded" Background="AliceBlue">  
                                    <Grid.ColumnDefinitions>  
                                        <ColumnDefinition Width="*"/>  
                                        <ColumnDefinition Width="120"/>  
                                    </Grid.ColumnDefinitions>  
                                    <TextBlock  x:Name="header" Background="AliceBlue"  >  header....</TextBlock>  
                                    <Button  Grid.Column="1" HorizontalAlignment="Left"  Content="-" Height="35"   Name="button1" Width="62" Click="button1_Click" />  
                                    <Button Grid.Column="1" HorizontalAlignment="Right" Margin="0,0,5,0" Content="*" Height="35"  Name="button3" Width="49" Click="button3_Click" />  
                                </Grid>  
                                <ContentPresenter Grid.Row="1"/>  
                            </Grid>  
                        </Border>  
                    </Border>  
                </ControlTemplate>  
            </Window.Template>  
            <Grid Background="LightSkyBlue">  
                <TextBlock Text="content..."/>  
            </Grid>  
        </Window>  
    

    The code of xaml.cs:

    using System.Windows;  
    using System.Windows.Controls;  
      
    namespace CustomWindowStyleofDragWindow  
    {  
      public partial class MainWindow : Window  
      {  
        public MainWindow()  
        {  
          InitializeComponent();  
           
        }  
        private void header_Loaded(object sender, RoutedEventArgs e)  
        {  
          InitHeader(sender as Grid);  
        }  
        private void button1_Click(object sender, RoutedEventArgs e)  
        {  
          this.WindowState = WindowState.Minimized;  
        }  
        private void button3_Click(object sender, RoutedEventArgs e)  
        {  
          this.Close();  
        }  
        private void InitHeader(Grid header)  
        {  
          var restoreIfMove = false;  
      
          header.MouseLeftButtonDown += (s, e) =>  
          {  
            if (e.ClickCount == 2)  
            {  
              if ((ResizeMode == ResizeMode.CanResize) ||  
                  (ResizeMode == ResizeMode.CanResizeWithGrip))  
              {  
                SwitchState();  
              }  
            }  
            else  
            {  
              if (WindowState == WindowState.Maximized)  
              {  
                restoreIfMove = true;  
              }  
      
              DragMove();  
            }  
          };  
          header.MouseLeftButtonUp += (s, e) =>  
          {  
            restoreIfMove = false;  
          };  
          header.MouseMove += (s, e) =>  
          {  
            if (restoreIfMove)  
            {  
              restoreIfMove = false;  
              var mouseX = e.GetPosition(this).X;  
              var width = RestoreBounds.Width;  
              var x = mouseX - width / 2;  
      
              if (x < 0)  
              {  
                x = 0;  
              }  
              else  
              if (x + width > SystemParameters.PrimaryScreenWidth)  
              {  
                x = SystemParameters.PrimaryScreenWidth - width;  
              }  
      
              WindowState = WindowState.Normal;  
              Left = x;  
              Top = 0;  
              DragMove();  
            }  
          };  
        }  
        private void SwitchState()  
        {  
          switch (WindowState)  
          {  
            case WindowState.Normal:  
              {  
                WindowState = WindowState.Maximized;  
                break;  
              }  
            case WindowState.Maximized:  
              {  
                WindowState = WindowState.Normal;  
                break;  
              }  
          }  
        }  
      }  
    }  
    

    The picture of result:

    136850-1.gif
    136867-image.png


    If the response is helpful, please click "Accept Answer" and upvote it.
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    0 comments No comments

1 additional answer

Sort by: Most helpful
  1. XAML WPF Developer 31 Reputation points
    2021-10-01T06:35:13.407+00:00

    Please can you tell me how to create Round Corner Window of Custom Window..
    Please find below attached image
    i am facing this issue related to Grid Corner is not rounded.......136820-transparent-wpf1.jpg