---
title: "GridSpliter control in WPF"  
description: "In this demonstration I am going to tell you that how to use GridSpliter control in WPF. The XAML GridSpliter  elements allow you to create a GridSpli"  
author: "Anonymous User"  
published: 2011-04-05  
updated: 2019-09-07  
canonical: https://www.mindstick.com/articles/535/gridspliter-control-in-wpf  
category: "wpf"  
tags: ["wpf"]  
reading_time: 2 minutes  

---

# GridSpliter control in WPF

In this demonstration I am going to tell you that how to use GridSpliter [control](https://yourviews.mindstick.com/view/83439/bipartisan-gun-control-bill-passed-in-us-after-decades) in WPF. The XAML <GridSpliter /> [elements](https://www.mindstick.com/forum/1440/wpf-button-with-multiple-text-elements) allow you to create a GridSpliter control. We can use GridSpliter control when we want to resize rows and [columns dynamically](https://www.mindstick.com/forum/161554/how-can-you-pivot-rows-into-columns-dynamically-using-t-sql).\

##### XAML code snippet which represents GridSpliter control

```
<GridSplitter Background="Red" Grid.Column="1" ResizeDirection="Auto" Grid.Row="1" Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
```

##### Some properties related With GridSpliter control

- **X: Name**—x: Name [property](https://www.mindstick.com/articles/198559/an-ownership-of-property-in-hua-hin) used to uniquely [identify](https://www.mindstick.com/forum/159425/java-app-crash-arrayindexoutofboundsexception-identify-invalid-index) your controls.
- **ResizeDirection**—ResizeDirection property is used to set [direction](https://yourviews.mindstick.com/story/5034/10-animals-with-the-best-sense-of-direction) of resigning of your control. ResizeDirection property has three [values](https://www.mindstick.com/forum/159360/how-to-write-sql-query-to-join-comma-separated-values) auto means both side, rows means only row should be resize and columns means only [column](https://www.mindstick.com/forum/2288/column-site_name-ambiguous-problem) can be resize.
- **HorizontalAlignment**—HorizontalAlignment property is used to set horizontal alignment of your GridSpliter control.
- **VerticalAlignment**—VerticalAlignment property is used to set [vertical](https://www.mindstick.com/forum/12951/how-to-fix-bootstrap-tab-vertical-with-text) alignment of your GridSpliter control.
- **Width**—Width property is used to set width of the GridSpliter control.
- **Height**—Height property is used to set Height of the GridSpliter control.

##### The following xaml code snippets represent use of GridSpliter control

```
<Grid>        <Grid.RowDefinitions>            <RowDefinition />        </Grid.RowDefinitions>        <Grid.ColumnDefinitions>            <ColumnDefinition Width="120" />            <ColumnDefinition Width="3"/>            <ColumnDefinition />        </Grid.ColumnDefinitions>        <Grid Grid.Column="0" Background="Goldenrod" />        <GridSplitter Background="Red" Grid.Column="1" ResizeDirection="Auto" Grid.Row="1" Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />        <Grid Grid.Column="2" Background="RosyBrown" /></Grid>
```

##### Output of the following code snippet is as follows

![GridSpliter control in WPF](https://www.mindstick.com/mindstickarticle/6c64bf8a-6704-4bd7-90ab-524689c390e5/images/b7e67eaa-cb13-43cb-9a4b-199a42cd4d30.png)

![GridSpliter control in WPF](https://www.mindstick.com/mindstickarticle/6c64bf8a-6704-4bd7-90ab-524689c390e5/images/71cdc3a6-2107-4b22-96a8-5484b18a123f.png)

---

Original Source: https://www.mindstick.com/articles/535/gridspliter-control-in-wpf

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.