How can add a multi-line text button in Xamarin.Forms?

Theres is a way to set a multi-line text to a Xamarin.Forms Button??

I've tried Button.Text = "something \n xxjjjxx" But itsn't work.

Best Answer

Answers

  • JulienRosenJulienRosen CAMember ✭✭✭✭
    edited June 2016

    If you want to manually split text onto multiple lines, you'll need a custom button. Text wrapping occurs automatically based on the size of the button. You might also just want to consider using an image that contains your split text as the buttons content.

  • SamirRios24SamirRios24 USMember
    edited June 2016

    @JulienRosen I put a long text in button.text property but its not working. some other property is needed? And the height is automatically

  • JulienRosenJulienRosen CAMember ✭✭✭✭

    When you say its "not working", can you be more descriptive? That really just is not helpful at all.

  • SamirRios24SamirRios24 USMember

    @JulienRosen.1140 The text does not automatically wrap. It keeps in a single line and doesn't fit

  • SamirRios24SamirRios24 USMember
    edited July 2016

    @JohnHardman I made this https://github.com/XLabs/Xamarin-Forms-Labs/issues/241
    But when click nothing happens. (whe click inside the contentbutton don't raise onclick event)

  • JohnHardmanJohnHardman GBUniversity mod
    edited July 2016

    @SamirRios24 - If you are having issues debugging use of the ContentButton, change the BackgroundColor of the Button to a solid color so that you can see definitively where the Button is.

    If you cannot identify the cause of the problem that you are hitting, post your code, either here or in the discussion under that link.

  • SamirRios24SamirRios24 USMember
    edited July 2016

    @JohnHardman changed the background color and nothing.

    This is the RenderButton class

    `using System;
    using Xamarin.Forms;

    namespace tbsmovil
    {
    [ContentProperty("Content")]

    public class RenderButton: ContentView
    {
        public event EventHandler Clicked;
    
        protected Grid ContentGrid;
        protected ContentView ContentContainer;
    
        public new View Content
        {
            get { return ContentContainer.Content; }
            set
            {
                if (ContentGrid.Children.Contains (value))
                    return;
    
                ContentContainer.Content = value;
            }
        }
    
        public RenderButton ()
        {
            ContentGrid = new Grid
            {
                VerticalOptions = LayoutOptions.FillAndExpand,
                HorizontalOptions = LayoutOptions.FillAndExpand
            };
    
            ContentGrid.ColumnDefinitions.Add (new ColumnDefinition { Width = new GridLength (1, GridUnitType.Star) });
            ContentGrid.RowDefinitions.Add (new RowDefinition { Height = new GridLength (1, GridUnitType.Star) });
    
            ContentContainer = new ContentView
            {
                VerticalOptions = LayoutOptions.FillAndExpand,
                HorizontalOptions = LayoutOptions.FillAndExpand
            };
    
            ContentGrid.Children.Add (ContentContainer);
    
            var button = new Button
            {
                VerticalOptions = LayoutOptions.FillAndExpand,
                HorizontalOptions = LayoutOptions.FillAndExpand,
                BackgroundColor = Colors.colorazulTBS
            };
    
            button.Clicked += (sender, e) => OnClicked();
    
            ContentGrid.Children.Add (button);
    
            base.Content = ContentGrid;
        }
    
        public void OnClicked ()
        {
            if(Clicked != null)
                Clicked (this, new EventArgs ());
        }
    }
    

    }`

    And the XAML:

    `

                <local:RenderButton x:Name="main_btnListar"
                        HorizontalOptions="FillAndExpand"
                        HeightRequest="56"
                        BackgroundColor="Gray"
                        >
    
                    <StackLayout HorizontalOptions="Fill" VerticalOptions="FillAndExpand" Orientation="Horizontal">
                        <Image Source="ic_cargaciudad.png" HorizontalOptions="Start"/>
                        <Label Text="{x:Static local:Strings.cerca}"
                                HorizontalOptions="CenterAndExpand"
                                TextColor="Black"
                                Font="20"
                                YAlign="Center"
                                XAlign="Start"/>
                        <Image Source="ic_arrow_right.png" HorizontalOptions="End"/>
                    </StackLayout>
            </local:RenderButton>
    

    `

    And this is the class where I call the OnClick event:

    `public partial class MainActivity : ContentPage
    {
    public MainActivity ()
    {
    InitializeComponent ();

            NavigationPage.SetBackButtonTitle (this, "Atrás");
    
    
            var btnListar = main_btnListar;
    
            btnListar.Clicked += Listar;
        }
    
        void Listar (object sender, EventArgs e)
        {
            Navigation.PushAsync (new CargaCerca ());
        }`
    

    What you thinks is wrong?
    Thanks a lot for your help!

  • JohnHardmanJohnHardman GBUniversity mod

    @SamirRios24 - Have you put a breakpoint in OnClicked to see if that is called?

    Also, have you tested this on more than one platform? Does it work on any platform?

  • SamirRios24SamirRios24 USMember

    @JohnHardman - Yep, I've put a breackpoint and that isn't called :( and I tested in both platforms (Android & iOS) and nothing :neutral:

Sign In or Register to comment.