使用相对面板与面板中心右对齐

Question

我想将控制权与面板中心对齐，我该怎么做？

使用列定义不起作用。

相对面板错误："中间拆分器"名称在当前上下文中不存在

<Grid x:Name="LayoutRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition x:Name="MiddleSplitter"/> <!--get middle?-->
</Grid.ColumnDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState>
<VisualState.StateTriggers>
<StateTrigger IsActive="True"/> <!--just for test-->
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="AppListBox.(RelativePanel.AlignRightWith)" Value="MiddleSplitter"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ScrollViewer Grid.ColumnSpan="2">
<RelativePanel Margin="5">
<ListBox Name="AppListBox" Height="150" Margin="5"/>
</RelativePanel>
</ScrollViewer>
</Grid>

我必须使用RelativePanel，这被简化为仅显示有此问题的控件(AppListBox(，我不想使用其他类型的面板。

Answer 1

一个简单的解决方法是在RelativePanel中添加一个真正的MiddleSplitter，而不是依赖它之外的东西。

您可以创建一个超轻量级Line元素，禁用其命中测试并隐藏它。您将希望它通过设置为RelativePanel.AlignHorizontalCenterWithPanelTrue.我MiddleSplitter称它为同名，所以不要忘记从您的ColumnDefinition中删除该名称。

<ScrollViewer Grid.ColumnSpan="2">
<RelativePanel Margin="5">
<Line x:Name="MiddleSplitter" IsHitTestVisible="False" Opacity="0" RelativePanel.AlignHorizontalCenterWithPanel="True" />
<ListBox Name="AppListBox" Height="150" Margin="5"/>
</RelativePanel>
</ScrollViewer>

Answer 2

AlignRightWith="name"只有在控件位于RelativePanel内时name才会起作用。所以在您的情况下，您不能使用AlignRightWith="MiddleSplitter"

据我了解您的代码，您希望在两个不同的列中包含内容，但您希望一次滚动两列。为此，您可以按照以下代码示例进行操作

<ScrollViewer>
<Grid x:Name="LayoutRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<RelativePanel Margin="5" Grid.Column="1">
....
</RelativePanel>
<RelativePanel Margin="5" Grid.Column="2">
<TextBlock Text="My Text" Name="AppListBox" Height="150" Margin="5"/>
....
</RelativePanel>
</Grid>
</ScrollViewer>