1

我正在尝试创建一个RelativePanel(用于回流目的),其中包含两个Image和一个StackPanel。在“小屏幕”视图中,我希望它垂直排列在一列中:Image, StackPanel, Image. 它这样做很好,但问题是StackPanel高度为 0,所以底部Image会撞到它。我想要Image捕捉到屏幕底部。然而,VerticalAlignment="Bottom"拒绝工作。经过多一点测试,我发现这HorizontalAlignment也不起作用。对齐在 a 中是否无法正常工作RelativePanel?或者有什么特殊的方法可以做到吗?

这是完整的 XAML:

<RelativePanel>
    <Image Width="100" x:Name="AppleImage" Source="/Assets/Images/apple.png" Margin="10" Tapped="Add_Apple" VerticalAlignment="Center"/>
    <StackPanel x:Name="TotalStackPanel" Margin="10" Orientation="Vertical" HorizontalAlignment="Center">
        <TextBlock Text="Total" Margin="10" HorizontalAlignment="Center"/>
        <GridView x:Name="TotalFruitGrid" SelectionChanged="Remove_Fruit">
            <GridView.ItemTemplate>
                <DataTemplate>
                    <Image Source="{Binding Path=image.Source}" Height="50"/>
                </DataTemplate>
            </GridView.ItemTemplate>
        </GridView>
    </StackPanel>
    <Image Width="100" x:Name="OrangeImage" Source="/Assets/Images/orange.png" Margin="10" Tapped="Add_Orange" VerticalAlignment="Bottom"/>
</RelativePanel>
4

1 回答 1

1

查看此参考以了解相关面板的各种附加属性,这将帮助您执行对齐等操作。

您可以通过这种方式进行基本的水平对齐:

<RelativePanel Background="Black">
    <Rectangle x:Name="RedRect" Width="100" Height="100" 
               RelativePanel.AlignRightWithPanel="True" 
               Fill="Red" />
    <Rectangle x:Name="BlueRect" Height="100"
               RelativePanel.AlignLeftWithPanel="True" 
               RelativePanel.AlignRightWithPanel="True" 
               Fill="Blue"
               RelativePanel.Below="RedRect"/>
    <Rectangle x:Name="YellowRect" Width="100" Height="100" 
               RelativePanel.AlignLeftWithPanel="True" 
               RelativePanel.Below="BlueRect"
               Fill="Yellow" />
</RelativePanel>

上面的代码将显示 RelativePanel 是这样的:

RelativePanel 中的对齐方式

于 2016-02-18T20:00:07.457 回答