stackpanel is and autosizing a ListBox

L

Lloyd Dupont

I have managed to make a ListBox where the scrollbar is replaced by up and down button with the code below:

===========
<ListBox Width="100" Height="100">
<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

===========



that looks nice and just the way I wanted it to be (just up and down button instead of side scrollbar)!


however I have one problem:
if I use my ListBox inside a StackPanel, it doesn't shrink to accomodate the size of the window, hence the down button is invisible (out of the window, with a few element of the list as well).
Try it out for your self with this piece of XAML:
===================

<Window x:Class="WindowsApplication1.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="WindowsApplication1" Height="300" Width="300"

<StackPanel Orientation="Vertical">

<Button>Overview</Button>

<ListBox>

<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

</StackPanel>

</Window>


======================


So what did I missed?
How can I force the stack panel to size its content (i.e. the list box) to the available space?
 
L

Lloyd Dupont

found it, it's normal!
I will use a DockPanel instead....

--
Regards,
Lloyd Dupont
NovaMind Software
Mind Mapping at its best
www.nova-mind.com

I have managed to make a ListBox where the scrollbar is replaced by up and down button with the code below:

===========
<ListBox Width="100" Height="100">
<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

===========



that looks nice and just the way I wanted it to be (just up and down button instead of side scrollbar)!


however I have one problem:
if I use my ListBox inside a StackPanel, it doesn't shrink to accomodate the size of the window, hence the down button is invisible (out of the window, with a few element of the list as well).
Try it out for your self with this piece of XAML:
===================

<Window x:Class="WindowsApplication1.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="WindowsApplication1" Height="300" Width="300"

<StackPanel Orientation="Vertical">

<Button>Overview</Button>

<ListBox>

<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

</StackPanel>

</Window>


======================


So what did I missed?
How can I force the stack panel to size its content (i.e. the list box) to the available space?
 
R

Radek Cerny

Ah, the wonderful world of XAML and WPF. Or at least ot will be in 2 months when you get your head around it.

Have fun with DockPanel. Remember, order counts. So dont always go top to bottom; if you want a status bar or such at the bottom, declare that first with DockPanel.Dock="Bottom".
found it, it's normal!
I will use a DockPanel instead....

--
Regards,
Lloyd Dupont
NovaMind Software
Mind Mapping at its best
www.nova-mind.com

I have managed to make a ListBox where the scrollbar is replaced by up and down button with the code below:

===========
<ListBox Width="100" Height="100">
<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

===========



that looks nice and just the way I wanted it to be (just up and down button instead of side scrollbar)!


however I have one problem:
if I use my ListBox inside a StackPanel, it doesn't shrink to accomodate the size of the window, hence the down button is invisible (out of the window, with a few element of the list as well).
Try it out for your self with this piece of XAML:
===================

<Window x:Class="WindowsApplication1.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="WindowsApplication1" Height="300" Width="300"

<StackPanel Orientation="Vertical">

<Button>Overview</Button>

<ListBox>

<ListBox.Resources>

<Style TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ScrollViewer}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="16"/>

<RowDefinition Height="*"/>

<RowDefinition Height="16"/>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Command="ScrollBar.LineUpCommand" Delay="0"/>

<ScrollContentPresenter Grid.Row="1" Content="{TemplateBinding Content}"/>

<RepeatButton Grid.Row="2" Command="ScrollBar.LineDownCommand" Delay="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ListBox.Resources>

<Rectangle Fill="White" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Yellow" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Green" Height="50" Width="50" Margin="0,4,0,0"/>

<Rectangle Fill="Magenta" Height="50" Width="50" Margin="0,4,0,0"/>

</ListBox>

</StackPanel>

</Window>


======================


So what did I missed?
How can I force the stack panel to size its content (i.e. the list box) to the available space?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

[WPF]: Tab Control and TabItem (focus?) woes.... 0
Expose Inner Control of WPF Control 0
DataGrid in WPF apparently has a bug 5
Setting local namespace in xaml file 1
WPF - override TabItem no longer auto sizes content 0
where does controltemplate code go? 1
WPF databinding and Listbox 0
WPF and codeBehind file problem.... 0

Top