问题描述:

I would like to create a UI similar to Visual Studio-s open documents stripe. The main idea is, that I have a listbox, which I fill with the open documents' thumbnails. I have the following Templates applied:

<DataTemplate x:Key="ListBoxItemTemplate">

<Grid x:Name="grid" Height="23" d:DesignWidth="100">

<Rectangle x:Name="background" Grid.ColumnSpan="3"

Stretch="Fill" Fill="{StaticResource LinearMain02}" Margin="0"/>

<TextBlock Text="text" Margin="4,0,25,0" Foreground="{StaticResource SolidBaseBrush}"

VerticalAlignment="Center"/>

<Button x:Name="button" Style="{StaticResource CloseButtonStyle}"

Foreground="{StaticResource SolidStrongBrush}" BorderBrush="{x:Null}"

Margin="0,0,4,0" VerticalAlignment="Center" HorizontalAlignment="Right"

Width="15" Height="15" BorderThickness="0" Opacity="0"/>

</Grid>

</DataTemplate>

<Style x:Key="CloseButtonStyle" TargetType="Button">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="Button">

<Grid Width="{TemplateBinding Height}" Height="{TemplateBinding Height}">

<Ellipse Stroke="{StaticResource SolidBaseBrush}" Opacity="0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

The ListBox itself is not much to look at, but here it is:

<ListBox Grid.Row="1" x:Name="list_tabs"

ItemsSource="{Binding Thumbnails}"

SelectedItem="{Binding SelectedThumbnail, Mode=TwoWay}"

ItemTemplate="{StaticResource TabListItemTemplate}" BorderBrush="{x:Null}"

Padding="0" BorderThickness="0"

Background="{StaticResource LinearStrong10}">

<ListBox.ItemsPanel>

<ItemsPanelTemplate>

<toolkit:WrapPanel Orientation="Horizontal" ItemHeight="30"/>

</ItemsPanelTemplate>

</ListBox.ItemsPanel>

</ListBox>

It seems like it doesn't matter how long the content of the item is, it remains 100px wide. That I want to change, so the item would follow the width of its contents. What did I forget to set?

相关阅读:
Top