ZOrder von Expandern mit Leinwand innerhalb der Liste

Question

ich eine Liste haben, die einige Steuerelemente enthält, darunter ein Expander. Innerhalb der Expander ist eine weitere Liste, die ich die äußere Liste zu überlagern möchten. Hier ist eine einfache Repro:

<Page.Resources>
    <x:Array x:Key="array1" Type="sys:String">
        <sys:String>item 1</sys:String>
        <sys:String>item 2</sys:String>
        <sys:String>item 3</sys:String>
    </x:Array>
    <DataTemplate x:Key="buttonTemplate">
        <Button Content="{Binding}"/>
    </DataTemplate>
    <DataTemplate x:Key="expanderItem">
        <StackPanel>
            <Expander Header="Options">
                <Canvas>
                    <StackPanel Panel.ZIndex="999" Background="Red">
                        <Label>A1</Label>
                        <Label>A2</Label>
                        <Label>A3</Label>
                        <Label>A4</Label>
                    </StackPanel>
                </Canvas>
            </Expander>
            <Label BorderBrush="Black" BorderThickness="2" Content="{Binding}"/>
        </StackPanel>
    </DataTemplate>
</Page.Resources>
<Grid>
    <ListBox ItemsSource="{StaticResource array1}" ItemTemplate="{StaticResource expanderItem}"/>
</Grid>

Wenn die Expander geöffnet wird, sind die inneren Etiketten als Etikett auf der gleichen Ebene gerendert erhalten in der gleichen DataTemplate und die Inhalte später Elemente in der Liste. Ich habe versucht, ohne eine Änderung des Panel.ZIndex bis zu der Platte bewegt.

Wenn ich den folgenden Stil:

<Style TargetType="{x:Type Expander}">
    <Style.Triggers>
        <Trigger Property="IsExpanded" Value="True">
            <Setter Property="Panel.ZIndex" Value="999"/>
        </Trigger>
    </Style.Triggers>
</Style>

Es wird richtig Overlay Artikel in dem gleichen Liste Artikel, aber immer noch mit Inhalt aus späteren Listenelementen vermischte rendert.

(Ich vermute, dass dies ein ziemlich offensichtlich Layout Problem ist, aber ich habe nicht in der Lage gewesen, es zu finden.)

Answer 1

Sie könnten versuchen, einen Konverter zu schreiben, die die ZIndex in der Datatemplate setzt basierend auf dem Index des Elements in der Liste. Die interessante Sache mit dieser würde sicherstellen, dass alles korrekt Updates als Elemente hinzugefügt / entfernt.

Haben Sie die Expander müssen unabhängig von Layout sein?