How to create a dynamic list of buttons on MainPage in Xamarin.Forms?

Question

I'm creating an application to scan barcode tickets. When you start the app a list of available shows has to be shown on the screen. To get all the available shows I'm using a webservice which returns me a List<Event>. How do I create a list of buttons with each button representing a show/event from inside the xaml.cs? When clicking the button a new page will be shown where the user can scan the tickets from that show. I'm pretty new to Xamarin.Forms and I quite don't understand how to use the paging/content views. I already searched a lot but the closest to what I need was this: https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/get-started-with-xaml?tabs=vswin

Unfortunatly it only shows how to add a certain amount of controls. And not a dynamicly generated amount.

Many thanks in advance!

bind your List<Event> to a ListView, then each row of the ListView can be tapped or selected. You don't actually need to create buttons — Jason
– Jason, Commented Sep 20, 2018 at 16:23
@Jason If I create a <ListView x:Name=lvTest> inside my xaml, why won't my code behind recognize lvTest = ...? — Basvo
– Basvo, Commented Sep 20, 2018 at 16:36
@Basvo: If your markup for the ListView is valid, then your page class should have an IvTest property on it, which after the InitializeComponents() call in the constructor will be set to the ListView instance with that name. Then you can set the ItemsSource property of IvTest to the list of events. If you don't see that working, you should verify that the XAML is correct before continuing. — Chris Charabaruk
– Chris Charabaruk, Commented Sep 20, 2018 at 17:42

Nick Kovalsky · Accepted Answer · 2018-09-21 11:26:59Z

In xaml insert a stacklayout where you want your buttons to appear. Remember you can also play whith its Orientation and Spacing properties. So:

<StackLayout x:Name="MyButtons"/>

Then in code-behind generate your dinamic buttons list. Put the code in constructor AFTER InitializeComponent(); or somewhere else:

    var myList = new List<*Event or something*>(); //your list here
    MyButtons.Children.Clear(); //just in case so you can call this code several times np..
                foreach (var item in myList)
                {
                    var btn = new Button()
                    {
                        Text = item.*your property*, //Whatever prop you wonna put as title;
                        StyleId = item.*your ID property* //use a property from event as id to be passed to handler
                    };
                    btn.Clicked += OnDynamicBtnClicked;
                    MyButtons.Children.Add(btn);
                }

Add a handler:

private void OnDynamicBtnClicked(object sender, EventArgs e)
        {
            var myBtn = sender as Button;
            // who called me?
            var myId = myBtn.StyleId; //this was set during dynamic creation

            //do you stuff upon is
            switch (myId)
            {
                    case "1": //or other value you might have set as id
                        //todo
                        break;
                    default:
                        //todo
                        break;
            }

        }

Collectives™ on Stack Overflow

How to create a dynamic list of buttons on MainPage in Xamarin.Forms?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related