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

Question

如果只将一张图像添加到我的视图绑定到的数据库中，我的 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>

Answer 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>

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

Second image overlapping the bottom of the first image in a listbox c#

c#

xaml

listbox

windows-phone-8