Xamarin 表单标签/StackLayout 旋转问题

debugcn 发表于 Dev

埃尔容

我正在尝试以 xamarin 形式旋转一些标签，但存在一些问题。如果我旋转单个标签，文本将被修剪并且只有一些字母可见，我将每个标签放在一个堆栈布局中，并将堆栈布局本身旋转 -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>

标签正确旋转，没有文本被修剪。问题是现在的VerticalOptions或HorizontaOptions将stacklayout都不能正常工作。当我将设置VerticalOption为“开始”时，它将显示所有内容不在顶部，而是以某种方式从顶部显示 25%。HorizontalOptions当我将其设置为“开始”或“结束”时，还有另一个问题，如下图所示：

Can anyone please help how to solve this issue, or if there is a better way of doing this? Thanks in advance

Matthew Regul

I agree with Lucas's answer, using margins is a valid solution.

Perhaps you should look into RelativeLayout? A RelativeLayout can be used to position views on screen, relative to the overall layout or to other views.

Note: Because of the way constraints are defined, it is possible to make more complex layouts in C# than can be specified with XAML.

Some useful links

RelativeLayout Docs: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/relative-layout
Sample App: 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>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。

编辑于2021-07-23

我来说两句

0条评论

登录后参与评论

来自分类Dev

Related 相关文章

文章

Xamarin 表单标签/StackLayout 旋转问题

Xamarin 表单标签/StackLayout 旋转问题

使用DataBinding Xamarin表单旋转标签

Xamarin表单中的导航问题

Xamarin 表单 Google 登录问题

Xamarin android oxyplot有设备旋转和轴问题

Xamarin.Forms-StackLayout标签超出设备宽度

Xamarin表单-登录后重定向问题

Xamarin表单：使用内容视图的问题

Xamarin 表单图像/嵌入图像问题

Xamarin在框架内的表单标签未显示

Xamarin Stacklayout未填充

BindablePicker的SelectedItem在MvvmCross + xamarin表单中的Bindable stackLayout内不起作用

在Xamarin.Android上旋转屏幕/更改标签时如何保存选定的标签？

Rails表单标签大写问题

Xamarin表单选取器控件问题（android，appcompat）

Xamarin表单中的自定义通用OnPlatform问题

在 Xamarin 表单中显示来自 .aar 文件的视图的问题 android

xamarin 表单：创建 IPA 文件时出现问题

基于 Sqlite 的复杂类中的 Xamarin 表单创建表问题

Django表单未提交 - 表单标签问题

ScrollView中的Xamarin Center StackLayout

Xamarin Xaml StackLayout在地图上

旋转拖影（Xamarin，Android）

Xamarin表单将属性绑定到标签的文本

Xamarin 表单绑定标签获取和设置

Xamarin 表单：如何从视图模型更改标签文本值？

Xamarin 表单中列表视图的粘性标签（标题）

如何在 Xamarin 表单的标签上使用 textcolor？

r中的条形图标签：使用text（）显示旋转标签的问题

Xamarin ListView高度问题