Sunday, March 18, 2012

Expanded ListBoxItem's Width

This will allow element inside to expand its width. 
The key here is in red font. This will allow you to stretch the grid element inside the ListBox. 
-----------------------------------------------------------------------------------------------------
e.g (Maximize Grid element inside  <ListBox.ItemTemplate>  <DataTemplate>  </DataTemplate> </ListBox.ItemTemplate>)
<Grid Width="auto" >
            <Grid.Resources>               
                    <Style x:Key="listContainerStyle" TargetType="ListBoxItem">                     
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>                     
                    </Style>           
            </Grid.Resources> 

          <ListBox ScrollViewer.VerticalScrollBarVisibility="Auto" ItemContainerStyle="{StaticResource    listContainerStyle}" ScrollViewer.CanContentScroll="True" ItemsSource="{Binding Path=Model.Object}" Grid.ColumnSpan="2" Grid.Row="1"  Name="lstDiagnosis" >               
                <ListBox.ItemTemplate>                    
                    <DataTemplate>
                        <ListBoxItem HorizontalContentAlignment="Stretch">

                             <Grid Margin="2" >                           
                            <Grid.ColumnDefinitions >
                                <ColumnDefinition Width="50"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>
                            <TextBlock FontWeight="Bold" Text="{Binding Name}" Grid.Column="0" >
                            </TextBlock>
                            <TextBlock FontWeight="Bold" Text="{Binding Path=Description}"  Grid.Column="1">
                            </TextBlock>                            
                            <Button HorizontalAlignment="Right" VerticalContentAlignment="Center" VerticalAlignment="Center" Margin="0,0,2,0" Style="{x:Null}" Grid.Column="2"  FontWeight="Bold" FontSize="8" Tag="{Binding}" >
                                <TextBlock Text=" X " VerticalAlignment="Top" ></TextBlock>
                            </Button>
                        </Grid>
            </ListBoxItem>
            </DataTemplate>
            </ListBox.ItemTemplate>
            </ListBox>        
        </Grid>
----------------------------------------------------------------------------------------------------- 




No comments:

Post a Comment