---
title: "WrapPanel in WPF"  
description: "A WrapPanel element in XAML is used to create a WrapPanel control in WPF. WrapPanel control is similar to StackPanel control in functionality with one"  
author: "Anonymous User"  
published: 2011-04-13  
updated: 2020-03-04  
canonical: https://www.mindstick.com/articles/546/wrappanel-in-wpf  
category: "wpf"  
tags: ["wpf"]  
reading_time: 1 minute  

---

# WrapPanel in WPF

A WrapPanel element in XAML is used to create a WrapPanel control in [WPF](https://www.mindstick.com/blog/167/triggers-in-wpf). WrapPanel control is similar to StackPanel control in [functionality](https://www.mindstick.com/blog/136/using-watermark-functionality-in-textbox-by-jquery) with one [difference](https://www.mindstick.com/articles/157114/good-news-or-bad-news-and-the-difference-is) that WrapPanel control has built in Wrap functionality that means if the [child control](https://www.mindstick.com/forum/249/finding-child-control-in-wpf) in WrapPanel is [overflow](https://www.mindstick.com/interview/1711/what-is-overflow-properties-in-css) then it is automatically arrange in next line as sequence. In the following demonstration I will told you that how to use WrapPanel control in WPF.\

##### A XAML code snippet representing WrapPanel in WPF

```
<WrapPanel x:Name="wrapPanel1" Background="Beige" Orientation="Horizontal" >            <Ellipse Width="100" Margin="10" Height="100" x:Name="ellipse1" Fill="Red"   />            <Ellipse Width="100" Height="100" Fill="Pink" x:Name="ellipse2" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Orange" x:Name="ellipse3" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Green" x:Name="ellipse4" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Cyan" x:Name="ellipse5" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Goldenrod" x:Name="ellipse6" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Teal" x:Name="ellipse7" Margin="10" />            <Ellipse Width="100" Height="100" Fill="Aquamarine" x:Name="ellipse8" Margin="10" /></WrapPanel>
```

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

![WrapPanel in WPF](https://www.mindstick.com/mindstickarticle/30a24196-28c4-437e-87bc-4c481555bacc/images/4fdf758e-f077-417e-91e3-53d11168b9db.png)

![WrapPanel in WPF](https://www.mindstick.com/mindstickarticle/30a24196-28c4-437e-87bc-4c481555bacc/images/81882e0b-0511-43ed-affa-8b3a1de5e330.png)

---

Original Source: https://www.mindstick.com/articles/546/wrappanel-in-wpf

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
