xaml - Wp8 xaml 设计

Question

我对列表框中的第一个元素有疑问，其中的排列正在更改。这是代码：

<Grid x:Name="ContentPanel" Margin="12,10,0,0" Grid.RowSpan="2" Grid.ColumnSpan="2">
        <ListBox Margin="10,233,10,0" BorderBrush="White" Hold="ListBox1_Hold" SelectionChanged="ListBox1_SelectionChanged" Height="516"  x:Name="ListBox1" VerticalAlignment="Top">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Width="500" Orientation="Vertical" >
                        <Image Margin="10,30,0,0"  HorizontalAlignment="Left" Height="100" Width="150" Source="{Binding Img}" ></Image> 

                        <TextBlock Visibility="Collapsed" Text="ID: "/>
                        <TextBlock Visibility="Collapsed" Text="{Binding Id}"/>

                        <TextBlock Visibility="Collapsed" FontSize="30" Text="Place Name: "/>
                        <TextBlock Margin="160,-110,0,0"  HorizontalAlignment="Left" Foreground="Blue" FontSize="30" Text="{Binding PlaceName}"/>

                        <TextBlock Visibility="Collapsed" Text="Description: "/>
                        <TextBlock Margin="160,-80,0,0"  HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Description}" />

                        <TextBlock Visibility="Collapsed" Text="Keyword: "/>
                        <TextBlock Visibility="Collapsed" Text="{Binding Keyword}"/>

                        <TextBlock Visibility="Collapsed" Text="Longitude: "/>
                        <TextBlock Visibility="Collapsed" Text="{Binding Long}"/>

                        <TextBlock Visibility="Collapsed" Text="Latitude: "/>
                        <TextBlock Visibility="Collapsed" Text="{Binding Latit}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

这里是这段代码的结果：

图片

Answer 1

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="200" />
    </Grid.ColumnDefinitions>

    // First block
   <grid grid.colum="0" grid.row="0" grid.rowspan="2"><image></grid>
   <grid grid.colum="1" grid.row="0" ><textblock></grid>
   <grid grid.colum="1" grid.row="1" ><textblock></grid>

    // Seconde block
   <grid grid.colum="0" grid.row="1" grid.rowspan="2"><image></grid>
   <grid grid.colum="1" grid.row="2" ><textblock></grid>
   <grid grid.colum="1" grid.row="3" ><textblock></grid>

   // third block
   <grid grid.colum="0" grid.row="2" grid.rowspan="2"><image></grid>
   <grid grid.colum="1" grid.row="4" ><textblock></grid>
   <grid grid.colum="1" grid.row="5" ><textblock></grid>

</Grid>