WIndows-10 UWP 如何在相对面板中相对于其他两个按钮放置一个按钮

Question

我正在尝试构建 Windows-10(UWP) 应用程序。我的应用程序有 4 个按钮，它们出现在屏幕底部。

按钮 1、2 和 4 处于预期位置。我想将 Button3 放在 Button2 和 Button4 之间。如何使用 UWP 中的 RelativePanel 实现这一点？
我的 xaml Button3 代码片段是

 <Button Name="BtnTextSearchLaunch" Content="Text Search" RelativePanel.AlignVerticalCenterWith="Button2" Width="60" Background="#FF291313" Height="30" RelativePanel.RightOf="Button2" >
       <Button.Template>
          <ControlTemplate>
              <Image Source="/Assets/textSearch@2x.png"/>
          </ControlTemplate>
       </Button.Template>
 </Button>

我可以通过指定 Margin="a,b,c,d" 中的位置来将 Button3 放在所需的位置，但是如果我运行手机上的应用程序。因此，我想通过 RelativePanel 实现这一点，因为这将动态扩展 UI 并让我能够在本地机器和移动设备上部署我的应用程序。

Answer 1

 <Grid HorizontalAlignment="Stretch" >
    <RelativePanel VerticalAlignment="Center" HorizontalAlignment="Stretch" >
        <Button x:Name="btn1" Content="btn1" RelativePanel.AlignLeftWithPanel="True" HorizontalAlignment="Left" />
        <Button x:Name="btn2" Content="btn2" RelativePanel.AlignHorizontalCenterWithPanel="True" HorizontalAlignment="Center" />
        <Button x:Name="btn3" Content="btn3" RelativePanel.RightOf="btn2" RelativePanel.LeftOf="btn4" HorizontalAlignment="Center" />
        <Button x:Name="btn4" Content="btn4" RelativePanel.AlignRightWithPanel="True" HorizontalAlignment="Right" />
    </RelativePanel>
</Grid>

正如您从解决方案中看到的那样，您只需要确保将按钮放置在相对于 btn2 和 btn4 的位置，并且不要忘记指定 HorizontalAlignment="Center".

WIndows-10 UWP 如何在相对面板中相对于其他两个按钮放置一个按钮

WIndows-10 UWP How to place a button relative to two other button's in Relative Panel

c#

windows-10

windows-10-mobile

windows-10-universal