Question

I'm trying do make something like this: when you click the button, the listboxitem collapses and shows some additional information:

enter image description here

I have already made something similar: details are showed when the whole item item is clicked. Any ideas how to modify this style so collapsing will take place only if the button (or near it) is clicked?

Code:

<Style x:Key="collapsingGridStyle" TargetType="{x:Type Grid}">
            <Style.Triggers>
                <DataTrigger
                   Binding="{Binding
                                Path=IsSelected,
                                RelativeSource=
                                {
                                    RelativeSource
                                    Mode=FindAncestor,
                                    AncestorType={x:Type ListBoxItem}
                                }
                        }"
                    Value="False">
                    <Setter Property="Grid.Visibility"
                    Value="Collapsed"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
Was it helpful?

Solution

There are many ways how can you achieve this behavior. For example, you can use expander in listboxitem template.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top