Why won't my Xamarin.Forms label wrap text? - label

Question

I am trying to make a label wrap inside of the Master page of a MasterDetail page. I thought it was the default behavior to wrap labels, but just in case I even made a custom renderer. I have confirmed that the custom renderer works (through debugging and adding a background to the label), so I assume there is something easy that I am missing. Can anybody take a look at my xaml and give me an idea why this label is not wrapping?
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyApp.Pages.NavigationDrawer.NavigationMenuMasterPage"
xmlns:statics="clr-namespace:MyApp.Statics;assembly=MyApp"
xmlns:multi="clr-namespace:MyApp.Pages.NavigationDrawer;assembly=MyApp"
Title="Navigation drawer"
Icon="hamburger.png"
BackgroundColor="White">
<ContentPage.Content>
<StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="Center" Margin="0, 25, 0, 0">
<StackLayout Orientation="Horizontal" HorizontalOptions="Center">
<Image x:Name="connectionStatusImage" />
<Label x:Name="connectionStatusText" Margin="16, 0, 16, 0" YAlign="Center" FontSize="Medium"/>
</StackLayout>
<Label x:Name="changeConnectionStatusButton" TextColor="{x:Static statics:Palette.Orange}" XAlign="Center" FontAttributes="Bold" >
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="ChangeConnectionStatusClicked" NumberOfTapsRequired="1" />
</Label.GestureRecognizers>
</Label>
<StackLayout x:Name="SyncStatusStack" Orientation="Horizontal" Margin="0, 16, 16, 0" VerticalOptions="Center" >
<multi:MultiLineLabel x:Name="syncStatusText" MinimumWidthRequest="0" Margin="16, 0, 0, 0" Text="I want to write a really long string to see if it wraps" />
<Label x:Name="syncButton" MinimumWidthRequest="40" Text="SYNC" FontAttributes="Bold" YAlign="Center" HorizontalOptions="End" >
<Label.GestureRecognizers>
<TapGestureRecognizer x:Name="SyncGestureRecognizer" NumberOfTapsRequired="1" />
</Label.GestureRecognizers>
</Label>
</StackLayout>
<StackLayout x:Name="SyncStack" Orientation="Vertical" HorizontalOptions="Center" Margin="0, 16, 0, 0">
<ActivityIndicator x:Name="syncingIndicator" Margin="16, 0, 32, 0"/>
<Label x:Name="syncingText" />
</StackLayout>
<ListView x:Name="menuListView" VerticalOptions="FillAndExpand" SeparatorVisibility="None" Margin="0, 16, 0, 0">
<ListView.ItemTemplate>
<DataTemplate>
<TextCell Text="{Binding Title}" TextColor="{x:Static statics:Palette.PrimaryText}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
And my (most likely unnecessary) custom label renderer:
using MyApp.iOS.Renderers;
using MyApp.Pages.NavigationDrawer;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(MultiLineLabel), typeof(MultiLineLabeliOSRenderer))]
namespace MyApp.iOS.Renderers
{
public class MultiLineLabeliOSRenderer : LabelRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
{
base.OnElementChanged(e);
if (Control == null) return;
Control.LineBreakMode = UIKit.UILineBreakMode.WordWrap;
Control.Lines = 0;
}
}
}

Answer 1

Hmm not sure why, but you are correct setting lines to 0 and using word wrap should do the trick ( Multiple lines of text in UILabel )
I recently also implemented this with a custom renderer ( http://depblog.weblogs.us/2016/06/27/xamarin-forms-multi-line-label-custom-renderer-gotcha/ ) and used a number to indicate the exact amount of lines I would like to have.
That is being set into the Lines property and then the wrapping works.