Question

我有两个标签彼此相邻。第一个很长，如果需要应该被截断。第二个应该完全显示 - 无论如何。

这是我的代码：

MainPage = new ContentPage {
    Content = new StackLayout {
        Orientation = StackOrientation.Horizontal,
        VerticalOptions = LayoutOptions.CenterAndExpand,
        BackgroundColor = Color.Orange,
        Padding = 10,
        Children = {
            new Label {
                Text = "The answer to life the universe and everything",
                HorizontalOptions = LayoutOptions.Start,
                LineBreakMode = LineBreakMode.TailTruncation,
                BackgroundColor = Color.Yellow,
            },
            new Label {
                Text = "42",
                HorizontalOptions = LayoutOptions.EndAndExpand,
                LineBreakMode = LineBreakMode.NoWrap,
                BackgroundColor = Color.Yellow,
            },
        },
    },
};

这就是我得到的：

我的问题：我该如何预防＆＃34; 42＆＃34;从被切断？

当前结果的说明：我想我知道，为什么第二个标签太小了。在第一个文本被截断之前，两个标签的大小是协商。因此，两个标签都需要缩小一点，尽管第一个标签可以更好地处理它。

想法1：我尝试了相对布局（而不是堆栈布局）。但是，这是一个相当复杂的方法，我在iOS和Android上获得了不同的结果。所以我希望能有一个更简单的解决办法。

创意2：我应该覆盖其中一种布局或大小协商方法吗？也许＆＃34; 42＆＃34;布局可以强制实现所需的宽度。

创意3：也许我们可以为iOS和Android提供自定义标签渲染器，以便按预期处理尺寸协商。

更新

＆＃34; 42＆＃34;只是一个例子。在我的最终应用程序中，这将动态更改，并且可以是不同长度的字符串。因此，在不知道渲染字符串的宽度的情况下设置MinimumWidthRequest并不会有帮助。

Answer 1

如何防止“42”被切断？

您可以在“42”MinimumWidthRequest中设置Label，以防止它被切断。

有关MinimumWidthRequest的详细信息，请参阅document的评论部分。

代码示例：

MainPage = new ContentPage {
    Content = new StackLayout {
        Orientation = StackOrientation.Horizontal,
        VerticalOptions = LayoutOptions.CenterAndExpand,
        BackgroundColor = Color.Orange,
        Padding = 10,
        Children = {
           new Label {
              Text = "The answer to life the universe and everything The answer to life the universe and everything",
              HorizontalOptions = LayoutOptions.Start,
              LineBreakMode = LineBreakMode.TailTruncation,
              BackgroundColor = Color.Yellow,
           },
           new Label {
              MinimumWidthRequest = 50,
              Text = "42",
              HorizontalOptions = LayoutOptions.EndAndExpand,
              LineBreakMode = LineBreakMode.NoWrap,
              BackgroundColor = Color.Yellow,
           },
       },
    },
};

结果如下：

Answer 2

您可以在此使用Grid代替StackLayout。这将解决您的问题。

网格：

var grid = new Grid();
grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Auto });
grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) });
grid.ColumnDefinitions.Add(new ColumnDefinition { Width = GridLength.Auto });

Answer 3

只需在Xamarin.Forms 3.4或更高版本中尝试Label的“ MaxLines”属性来设置逐行限制。而且，这是一个可绑定的属性

如何防止堆栈布局表单中的标签被切断

3 个答案: