Xamarin Forms - 内容未在 stackLayout 中垂直居中对齐

Posted 2023-02-26

【中文标题】Xamarin Forms - 内容未在 stackLayout 中垂直居中对齐

【英文标题】：Xamarin Forms - Content is not getting vertically center aligned in the stackLayout

【发布时间】：2018-10-10 14:28:30

【问题描述】：

我正在尝试在 Xamarin 表单中创建自定义控件以显示警报消息。

在少数情况下，内容会垂直居中对齐，但在少数情况下会溢出框架。

能否请您告诉我需要进行哪些更改才能使内容始终垂直居中并且内容的大小会扩大。

        _alertLayout = new StackLayout
        
            Orientation = StackOrientation.Horizontal,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            VerticalOptions = LayoutOptions.FillAndExpand
        ;

        _alertLayoutHighlighter = new StackLayout
        
            HorizontalOptions = LayoutOptions.FillAndExpand,
            VerticalOptions = LayoutOptions.FillAndExpand,
            BackgroundColor = Constants.MMSGAlertBackgroundColor,
            Padding = 0,
            WidthRequest = 8
        ;

        _alertBoxView = new BoxView
        
            Color = Constants.MMSGAlertTextColor,
            VerticalOptions = LayoutOptions.FillAndExpand
        ;

        _alertLayoutHighlighter.Children.Add(_alertBoxView);

        _alertLayoutContent = new StackLayout
        
            Orientation = StackOrientation.Vertical,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            VerticalOptions = LayoutOptions.FillAndExpand,
            Padding = new Thickness(16)
        ;

        _alertMessage = new Label
        
            TextColor = Constants.MMSGAlertTextColor,
            FontSize = 12
        ;

        _alertLayoutContent.Children.Add(_alertMessage);

        _alertLayout.Children.Add(_alertLayoutHighlighter);
        _alertLayout.Children.Add(_alertLayoutContent);

        _frame = new Frame
        
            OutlineColor = Constants.MMSGAlertBorderColor,
            BackgroundColor = Constants.MMSGAlertBackgroundColor,
            Padding = new Thickness(2, 2, 0, 2),
            HasShadow = false,
            Content = _alertLayout,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            VerticalOptions = LayoutOptions.FillAndExpand
        ;

        this.Content = _frame;

【问题讨论】：

红色的是自定义控件AlertView？屏幕截图未显示其未垂直居中对齐。我注意到你没有在任何地方设置VerticalOptions = "Center" 或"CenterAndExpand"。我认为您必须在调用 AlertView 的页面中执行此操作

然后使用Label的VerticalTextAlignment来居中！或者使用该标签的 VerticalOptions 来居中。

【参考方案1】：

您应该将标签的垂直选项调整为 Center 或 CenterAndExpand：

 _alertMessage = new Label
        
            VerticalOptions="Center"
            TextColor = Constants.MMSGAlertTextColor,
            FontSize = 12
        ;