WPF C#如何设置按钮宽度为窗口大小的三分之一

WPF没有直接类似CSS的width:33%的属性写法，但有两种常用方案可以实现同等效果：

方案1：使用Grid的星号（*）单位（最推荐） #

WPF的Grid布局原生支持星号单位，会按比例分配父容器的可用空间，是实现百分比宽度最简单的方式。你可以把按钮放在Grid容器内，调整代码如下：

<Grid Margin="58,342,0,0"> <!-- 把原按钮的外边距移到Grid上，避免影响宽度计算 -->
    <Grid.ColumnDefinitions>
        <!-- 第一列宽度占总宽度的33%，剩下的67%自动留空 -->
        <ColumnDefinition Width="0.33*"/>
        <ColumnDefinition Width="0.67*"/>
    </Grid.ColumnDefinitions>
    <Button x:Name="btnWebsite" Content="Button" 
            VerticalAlignment="Top" Height="43" 
            HorizontalAlignment="Stretch"/> <!-- 去掉原Left对齐，设为拉伸占满整列宽度 -->
</Grid>

小提示：如果需要3个等宽按钮，只需要定义3个Width="1*"的列，系统会自动给每列分配33.33%的宽度。

方案2：使用自定义值转换器（适合不想修改布局结构的场景） #

如果你不想调整现有布局嵌套结构，可以自己实现一个百分比转宽度的转换器，绑定父容器宽度计算按钮宽度：

1. 先实现转换器的C#代码：

public class PercentageToWidthConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is double parentWidth && double.TryParse(parameter?.ToString(), out double percentage))
        {
            return parentWidth * percentage / 100;
        }
        return double.NaN;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

2. 在XAML中引用转换器：

<Window.Resources>
    <local:PercentageToWidthConverter x:Key="WidthConverter"/>
</Window.Resources>

3. 调整按钮的宽度绑定逻辑：

<Button x:Name="btnWebsite" Content="Button" 
        HorizontalAlignment="Left" Margin="58,342,0,0" 
        VerticalAlignment="Top" Height="43" 
        Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type Panel}}, 
        Converter={StaticResource WidthConverter}, ConverterParameter=33}"/>

注意：该方案要求按钮的父容器宽度为固定值或者自适应到窗口宽度，不能设为Auto，否则无法获取到正确的父容器宽度。

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