Issue
I know this topic has been discussed before. But still I cannot find a good solution from all the discussions. I have a Grid layout that contains a ScrollView and another Grid. Inside the ScrollView are three Labels. The problem is that the texts in the Labels are not always displayed in full. Sometimes even longer texts are displayed in full, and sometimes even shorter ones cannot. Here is my xamal code. The texts in the labels are placeholders and are replaced in C# code. Do I need a custom renderer for the labels as suggested by some people?
In the first screenshot, the title label contains text "test push notification on physical device". It is much shorter than the title in the second screenshot. Yet the second displays in full. This weird behavior also happens sometimes in the third label. The second label has fixed length, so it is not affected.
<Grid x:Name="GridLayout">
<Grid.RowDefinitions>
<RowDefinition Height="50*" />
<RowDefinition Height="50*" />
</Grid.RowDefinitions>
<ScrollView Grid.Row="0" x:Name="Scroll" x:FieldModifier="public" VerticalOptions="Start" HeightRequest="320" MinimumHeightRequest="320" Margin="0,0,0,0" Orientation="Vertical">
<StackLayout Spacing="0" Orientation="Vertical">
<Label Text="Resources" FontSize="31" x:Name="TitleLabel" x:FieldModifier="public" MaxLines="0" TextColor="Black" Padding="30,15,30,0" LineBreakMode="WordWrap">
<Label.FontFamily>
<OnPlatform x:TypeArguments="x:String">
<On Platform="iOS" Value="WorkSans-Bold" />
<On Platform="Android" Value="Fonts/WorkSans-Bold.ttf#WorkSans-Bold" />
</OnPlatform>
</Label.FontFamily>
</Label>
<Label x:FieldModifier="public" x:Name="TimeLabel" BackgroundColor="White" TextColor="Black" FontSize="22" FontFamily="sans-serif" MaxLines="0" VerticalOptions="Start" LineBreakMode="WordWrap" Padding="30,5,30,0" Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.">
</Label>
<Label x:FieldModifier="public" x:Name="TextLabel" BackgroundColor="White" TextColor="Black" FontSize="16" FontFamily="sans-serif" MaxLines="0" VerticalOptions="FillAndExpand" Padding="30,5,30,0" LineBreakMode="WordWrap" Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.">
</Label>
</StackLayout>
</ScrollView>
<Grid Grid.Row="1" RowSpacing="3" x:Name="BottomGrid">
...
</Grid>
</Grid>
Solution
I suppose you might need Margin instead of padding, if you use Padding then the text gets cut-off, as the inside area is getting shrunk, it works as intended when I replace it with margin.
<Label Text="Resources" FontSize="31" x:Name="TitleLabel" x:FieldModifier="public" MaxLines="0" TextColor="Black" Margin="30,15,30,0" LineBreakMode="WordWrap">
Answered By - BoredToDeath
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.