Search code examples
c#windows-phone-7listboxvertical-alignmentlonglistselector

Vertical align listbox to bottom


I need to layout my listbox like on this picture

enter image description here

I have tried everything to do that both for listbox and longlistselector..

 <ListBox WP7Panels:DockPanel.Dock="Bottom" Name="MsgControlsList" 
                              ItemsSource="{Binding}" 
                              Height="600" 
                              HorizontalContentAlignment="Stretch"
                              VerticalAlignment="Bottom" VerticalContentAlignment="Bottom">
            <ListBox.Style>
                <Style TargetType="ListBox">
                    <Setter Property="VerticalAlignment"
            Value="Bottom" />
                    <Setter Property="VerticalContentAlignment"
            Value="Bottom" />
                </Style>
            </ListBox.Style>
            <ListBox.ItemTemplate>
            <DataTemplate>
                    <WP7Panels:DockPanel LastChildFill="True">
                        <HistoryClasses:HistoryElementTemplate WP7Panels:DockPanel.Dock="Bottom"  VerticalAlignment="Bottom" DataContext="{Binding}" HorizontalContentAlignment="Stretch"/>
                    </WP7Panels:DockPanel>
                </DataTemplate>
        </ListBox.ItemTemplate>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <toolkit:WrapPanel/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
    </ListBox>
    </WP7Panels:DockPanel>    

..but still I have top vertical alignment of the listbox.

enter image description here

Any thoughts, please?


Solution

  • If you don't set the height of your listbox the items are on the bottom of the screen.

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="600"/>
            <RowDefinition Height="Auto"/>
         </Grid.RowDefinitions>
    
         <TextBlock Text="Test"/>
    
         <ListBox Grid.Row="1"  VerticalAlignment="Bottom">
              <ListBox.ItemTemplate>
                   <DataTemplate>
                        <TextBlock Text="Item"/>
                   </DataTemplate>
               </ListBox.ItemTemplate>
          </ListBox>
    
          <TextBlock Grid.Row="2" Text="Test"/>
    
      </Grid>