Box Layout Panel
Here’s another quick WPF custom control derived from Panel. This one is a cross between a StackPanel and a WrapPanel. It supports two modes of layout – Inline and Block.
Inline elements are wrapped left to right much as the same as a WrapPanel with the default Orientation = Horizontal.
Block elements are stacked as per a StackPanel with the default Orientation = Vertical.
The benefit of combining (a simplified version) of this logic into one layout control is that an attached property can then be used on a per child basis to determine the layout (LayoutMode = Block or Inline). This is even more convenient when the property is set via an implicit style, e.g. all TextBlocks set to Inline by default, all Buttons as Block.
I also added some dependency properties for Padding (space between edge and top/left/right/bottom-most controls) and InternalPadding (the vertical and horizontal spacing between wrapped/stacked controls).
<panels:BoxPanel Height="Auto" Background="PaleGreen" InternalPadding="4,2" Padding="50,8,8,8"> <TextBlock>Some inline text.</TextBlock> <TextBlock>Followed by some more inline text.</TextBlock> <TextBlock>Followed by yet some more inline text.</TextBlock> <TextBlock panels:BoxPanel.LayoutMode="Block">A new paragraph.</TextBlock> <Button panels:BoxPanel.LayoutMode="Block">A Button</Button> <TextBlock>Below are three buttons in a line</TextBlock> <Button panels:BoxPanel.LayoutMode="Inline">One</Button> <Button panels:BoxPanel.LayoutMode="Inline">Two</Button> <Button panels:BoxPanel.LayoutMode="Inline">Three</Button> <panels:BoxPanel Background="LightYellow" Padding="10,2" InternalPadding="4,0"> <TextBlock>The</TextBlock> <Image Source="Passport_Photo_with_blue_background_half_size.png" Width="24"/> <TextBlock>End.</TextBlock> </panels:BoxPanel> </panels:BoxPanel>
Sound a bit obscure? Trust me, I had a reason
.



Comments