listbox's item with dynamic height (“auto” doesnt work)

Question

I have a listBox, wich I fill from some collection. Each item of collection has some info: static name and picture, and dynamic content(text, photo or photos, etc). I want to change the listbox's item height for each item of collection. Height depends of content, if it has only text - item of listbox must have static (textblock for name, image for picture) and a textblock with text, and textblock's heigth must change acording to text (if it's 2-3 strings height will be min, if text fit in 15-20 strings - height of textblock must change accordind to strings), if item of collection include text and image - it must have static (textblock for name, image for picture), textblock for text, and image for image. Height of listbox's item must depend of textblock size and image size.

At this time, I have a listbox with static item's height, and want to make height dynamic.

here is one of my listbox's item where it has a ptoto

<local:NewsTemplateSelector.Photo>
    <DataTemplate>
        <Border BorderBrush="Red" BorderThickness="2"  Width="400" Height="auto" Margin="10">
            <StackPanel Orientation="Horizontal" Width="400" Height="auto">
                <Image Source="{Binding SourceImage}" Height="75" Width="75" Margin="0,-225,0,0" />
                <Canvas Width="400">
                    <TextBlock Text="{Binding SourceName}" Foreground="Black" FontSize="25" TextWrapping="Wrap" Height="55" Width="326" d:LayoutOverrides="VerticalAlignment, Height" />
                    <Image  Source="{Binding Photo[0].Big}" Height="auto" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="326" Canvas.Top="69"/>
                </Canvas>
            </StackPanel>
        </Border>
    </DataTemplate>
</local:NewsTemplateSelector.Photo>

and here is template with text

<local:NewsTemplateSelector.Texts>
    <DataTemplate>
        <StackPanel Orientation="Horizontal" Background="YellowGreen" Width="400" Height="300" >
            <Image Source="{Binding SourceImage}" Height="75" Width="75" Margin="0,-225,0,0" />
            <Canvas Width="400">
                <TextBlock Text="{Binding SourceName}" FontSize="25" Foreground="Black" TextWrapping="Wrap" Width="326" Height="65" d:LayoutOverrides="VerticalAlignment, Height"  />
                <TextBlock Text="{Binding Texts}"  Foreground="Black" FontSize="25" TextWrapping="Wrap" Height="229" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="326" Canvas.Top="69" />
            </Canvas>

        </StackPanel>
    </DataTemplate>
</local:NewsTemplateSelector.Texts>

I tried to use auto - but items have height 0. If i use the border with field color "red" under the listbox's item - i see a red colored line for each item, not a item's content

if I understand, the problem is in stackpanel. But how can I add more than one content in a listbox's item? — eg01st

d.moncada d.moncada · Accepted Answer · 2012-12-04T02:52:02

See this tutorial on how to use a template selector. http://www.switchonthecode.com/tutorials/wpf-tutorial-how-to-use-a-datatemplateselector

listbox's item with dynamic height (“auto” doesnt work)

1 Answers