locked
Expanders that intelligently only have one open at a time RRS feed

  • Question

  • I followed this brilliant thread by Unni that talked about creating a style/template for ListBox items that converted them into expanders, then made them aware so only one would be open at a time:

    http://social.expression.microsoft.com/Forums/en-US/blend/thread/9425df96-7613-4449-a469-f744c1477e48/?ffpr=0

    Everything in it works BRILLIANTLY, with the exception that I do not know how to get a header into each expander...  even with a content presenter in the template, the listbox item only allows one item below it, which is the grid containing the content of the expander....

    Any help would be greatly appreciated!
    Purkiss
    Thursday, March 5, 2009 8:59 PM

Answers

  • Hi,

    I am not sure if i get you correctly but will TemplateBinding the Header property of the Expander to the Content property of the ListBoxItem work?

    <Window
    	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    	x:Class="WpfApplication67.MainWindow"
    	x:Name="Window"
    	Title="MainWindow"
    	Width="640" Height="480">
    	<Window.Resources>
    		<Style x:Key="ListBoxItemStyle1" TargetType="{x:Type ListBoxItem}">
    			<Setter Property="Background" Value="Transparent"/>
    			<Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    			<Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    			<Setter Property="Padding" Value="2,0,0,0"/>
    			<Setter Property="Template">
    				<Setter.Value>
    					<ControlTemplate TargetType="{x:Type ListBoxItem}">
    						<Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
    							<Expander 
    								x:Name="expander"
    								Header="{TemplateBinding Content}"
    								IsExpanded="{Binding IsSelected, 
    											Mode=TwoWay,
    											RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}">
    								<Grid Height="100" Background="#FFFF0000"/>
    							</Expander>
    						</Border>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
    
    	<Grid x:Name="LayoutRoot">
    		<ListBox IsSynchronizedWithCurrentItem="True" ItemContainerStyle="{DynamicResource ListBoxItemStyle1}">
    			<ListBoxItem Content="Foo"/>
    			<ListBoxItem Content="Bar"/>
    			<ListBoxItem Content="Hello"/>
    			<ListBoxItem Content="World"/>
    		</ListBox>
    	</Grid>
    </Window>
    Thanks!
    Jeetu
    Jeetendra Kukreja [MSFT]
    • Marked as answer by Purkiss Tuesday, April 7, 2009 6:17 PM
    Sunday, March 29, 2009 12:22 AM