by
kirupa | 7 July 2009
In the
previous page you went into your ListBox's
ItemsPanel and replaced the StackPanel with a panel
that wraps - aptly called a WrapPanel. In this page,
we will make some minor changes to make your content
truly wrap.
As you saw in the
previous page, despite change your ItemsPanel to a
WrapPanel, our content isn't actually wrapping. The
change to make that happen is very simple.
First, make sure to scope back up (use the breadcrumb bar
like you did before) to the ListBox level and ensure
your ListBox is selected. Find the Layout category
and expand it by clicking on the little expander
found towards the bottom of that category:
[ advanced properties are hidden by default ]
Click on that expander
to display all of the advanced properties found in
the Layout category. One of the properties you will
see is something called
HorizontalScrollbarVisibility, though it may
be truncated due to space limitations:
[ find the HorizontalScrollbarVisibility property ]
Change the value of
the property from Auto to Disabled. This change will
cause the Listbox to no longer allow horizontal
scrolling, and that (strangely enough) ensures your
content wraps properly:
[ the
content is now wrapped ]
Hopefully this tutorial helped
you wrap your head around wrapping (ha!) items in a
ListBox. Looking back, what you did was pretty
straightforward. You went into your ItemsPanel and
replaced the StackPanel that was there with a
WrapPanel. Next, you simply told your listbox that
scrolling horizontally is off the table.
Straightforward does
not mean trivial or easy, so if you find your final
result not matching mine, feel free to download the
final source file:
Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!
|