ListView ItemTemplate 网格 100% 宽度答案

【问题标题】：ListView ItemTemplate Grid 100% WidthListView ItemTemplate 网格 100% 宽度
【发布时间】：2016-02-10 03:46:55
【问题描述】：

我创建了一个 ListView ItemTemplate，我希望它能够响应（例如，当方向改变时，listView 项目的大小发生变化）。我使用 Grid 作为网格内部元素的控件，但它没有表现。 ListView.ItemContainerStyle 具有属性 HorizontalAlignment="Stretch" 这是我想要的行为，并且 ItemContainerStyle 是正确的宽度。在边框和网格内部我有相同的 HorizontalAlignment="Stretch" 并且当其中包含的 TextBox 有很多文本时它们溢出，并且当 TextBox 中的文本很少或没有文本时，Border 元素缩小到小于 ItemContainerStyle 是显示。

<ListView ItemsSource="{Binding TileStories}" x:Name="cont" Margin="0,10,0,10" Background="{StaticResource CustomResourceBrush}" BorderBrush="{StaticResource CustomResourceBrush}" Foreground="{StaticResource CustomResourceBrush}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                <Setter Property="Margin" Value="20,10,20,10" />
                <Setter Property="Foreground" Value="{StaticResource BTVioletBrush}" />
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate>
                <Border CornerRadius="20" BorderThickness="0" Width="{Binding ScrollViewerWidth}" Background="White" HorizontalAlignment="Stretch">
                    <StackPanel Height="160" Orientation="Horizontal">
                        <Grid Background="black">
                            <TextBox Text="Example">
                        </Grid>
                    </StackPanel>
                </Border>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

【问题讨论】：

这不是duplicate of this question吗？您是否尝试过设置 HorizontalContentAlignment？
修复了部分问题 - “边框”的白色背景现在表现正常，但网格（如果我删除固定宽度）应受边框宽度的约束并且溢出由于文本框而向右。
我刚刚编辑了代码以简化问题，但仍然遇到同样的错误。
你能分享一个有问题的示例最小项目吗？

标签： xaml responsive-design user-controls windows-phone-8.1

【解决方案1】：

就这样做

<ListView.ItemContainerStyle>
    <Style TargetType="ListViewItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    </Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
    <DataTemplate>
        <Grid HorizontalAlignment="Stretch">
        </Grid>
    </DataTemplate>
</ListView.ItemTemplate>

【讨论】：

【解决方案2】：

将 ItemContainerStyle 的 MinHeight 定义为 0

【讨论】：

这似乎没有任何改变
你能提供一个示例项目吗？

【解决方案3】：

添加到您的 ItemContainerStyle

            <Setter Property="HorizontalContentAlignment"
                    Value="Stretch" />

我认为Width="{Binding ScrollViewerWidth}" 不是必需的。您可以删除它。

【讨论】：

已删除，对大小没有影响

【解决方案4】：

我没有完全找到解决方案，但我确实找到了解决方法。如果我使用{Binding ActualWidth, ElementName=StackPanel, Mode=OneWay}，则网格与Width="0" 绑定，其中StackPanel 是数据模板中的面板。我在 VS2013 中对设计器进行了探索，发现 Width 为 0，因为（我假设）数据模板中的项目是一个接一个绘制的，因此在绘制第一个模板时 Width 为零，并且等等等等。我猜我没有解释得很好，但重要的是解决方案：

<PivotItem x:Name="Feed">
    ....
    <Border CornerRadius="20" BorderThickness="0" Background="White" HorizontalAlignment="Stretch">
        <StackPanel Height="160" Orientation="Horizontal">
            <Grid HorizontalAlignment="Stretch" Width="{Binding ActualWidth, ElementName=Feed, Mode=OneWay}">
            ........
            </Grid>
        </StackPanel>
    </Border>
...
</PivotItem>

我认为PivotItem 有一个非变量Width 意味着Grid 有一个具体的Width 可以继承。

【讨论】：