How do I change the text lineheight?

KhosrouKhosrou Member ✭✭✭
edited August 2018 in Xamarin.Forms

Hi guys,

I'm trying to change the lineheight of a label but I couldn't figure it out. Can somebody help me out?

Answers

  • JohnHardmanJohnHardman GBUniversity mod

    @Khosrou said:
    Im trying to change the lineheight of a label but I cou;dn't figure it out. Can somebody help me out?

    Do you want to make the text bigger or just have more empty space? If you want bigger text, change the FontSize property of the Label. If you want more empty space see https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/margin-and-padding

    @Khosrou said:
    Hi guys,

    Call me politically correct if you like, but please remember that not everybody in these forums is male. The way you start your post can easily alienate a number of people who would otherwise answer questions.

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭
  • nefgrixisnefgrixis Member ✭✭

    It actually doesn't work. I tried it today.

  • EsamSherifEsamSherif EGUniversity ✭✭
    edited October 2018

    Label's "LineHeight" works on iOS and UWP but not android

  • @EsamSherif said:
    Label's "LineHeight" works on iOS and UWP but not android

    EsamSherif is correct in that Label's LineHeight does not seem to currently work on Android. Today I found a work around utilising Span to the same effect without requiring any kind of native code.

            <!-- This doesn't work on Android but works on all other platforms. -->
            <Label Text="Text goes here!"
                   LineHeight="1.2" />
    
            <!-- This works on all platforms with no need for any native implementation. -->
            <Label LineBreakMode="WordWrap">
                <Label.FormattedText>
                    <FormattedString>
                        <Span Text="Text goes here!"
                              LineHeight="1.2" />
                    </FormattedString>
                </Label.FormattedText>
            </Label>
    

    This works for me! Let me know if it works for you. :smile:

  • KhosrouKhosrou Member ✭✭✭

    Im sure that works, but Im running XF 2.5 guys

  • @Khosrou said:
    Im sure that works, but Im running XF 2.5 guys

    The LineHeight property is only supported in 3.2.

    You would need to implement it natively in older versions but sadly I can't help with that sorry! :(

  • JohannesHJohannesH Member ✭✭

    How can i find the right value for LineHeight? I want a LineHeight of 22pt, but in the docs it just says "The multiplier to apply to the default line height when displaying text", but not what the default value is. Where can i find it?

  • JFMGJFMG DEMember ✭✭
    edited January 7

    @JohannesH
    why not simply put a breakpoint or a print message in your code behind file?

    Your XAML:

    <Label
      x:Name="MyLabel"
      Text="My Text" />
    

    In your code behind:

    System.Diagnostics.Debug.WriteLine($"Line height of MyLabel: {MyLabel.LineHeight}")
    
  • JohnHardmanJohnHardman GBUniversity mod

    @BradNotBread said:

    @Khosrou said:
    Im sure that works, but Im running XF 2.5 guys

    The LineHeight property is only supported in 3.2.

    You would need to implement it natively in older versions but sadly I can't help with that sorry! :(

    @Khosrou - Xamarin.Forms is open source, so you could look at the latest source code and pick out the bits that you would need to put in custom renderers to get the same result using XF 2.5

  • JohannesHJohannesH Member ✭✭

    @JFMG said:
    @JohannesH
    why not simply put a breakpoint or a print message in your code behind file?

    Your XAML:

    <Label
      x:Name="MyLabel"
      Text="My Text" />
    

    In your code behind:

    System.Diagnostics.Debug.WriteLine($"Line height of MyLabel: {MyLabel.LineHeight}")
    

    Hey JFMG, thanks for the response, but i think you got my question wrong. My problem is: I got an Zeplin/Sketch Screen and it tells me the LineHeight is 24pt. Now LineHeight only gives the ability to set a multiplier that is applied to the "default line height" and i don't know where to get this value.

  • JFMGJFMG DEMember ✭✭

    @JohannesH
    That is a problem of Zeplin. Theoretically, you can display the source code for the label in Swift or AXML. Then you will see the line height multiplier. At least that is possible with InVision.

  • Hayden_HancockHayden_Hancock USMember ✭✭
    edited June 5

    I was using Xamarin Forms 2.5 and upgraded to 3.2.839982 and although I get the LineHeight property now, it still doesn't render correctly on Android. As @BradNotBread mentioned, using FormattedText seemed to fix it on Android.

    Does anyone know if this has been fixed in more recent versions of Xamarin Forms?

  • BradNotBreadBradNotBread Member

    @Hayden_Hancock said:
    I was using Xamarin Forms 2.5 and upgraded to 3.2.839982 and although I get the LineHeight property now, it still doesn't render correctly on Android. As @BradNotBread mentioned, using FormattedText seemed to fix it on Android.

    Does anyone know if this has been fixed in more recent versions of Xamarin Forms?

    Looking at the official Xamarin Forms Github repository this issue was marked as closed for 3.2 but that clearly isn't the case. Perhaps it would just be worth trying in the latest release. Otherwise it would be great to get an official response on why this issue is still present and when we can expect a fix.

  • KhosrouKhosrou Member ✭✭✭

    I fixed it by upgrading XF!

Sign In or Register to comment.