如何为Windows 10 UWP及WP8.1项目中GridView项（文本块）设置动态宽度？

嘿，我刚好在做UWP和Windows Phone 8.1项目时碰到过一模一样的GridView标签宽度问题，太懂你这种长标签被截断的烦躁了！给你几个亲测有效的解决方案：

默认情况下，GridView的ItemsPanel用的是ItemsWrapGrid，这个控件会自动让所有条目保持统一宽度——它会根据第一个条目的宽度来设置全局宽度，所以短标签没问题，长标签就会被硬生生截断。要解决这个问题，核心就是换掉这个默认的面板。

UWP里可以用微软官方的WrapPanel控件，它能自动根据每个条目的内容宽度调整尺寸，不会强制统一宽度。

步骤如下：

1. 先通过NuGet安装Microsoft.UI.Xaml.Controls包；
2. 在XAML页面里添加命名空间引用：

xmlns:controls="using:Microsoft.UI.Xaml.Controls"

3. 修改GridView的ItemsPanel模板：

<GridView x:Name="TagGridView" Margin="12">
    <!-- 替换ItemPanel为WrapPanel -->
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <controls:WrapPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <!-- 你的标签ItemTemplate -->
    <GridView.ItemTemplate>
        <DataTemplate>
            <Border Background="#F0F0F0" CornerRadius="16" Padding="12,6" Margin="4">
                <TextBlock Text="{Binding TagContent}" 
                           TextWrapping="NoWrap" 
                           Foreground="#333333" />
            </Border>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

这样设置后，每个标签都会根据自身文本长度自动调整宽度，长标签也能完整显示。

Windows Phone 8.1里没有内置的WrapPanel，但可以通过Windows Phone Toolkit来获取：

1. 安装Windows Phone Toolkit NuGet包；
2. 添加命名空间引用：

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

3. 同样替换GridView的ItemsPanel：

<GridView x:Name="TagGridView">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <toolkit:WrapPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <!-- 你的ItemTemplate -->
</GridView>

如果不想依赖第三方控件，也可以手动计算每个标签的文本宽度，然后动态设置Item的宽度，但这种方式比较繁琐，不如用WrapPanel省心。

• 确保你的ItemTemplate里的TextBlock不要设置固定宽度（默认就是Width="Auto"），让它自动适应文本长度；
• 如果你希望标签保持单行显示，给TextBlock加上TextWrapping="NoWrap"，避免文本换行；
• UWP用户如果用的是较新的SDK，也可以考虑用ItemsRepeater配合WrapLayout，不过WrapPanel的实现成本更低，更适合快速解决问题。

内容的提问来源于stack exchange，提问作者esdoodle