xaml - 电话 8 XAML : Horizontal Alignment in LongListSelector

Question

我有一个很长的列表选择器。

我要做的就是对齐 ItemTemplate 中的两个元素: 1. 右边的按钮具有给定的固定宽度 2. 左侧的文本面板填充了显示屏的剩余空间。 但不幸的是，文本面板没有被拉伸(stretch)，按钮与文本面板文本的右端对齐。 :(

这是我的代码:

<DataTemplate x:Key="AddrBookItemTemplate">
  <StackPanel Orientation="Horizontal" Name="DummerContainer" HorizontalAlignment="Stretch">
    <TextBlock FontWeight="Bold" Text="{Binding Name}" HorizontalAlignment="Stretch"/>
    <Button HorizontalAlignment="Right" Width="120"/>
  </StackPanel>
</DataTemplate>

和

<phone:LongListSelector
      HorizontalAlignment="Stretch"
      x:Name="AddrBook"
      JumpListStyle="{StaticResource AddrBookJumpListStyle}"
      Background="Transparent"
      GroupHeaderTemplate="{StaticResource AddrBookGroupHeaderTemplate}"
      ItemTemplate="{StaticResource AddrBookItemTemplate}"
      LayoutMode="List"
      IsGroupingEnabled="true"
      HideEmptyGroups ="true"/>

那么，这是我的问题:如何正确对齐这两个元素？

Answer 1

这是使用水平 StackPanel 的结果......

在您的 DataTemplate 中使用 Grid 而不是 StackPanel。然后您可以定义 ColumnDefinitions 以根据需要分配空间，即:

• 将第 0 列定义为 Width="*" 并将您的 TextBlock 放入其中
• 将第 1 列定义为 Width="Auto"，将您的 Button 放入其中。