LongListMultiSelector数据模板延伸到屏幕外宽度 - Windows Phone 8

Question

我在我的应用程序中使用了以下的数据透视控件

<phone:PivotItem Header="{Binding Path=LocalizedResources.requests_title, Source={StaticResource LocalizedStrings}}" >
    <Grid Margin="0,-12,0,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0" >
            <TextBlock FontWeight="Bold" 
                           TextDecorations="Underline" 
                           VerticalAlignment="Top"
                           TextWrapping="NoWrap"
                           FontSize="{StaticResource PhoneFontSizeMediumLarge}"
                           Foreground="{StaticResource PhoneAccentBrush}"
                           toolkit:TurnstileFeatherEffect.FeatheringIndex="1"/>

            <toolkit:PhoneTextBox AcceptsReturn="False" 
                                      TextWrapping="NoWrap" 
                                      Visibility="Collapsed" 
                                      TextChanged="SearchBox_TextChanged" 
                                      toolkit:TurnstileFeatherEffect.FeatheringIndex="1"/>

        </StackPanel>

        <toolkit:LongListMultiSelector Grid.Row="1"
                                           ItemsSource="{Binding Details_OC}" 
                                           SelectionChanged="Requests_SelectionChanged"
                                           toolkit:TurnstileFeatherEffect.FeatheringIndex="1"
                                           HorizontalAlignment="Stretch"
                                           VerticalAlignment="Stretch"
                                           Margin="0,0,24,0">
            <toolkit:LongListMultiSelector.ItemTemplate>
                <DataTemplate>
                    <Border BorderThickness="0.25" BorderBrush="{StaticResource PhoneAccentBrush}">
                        <Grid Background="{StaticResource TransparentBrush}" HorizontalAlignment="Stretch" >
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="auto" />
                            </Grid.ColumnDefinitions>

                            <StackPanel Orientation="Horizontal"
                                            Grid.Row="0"
                                            Grid.Column="0" 
                                            HorizontalAlignment="Left" 
                                            VerticalAlignment="Top" >

                                <TextBlock Text="#" FontSize="{StaticResource PhoneFontSizeLarge}" />
                                <TextBlock x:Name="ID" 
                                               Text="{Binding ID}" 
                                               FontSize="{StaticResource PhoneFontSizeLarge}" 
                                               TextWrapping="NoWrap"/>
                            </StackPanel>

                            <TextBlock x:Name="date" 
                                           Text="{Binding Path=TIME, Converter={StaticResource dateConverter}}" 
                                           Grid.Row="0"
                                           Grid.Column="1" 
                                           HorizontalAlignment="Right" 
                                           VerticalAlignment="Top" 
                                           FontSize="{StaticResource PhoneFontSizeSmall}" 
                                           TextWrapping="NoWrap"/>

                        </Grid>
                    </Border>
                </DataTemplate>
            </toolkit:LongListMultiSelector.ItemTemplate>

        </toolkit:LongListMultiSelector>

    </Grid>
</phone:PivotItem>

---

结果如下

您可以看到Textblock日期没有完全显示。我无法找到这种意外行为的原因。请帮忙。

谢谢。

Answer 1

问题似乎在于列的大小调整。请参阅<toolkit:LongListMultiSelector.ItemTemplate>：

中的以下内容

<Grid.ColumnDefinitions>
  <ColumnDefinition Width="*" />
  <ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>

在这种情况下，我会给第一列一个静态宽度，然后第二列可以填充剩余空间。像这样：

<Grid.ColumnDefinitions>
  <ColumnDefinition Width="200" />
  <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>

或者，您可能希望查看LongListMultiSelector的 ItemInfoTemplate 属性。

它使您能够在最右侧显示第二列，当它们变为活动状态时，它们不会被复选框压扁。

可以找到一个示例here。