Increase the editor height based on the character count

SreeeeSreeee INMember ✭✭✭✭✭

I have an editor like below in my xamarin forms project.

When I type a message on it I need to increase the height of the editor based on the number of characters.

How can I do this? Thanks in advance :)

Best Answer

  • SreeeeSreeee IN ✭✭✭✭✭
    Accepted Answer

    Simply use the Editor control and set the AutoSize property to TextChanges. Note that the auto-sizing will not work when you set a HeightRequest.

    More information here: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/text/editor

    Important: Also my editor is surrounded with a StackLayout. Replacing the StackLayout with a Grid helps to achieve the result. This is because a StackLayout just takes up the space that is (initially) taken up by its children. A Grid is able to grow dynamically. For more info go to this StackLayout thread.

Answers

  • SreeeeSreeee INMember ✭✭✭✭✭
    edited November 2018

    My code of entry, I added a frame layout for making the entry corners are round: Tried AutoSize="TextChanges" property but no change in the height of entry.

    <Frame
               Padding="0"
               Margin="5,5,0,5"
               HorizontalOptions="FillAndExpand"
               CornerRadius="10">
                <Editor 
             x:Name="tweetText"
             HorizontalOptions="FillAndExpand"
             VerticalOptions="Center"
                 AutoSize="TextChanges"
                 FontFamily="Bold"
                 BackgroundColor="White"
                 TextColor="#959595"
                 PlaceholderColor="#959595"
                 Placeholder="  Enter Message..."/>   
              </Frame>
    
  • BillyLiuBillyLiu Member, Xamarin Team Xamurai

    @Sreeee

    When I type a message on it I need to increase the height of the editor based on the number of characters.

    Do you mean increase the height when you add a new line? If so, it will auto increase the height.

  • SreeeeSreeee INMember ✭✭✭✭✭
    Accepted Answer

    Simply use the Editor control and set the AutoSize property to TextChanges. Note that the auto-sizing will not work when you set a HeightRequest.

    More information here: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/text/editor

    Important: Also my editor is surrounded with a StackLayout. Replacing the StackLayout with a Grid helps to achieve the result. This is because a StackLayout just takes up the space that is (initially) taken up by its children. A Grid is able to grow dynamically. For more info go to this StackLayout thread.

  • SreeeeSreeee INMember ✭✭✭✭✭

    @BillyLiu Thanks for your comment :) I solved this feature using AutoSize="TextChanges" property of editor, for more information please go through the accepted answer.

Sign In or Register to comment.