Xamarin.Forms。 檢測文本重疊

Question

早上好

如果標簽的文本高於容器，我正在努力檢測。 我試圖找到一些已經完成的解決方案，但找不到任何東西。 在我開始在后面的代碼中實現一些運行時解決方案之前，我決定問你我是否遺漏了一些知識。

我有和 CarouselView 哪個自定義 DataTemplate 如下：

                      <Frame BorderColor="DarkGray"
                       CornerRadius="9"
                       HorizontalOptions="Center"
                       VerticalOptions="CenterAndExpand">
                            <StackLayout>
                                <Label Text="{Binding Feed.Title}" 
                                       TextColor="Black" 
                                       FontSize="Title" 
                                       HorizontalTextAlignment="Center"/>
                                <Image MinimumHeightRequest="200"
                                       MinimumWidthRequest="200">
                                    <Image.Source>
                                        <UriImageSource CachingEnabled="true"
                                                        Uri="{Binding Feed.ImageSource.AbsoluteUri}"
                                                        CacheValidity="1"/>
                                    </Image.Source>
                                </Image>
                                <Label 
                                                        Text="{Binding Feed.Description}" 
                                                        TextColor="Gray"
                                                        FontSize="Subtitle"/>
                            </StackLayout>
                        </Frame>
                    </DataTemplate>

當第二個標簽的文本很大時，它會在父視圖中下沉，如圖所示：

作為解決方案，我想刪除未剪切/不可見的文本並添加三個點。 是否有任何已完成的解決方案，或者我應該嘗試進行運行時高度測量？

謝謝！

Answer 1

聽起來它沒有正確確定可用高度。

如果使用Grid而不是StackLayout會更好嗎？

<Grid RowDefinitions="Auto,Auto,*">
    <Label Grid.Row="0" ... />
    <Image Grid.Row="1" ... />
    <Label Grid.Row="2" LineBreakMode="TailTruncation" ... />
</Grid>

注意第 2 行使用* 。這應該告訴 Xamarin 布局准確使用剩余高度。

省略號為“TailTruncation”。

---

另外，我很好奇如果您刪除周圍的<Frame>是否效果更好。 如果沒有它確實可以更好地工作，那么它是嵌套布局中的一個錯誤。

Answer 2

一種簡單的方法是創建一個自定義控件來顯示確定的行數並在您不想顯示隱藏的文本時顯示三個點。

Xaml：

 <ContentView.Content>
    <StackLayout>
        <Label x:Name="LabelContent" MaxLines="4"></Label>
        <Label Text="..."></Label>
    </StackLayout>
</ContentView.Content>

代碼隱藏：

public partial class CustomControl1 : ContentView
{

    public CustomControl1()
    {
        InitializeComponent();

    }

    private string _text;
    public string Text
    {
        get { return _text; }
        set
        {
            _text = value;
            OnPropertyChanged();
        }
    }
    public static readonly BindableProperty TextProperty = BindableProperty.Create(
             nameof(Text),
             typeof(string),
             typeof(CustomControl1),
             string.Empty,
             propertyChanged: (bindable, oldValue, newValue) =>
             {
                 var control = bindable as CustomControl1;
                 //var changingFrom = oldValue as string;
                 //var changingTo = newValue as string;
                 control.LabelContent.Text = newValue.ToString();
             });
}

用法：

 <CarouselView ItemsSource="{Binding feeds}">
        <CarouselView.ItemTemplate>
            <DataTemplate>
                <Frame BorderColor="DarkGray"
                   CornerRadius="9"
                   HorizontalOptions="Center"
                   VerticalOptions="CenterAndExpand">
                    <StackLayout>
                        <Label Text="{Binding Title}" 
                                   TextColor="Black" 
                                   FontSize="Title" 
                                   HorizontalTextAlignment="Center"/>
                        <Image MinimumHeightRequest="200" Source="{Binding  ImageSource}"
                                   MinimumWidthRequest="200">

                        </Image>
                        <local:CustomControl1 Text="{Binding Description}"/>
                    </StackLayout>
                </Frame>
            </DataTemplate>
        </CarouselView.ItemTemplate>
    </CarouselView>

您可以創建一個自定義控件 LargeLabel 以在創建三個點時也顯示隱藏的文本。 您可以查看鏈接以獲取更多詳細信息。 如何在 3 行后在 label 末尾添加“查看更多”和查看更少

Answer 3

沒有測試你的代碼，但從邏輯上講，這似乎是因為 Frame 的問題。 因為如果內容很大，框架沒有框架高度，它將如何擴展到該級別？

另一種情況，如果您需要保持框架高度與子控件相同，則應該有用戶可以滾動的滾動視圖。 不是嗎？

希望能幫助到你。

謝謝。