第二张图片与列表框中第一张图片的底部重叠#答案

【问题标题】：Second image overlapping the bottom of the first image in a listbox c#第二张图片与列表框中第一张图片的底部重叠#
【发布时间】：2015-06-30 05:09:28
【问题描述】：

如果仅将一张图像添加到我的视图绑定到的数据库中，我的 WP8 应用程序将显示整个图像。如果我将另一个图像添加到数据库中，它将显示两个图像，但第二个图像与第一个图像的底部重叠。有没有办法在它们之间添加一个间隙，这样就不会发生这种情况？

这里是 xaml：

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <ListBox x:Name="MainLongListSelector" Margin="0,0,-12,0" ItemsSource="{Binding Images}" SelectionChanged="MainLongListSelector_SelectionChanged">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="14,5,4,10">
                        <!--<Image Width="200" Source="HappyDragon.jpg"/>-->

                        <!--<Image x:Name="OutputImage" />-->
                        <Image x:Name="img" Source="{Binding ImageData, Converter={StaticResource ImageConverter}}"
                               MaxWidth="250" MaxHeight="300" Margin="10,10,0,10" RenderTransformOrigin="0.5,0.5">
                            <Image.RenderTransform>
                                <RotateTransform x:Name="ImageRotate" Angle="90" />
                            </Image.RenderTransform>
                        </Image>

                    </Grid>

                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
</Grid>

【问题讨论】：

尝试将数据模板中网格的上边距从 5 增加到 15 或 20。

标签： c# xaml windows-phone-8 listbox

【解决方案1】：

试试这个，

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <ListBox x:Name="MainLongListSelector" Height="300" Margin="0,0,-12,0" ItemsSource="{Binding Images}" SelectionChanged="MainLongListSelector_SelectionChanged">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid Margin="14,5,4,10">
                    <!--<Image Width="200" Source="HappyDragon.jpg"/>-->

                    <!--<Image x:Name="OutputImage" />-->
                    <Image x:Name="img" Source="{Binding ImageData, Converter={StaticResource ImageConverter}}"
                           MaxWidth="250" MaxHeight="300" Margin="10,30,0,20" RenderTransformOrigin="0.5,0.5">
                        <Image.RenderTransform>
                            <RotateTransform x:Name="ImageRotate" Angle="90" />
                        </Image.RenderTransform>
                    </Image>

                </Grid>

            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

【讨论】：