Question

I am having a kinda strange problem.

Here is the situation. I have a ListView, with a custom defined GroupStyle to make data appear in Expanders, in which there is a WrapPanel containing StackPanels (which contain one ToggleButton + one custom control)
The custom control in the StackPanel is not visible by default, and becomes visible when the ToggleButton is checked.
However, when I check a ToggleButton, the custom control appears, and all the other control situated on the same line will move to a vertical center.
Ideally, I’d like these other members to stay on top. I’ve tried to set VerticalAlignment="Top" everywhere I could, it doesn’t change anyway.

Imaged problem:

The initial state of an expander:

Once the ToggleButton is clicked, here is what happens:

As you can see, the button “Test Analysis” is moved to stay at the center. I want it to stay in the same place than the original.

Moreover, I’ve defined all of these styles in separate DataTemplates objects.
Here is some light code (I just removed what’s useless for the problem here, won’t make you read tons of XAML code 🙂 ):

The expander’s content property:

<Expander.Content>
    <WrapPanel Background="White" VerticalAlignment="Top">
        <ItemsPresenter VerticalAlignment="Top"/>
    </WrapPanel>
</Expander.Content>

The list’s ItemsPanel :

<ItemsPanelTemplate >
    <WrapPanel 
         Width="{Binding (FrameworkElement.ActualWidth),
         RelativeSource={RelativeSource 
                         AncestorType=Expander}}"
         ItemWidth="{Binding (ListView.View).ItemWidth,
         RelativeSource={RelativeSource AncestorType=ListView}}"

         ItemHeight="{Binding (ListView.View).ItemHeight,
         RelativeSource={RelativeSource AncestorType=ListView}}" />
</ItemsPanelTemplate>

The list’s ItemsTemplate :

<StackPanel Orientation="Vertical" Height="Auto" Width="Auto" VerticalAlignment="Top" >
    <ToggleButton BorderBrush="{x:Null}" Background="{x:Null}" IsChecked="{Binding Value.IsToLaunch, Mode=TwoWay}"
              Command="{Binding DataContext.UpdateGroupCheckingsCommand,
                                RelativeSource={RelativeSource FindAncestor,
                                AncestorType={x:Type UserControl}}}">
        <Grid Background="Transparent">
            <!-- Blah blah blah about the ToggleButton's content -->

        </Grid>
    </ToggleButton>

    <my:UcReleaseChooser>
        <!-- Blah blah blah about being visible if ToggleButton is Checked -->
    </my:UcReleaseChooser>
</StackPanel>

Answer 1

Try setting the verticalalignment property to Top or the VerticalContentAlignment property of the listview to Stretch

   <Style TargetType="ListView">
        <Setter Property="VerticalContentAlignment" Value="Top"/>
    </Style>

or

    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
        </Style>
    </ListView.ItemContainerStyle>