.NET Maui中如何设置按钮宽度为窗口的一半？

方案1：使用Grid布局（最简洁推荐） #

利用Grid的星号布局系统直接分配比例，无需代码计算，跨平台兼容：

<!-- 按钮宽度为窗口的50% -->
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Button Text="50%宽度" Grid.Column="0" HorizontalOptions="Fill" />
</Grid>

如果需要自定义比例，比如按钮占窗口宽度的30%，可以设置列宽为0.3*和0.7*：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="0.3*" />
        <ColumnDefinition Width="0.7*" />
    </Grid.ColumnDefinitions>
    <Button Text="30%宽度" Grid.Column="0" HorizontalOptions="Fill" />
</Grid>

方案2：使用RelativeLayout绑定父容器比例 #

通过RelativeLayout的约束表达式，直接将按钮尺寸绑定到父容器的比例值：

<RelativeLayout>
    <Button Text="50%宽高"
            RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.5}"
            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.5}" />
</RelativeLayout>

Factor参数控制比例，0.5对应50%，0.7对应70%，以此类推。

方案3：代码动态计算（解决DeviceDisplay返回0的问题） #

不要在页面构造函数中获取屏幕尺寸，此时控件还未完成布局，容易返回0。建议在OnAppearing或控件Loaded事件中计算，同时要考虑屏幕密度缩放：

protected override void OnAppearing()
{
    base.OnAppearing();
    var displayInfo = DeviceDisplay.Current.MainDisplayInfo;
    // 将物理像素转换为布局逻辑像素
    var logicalWidth = displayInfo.Width / displayInfo.Density;
    myButton.WidthRequest = logicalWidth * 0.5;
}

针对Windows平台，也可以直接通过Window对象获取当前窗口宽度：

#if WINDOWS
if (Application.Current.Windows.Count > 0)
{
    var windowWidth = Application.Current.Windows[0].Width;
    myButton.WidthRequest = windowWidth * 0.5;
}
#endif

内容的提问来源于stack exchange，提问作者Wallace B. McClure