How to add multiple buttons into a Grid?

Hi,everyone.I'm a beginner.I want to know how to add multiple buttons into a Grid,such as 36 buttons.using markup to add into XAML page one by one is troublesome.So,is there a better method?and how to rang this buttons regularly?thanks!!

Best Answers

  • PaulNTUPaulNTU US ✭✭✭
    edited February 25 Accepted Answer

    You could set the grid object in Xaml, give it a name and then grab the object and populate it in the code behind using two for loops (one for x axis and one for y axis). Just work out how many rows and how many columns you need

    a rough pseudo code template is below

    // Retrieve grid by name
    Grid grid = this.FindByName("YourGridNameInXaml");
    
    // Add rows and colums if you dont do this in the Xaml
    
    // Now add buttons
    for(int x = 0; x < columns; x++)
    {
        for(int y = 0; y < rows; y++)
        {
            // Insert button into grid  
            Button b = new Button() { HorizontalOptions = LayoutOptions.Fill, VerticalOptions = LayoutOptions.Fill };
            grid.Controls.Add(b, x, y);
        }
    }
    

    I hope that helps

  • jezhjezh Xamurai
    Accepted Answer

    There is a demo in C# , and you don't need the xaml . The demo is in the attachment you can check:
    AddButtonPage.cs

        public class AddButtonPage : ContentPage
    {
        public AddButtonPage ()
        {
            Grid grid = new Grid();
            Title = "Label Grid Demo - C#";
    
            int columnsNum = 6;
            int rowsNum = 6;
    
            for (int x = 0; x < columnsNum; x++)
            {
                for (int y = 0; y < rowsNum; y++)
                {
                    // Insert button into grid  
                    Button b = new Button() { HorizontalOptions = LayoutOptions.Fill, VerticalOptions = LayoutOptions.Fill ,Text = x + ":" +y };
                    grid.Children.Add(b, x, y);
                }
            }
            Content = grid;
        }
    }
    

    The effect image is

  • O_xSanO_xSan
    Accepted Answer

    Thank you!! I think your method is really useful.I'm a Chinese Collegue student in China and English is a little terrible.But I'm extremely appreciate for your help.

Answers

  • PaulNTUPaulNTU USMember ✭✭✭
    edited February 25 Accepted Answer

    You could set the grid object in Xaml, give it a name and then grab the object and populate it in the code behind using two for loops (one for x axis and one for y axis). Just work out how many rows and how many columns you need

    a rough pseudo code template is below

    // Retrieve grid by name
    Grid grid = this.FindByName("YourGridNameInXaml");
    
    // Add rows and colums if you dont do this in the Xaml
    
    // Now add buttons
    for(int x = 0; x < columns; x++)
    {
        for(int y = 0; y < rows; y++)
        {
            // Insert button into grid  
            Button b = new Button() { HorizontalOptions = LayoutOptions.Fill, VerticalOptions = LayoutOptions.Fill };
            grid.Controls.Add(b, x, y);
        }
    }
    

    I hope that helps

  • jezhjezh Member, Xamarin Team Xamurai
    Accepted Answer

    There is a demo in C# , and you don't need the xaml . The demo is in the attachment you can check:
    AddButtonPage.cs

        public class AddButtonPage : ContentPage
    {
        public AddButtonPage ()
        {
            Grid grid = new Grid();
            Title = "Label Grid Demo - C#";
    
            int columnsNum = 6;
            int rowsNum = 6;
    
            for (int x = 0; x < columnsNum; x++)
            {
                for (int y = 0; y < rowsNum; y++)
                {
                    // Insert button into grid  
                    Button b = new Button() { HorizontalOptions = LayoutOptions.Fill, VerticalOptions = LayoutOptions.Fill ,Text = x + ":" +y };
                    grid.Children.Add(b, x, y);
                }
            }
            Content = grid;
        }
    }
    

    The effect image is

  • O_xSanO_xSan Member
    Accepted Answer

    Thank you!! I think your method is really useful.I'm a Chinese Collegue student in China and English is a little terrible.But I'm extremely appreciate for your help.

Sign In or Register to comment.