Silverlight: how to modify the width of ListBox Items in response to user input?
        Posted  
        
            by sympatric greg
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by sympatric greg
        
        
        
        Published on 2010-04-26T17:23:56Z
        Indexed on 
            2010/04/26
            17:33 UTC
        
        
        Read the original article
        Hit count: 536
        
Silverlight
|listboxitem
I have a simple Silverlight 3 UserControl whose width increases or decreases based on user input.
The controls become more wide or more narrow as desired, except for the ListBox items. The ListBox Items grow horizontally to fit their content regardless of HorizontalContentAlignment being set to 'Stretch'.
Should I be able to set a property on ListBox.ItemContainerStyle to tell it to widen/narrow with the parent ListBox? There needs to be no horizontal scrolling within this Listbox.
Or is there a way to specify the ItemTemplate's StackPanel width that can be modified at runtime? I have bound this to a StaticResource, but do not understand whether I should be able to change the resource value. Can I create and bind to a DependencyProperty of the UserControl itself? I have not determined the syntax of this within the xaml.
code:
<UserControl x:Class="TheAssembly.GraphicViewer"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:userControls="clr-namespace:TheAssembly"
xmlns:core="clr-namespace:System;assembly=mscorlib">
<UserControl.Resources>
    <userControls:DictionaryAttributeConverter x:Name="MyDictionaryAttributeConverter" />
    <core:Double x:Key="ListItemWidth">155</core:Double>       
</UserControl.Resources> 
<Grid x:Name="LayoutRoot"  Width="175" >
    <Border Style="{StaticResource DraggableWindowBorder}">
        <StackPanel x:Name="RootStackPanel" Orientation="Vertical" HorizontalAlignment="Stretch">
            <Border Background="Black" HorizontalAlignment="Stretch" Margin="0">  
                <TextBlock x:Name="Header" Foreground="White" FontSize="14" TextWrapping="Wrap" Margin="2,0,2,0" 
                           Height="25" HorizontalAlignment="Left"
                           Text="{Binding HeaderText}"/>
            </Border>
            <TextBlock x:Name="Title"  Style="{StaticResource GraphicViewerDetail}" FontSize="12" FontWeight="Medium" TextWrapping="Wrap" 
               Text="{Binding Title}" Margin="3,0,0,0" HorizontalAlignment="Left"/>
            <ListBox x:Name="AttributeListBox" ItemsSource="{Binding Attributes}" BorderBrush="Red" HorizontalContentAlignment="Stretch"
                 Foreground="AntiqueWhite" Background="Transparent" IsEnabled="False" HorizontalAlignment="Stretch"  
                     ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Hidden">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="HorizontalAlignment" Value="Stretch"/>
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                        <Setter Property="Margin" Value="0,-2,0,0"/>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel x:Name="ListBoxItemStackPanel" HorizontalAlignment="Stretch" Orientation="Vertical" >
                            <TextBlock FontSize="10" Text="{Binding Key}" Foreground="White" FontWeight="Bold"  HorizontalAlignment="Stretch"
                                  Margin="2,0,0,0" TextWrapping="Wrap"/>
                            <TextBlock FontSize="10"  Text="{Binding Value}" Foreground="White" Margin="6,-2,0,0" TextWrapping="Wrap" 
                                       HorizontalAlignment="Stretch" />
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </StackPanel>
    </Border>
</Grid>
© Stack Overflow or respective owner