Xamarin窗体Label / StackLayout轮换问题

Question

我想在xamarin形式旋转一些标签，但也存在一些问题。如果我旋转单个标签的文本将修剪和只会有一些信件可见，我的推杆一stacklayout内的每个标签和我旋转stacklayout本身-90度为下面的代码

<StackLayout Spacing="0"
             Rotation="-90"
             VerticalOptions="Start"
             HorizontalOptions="End">
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
        <Label Text="ABCDE" TextColor="Black"/>
    </StackLayout>

将标签正确地旋转，没有文本会被修剪。问题是现在的stacklayout的VerticalOptions或HorizontaOptions不能正常工作。当我设置VerticalOption“开始”，它会显示从上一切不是在顶部，但不知25％。该HorizontalOptions还有另一个问题，当我将其设置为“启动”或“结束”像下面的图片：

任何人都可以请帮助如何解决这个问题，或者是否有这样做的更好的办法？提前致谢

Answer 1

我同意卢卡斯的答案，使用的利润率是一个有效的解决方案。

也许你应该考虑RelativeLayout？甲RelativeLayout的可用于定位屏幕上的观点，相对于整体布局或其他视图。

注意：由于的方式定义的约束，可以使更多复杂的布局在C＃不是可以用XAML来指定。

一些有用的链接

• RelativeLayout的文档：https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/relative-layout
• 示例应用程序：https://developer.xamarin.com/samples/xamarin-forms/UserInterface/Layout/
• 复杂的示例应用程序：https://developer.xamarin.com/samples/xamarin-forms/UserInterface/BusinessTumble/

这里是我扔在一起使用XAML样本。

<RelativeLayout>
    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=-30}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=25}" 
        BackgroundColor="Green" 
        Rotation="-90"
        Text="Hello World" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=-10}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=25}" 
        BackgroundColor="Blue" 
        Rotation="-90"
        Text="Hello World" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=10}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=25}" 
        BackgroundColor="Red" 
        Rotation="-90"
        Text="Hello World" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=55}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=18}" 
        BackgroundColor="Green" 
        Rotation="-90"
        Text="123456" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=75}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=120}" 
        BackgroundColor="Green" 
        Rotation="-180"
        Text="ABC DEF GHI" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=120}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Green" 
        Rotation="45"
        Text="JKL MNO PQR" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=320}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Green" 
        Rotation="-270"
        Text="Aa Bb Cc Dd" 
        TextColor="White"
        />

    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=0}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Blue" 
        Rotation="-90"
        Text="Aa Bb Cc Dd" 
        TextColor="White"
        />
    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=0}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Green" 
        Rotation="-70"
        Text="Aa Bb Cc Dd" 
        TextColor="White"
        />
    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=0}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Blue" 
        Rotation="-50"
        Text="Aa Bb Cc Dd" 
        TextColor="White"
        />
    <Label 
        RelativeLayout.XConstraint="{ConstraintExpression Type=Constant,Property=X, Factor=0, Constant=0}" 
        RelativeLayout.YConstraint="{ConstraintExpression Type=Constant,Property=Y, Factor=0, Constant=200}" 
        BackgroundColor="Green" 
        Rotation="-30"
        Text="Aa Bb Cc Dd" 
        TextColor="White"
        />
</RelativeLayout>

Answer 2

原因：

当您设置Rotation，它将围绕itself.So的中心旋转就会在屏幕的顶部一些“空间”。

解决方法：

您可以设置StackLayout的保证金。

<StackLayout Spacing="0"
             Rotation="-90"
             Margin="0,-130,0,0"
             VerticalOptions="Start"
             HorizontalOptions="Center">
        ...
</StackLayout>

而结果就像下面的图片。