为什么此 XAML C# 代码版本之间的 UI 输出不同？答案

【问题标题】：Why is UI output different between this XAML C# code version?为什么此 XAML C# 代码版本之间的 UI 输出不同？
【发布时间】：2020-06-05 00:02:09
【问题描述】：

我试图确定为什么以下 C# 代码不会产生与 XAML 版本相同的输出（上图是 XAML，下图是后面的代码）。所有参数都具有相同的值，并且我已经嵌套了我的堆栈布局，我不确定缺少什么来等同于两个输出。任何帮助将非常感激。谢谢！

以下是 XAML 代码：

<StackLayout VerticalOptions="StartAndExpand" HorizontalOptions="FillAndExpand" Padding="8" Spacing="12" x:Name="JitPageStackView">
    <StackLayout Orientation="Horizontal" Spacing="0">
        <StackLayout BackgroundColor="#3d4f7c" WidthRequest="50" HeightRequest="50" VerticalOptions="Start">
        </StackLayout>

        <StackLayout HorizontalOptions="FillAndExpand" Padding="0" BackgroundColor="White">
            <Frame HasShadow="True" CornerRadius="0" BackgroundColor="#ededef" Padding="6">
                <Label TextColor="Black"  Text="This is text"></Label>
            </Frame>
        </StackLayout>
    </StackLayout>
</StackLayout>

这是背后的代码：

var Description = new StackLayout { HorizontalOptions = LayoutOptions.FillAndExpand, Padding = new Thickness(6, 6, 6, 6), BackgroundColor = Color.White };
var Frame = new Frame { Content = new Label { Text = "This is a long text", TextColor = Color.Black }, BackgroundColor = Color.FromHex("ededef"), CornerRadius = 0 };
Description.Children.Add(Frame);
var Step = new StackLayout {WidthRequest = 50, HeightRequest=50, VerticalOptions=LayoutOptions.Start, BackgroundColor=Color.FromHex("3d4f7c") };
var StepDisplay = new StackLayout { Spacing = 0, Orientation = StackOrientation.Horizontal };
StepDisplay.Children.Add(Step);
StepDisplay.Children.Add(Description);
JitPageStackView.Children.Add(StepDisplay);

【问题讨论】：

标签： xaml xamarin xamarin.forms

【解决方案1】：

在 C# 版本中，您将填充设置为 StackLayout "Description" 而不是 Frame

更改它，它应该可以作为 XAML 版本使用

var Description = new StackLayout { HorizontalOptions = LayoutOptions.FillAndExpand, BackgroundColor = Color.White };
var Frame = new Frame { Content = new Label { Text = "This is a long text", TextColor = Color.Black }, BackgroundColor = Color.FromHex("ededef"), CornerRadius = 0,  Padding = new Thickness(6, 6, 6, 6) };
Description.Children.Add(Frame);

var Step = new StackLayout {WidthRequest = 50, HeightRequest=50, VerticalOptions=LayoutOptions.Start, BackgroundColor=Color.FromHex("3d4f7c") };

var StepDisplay = new StackLayout { Spacing = 0, Orientation = StackOrientation.Horizontal };

StepDisplay.Children.Add(Step);
StepDisplay.Children.Add(Description);
JitPageStackView.Children.Add(StepDisplay);

希望这会有所帮助。-

【讨论】：

非常感谢！