MAUI中如何将View宽度约束为高度？iOS适配问题求助

问题分析 #

iOS中在OnSizeAllocated里获取Border的Height为-1，是因为页面尺寸变化时控件尚未完成布局，实际测量值还未生成。此时应该监听控件自身的尺寸变化事件，或者使用绑定直接关联实际高度与宽度。

解决方案一：使用SizeChanged事件 #

XAML代码 #

<Grid VerticalOptions="Fill">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Border x:Name="myBorder" Grid.Column="0" VerticalOptions="Fill" SizeChanged="MyBorder_SizeChanged" />
    <Grid Grid.Column="1" />
</Grid>

后台代码 #

private void MyBorder_SizeChanged(object sender, EventArgs e)
{
    if (sender is Border border && border.ActualHeight > 0)
    {
        border.WidthRequest = border.ActualHeight;
    }
}

解决方案二：纯XAML绑定实现 #

直接将Border的WidthRequest绑定到自身的ActualHeight，无需后台代码：

<Grid VerticalOptions="Fill">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Border Grid.Column="0" VerticalOptions="Fill"
            WidthRequest="{Binding ActualHeight, RelativeSource={RelativeSource Self}}" />
    <Grid Grid.Column="1" />
</Grid>

说明 #

• VerticalOptions="Fill"确保Border占满所在行的垂直可用空间
• 第一列Width="Auto"会自动适应Border的宽度（即等于其高度），第二列Width="*"占据剩余水平空间
• 两种方案都能在Android和iOS上正常工作，避免了iOS中布局时机导致的测量值未就绪问题

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