Wrapping up containers with the WPF WrapPanel

Originally I hadn’t planned to mention the WrapPanel, because in my view it’s not an overly useful control. I have a hard time imagining when you might want to use it, but in playing with it I actually came up with one scenario, perhaps someone will be able to offer some more.

Using the control is easy, simply put <WrapPanel> and it’s ending tag in a Window or Page, then put the controls inside you want. Then as you resize the window, the controls inside will automatically shift around to make use of the available space.

For today’s example, create the WrapPanel tags, and inside put 8 buttons.

  <WrapPanel>

    <Button Width=50>1</Button>

    <Button Width=50>2</Button>

    <Button Width=50>3</Button>

    <Button Width=50>4</Button>

    <Button Width=50>5</Button>

    <Button Width=50>6</Button>

    <Button Width=50>7</Button>

    <Button Width=50>8</Button>

  </WrapPanel>

I then stretched out the window so you can see all 8 horizontally:

wpf019 

Now if I simply resize the window a bit, you’ll see the controls rearrange themselves automatically:

wpf020

And of course I can make them all go vertical if I want:

wpf021 

The one way I can think this might be useful is if you were to create a floating toolbar. In that form it might be handy to have the toolbar buttons moving around. Odds are there are better ways to create a floating toolbar, but if you needed something simple this might be an answer for you.

Other than that one example I can’t think of a lot of uses for it, but if you know some by all means post a comment. Meanwhile at least you’ll be familiar with the WrapPanel container.

Advertisements

2 thoughts on “Wrapping up containers with the WPF WrapPanel”

  1. I am using it for listing character portraits in an RPG manager. As more characters are loaded, they just keep wrapping around. Very useful when programmatically adding items of a known and fixed size.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s