Button with image and text and text bellow the image, how?

Question

First time with cross-platform apps with xamarin, i'm working with xamarin forms in visual studio 2017 community.

I have a button with an image and text but the text needs to be below the image. currently the text is displaying to the left of the image, how can i do this?

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Xamarin.Forms;

namespace AppUnap
{
public class PPrincipal : ContentPage
{
    public PPrincipal()
    {
        Button btn1= new Button();
        btn1.Image = "notas.png";
        btn1.Text = "Calificaciones";
        btn1.HorizontalOptions = LayoutOptions.CenterAndExpand;

        Button btn2 = new Button();
        btn2.Image = "notas.png";
        btn2.Text = "Aula Virtual";
        btn2.HorizontalOptions = LayoutOptions.CenterAndExpand;

        Content = new StackLayout
        {
            Spacing = 0,
            VerticalOptions = LayoutOptions.CenterAndExpand,
            Children =
            {
            new StackLayout
            {
                Spacing = 0,
                Orientation = StackOrientation.Horizontal,
                Children =
                {                       
                    btn1,
                    btn2,
                }
            }
            }


        };
    }
}
}

Answer 1

You need to use ContentLayout on your button.

Here is the code I use in XAML:

<Button Command="{Binding MyCommand}" ContentLayout="Top,0" Text="mytext" Image="myimage.png" />

Top = Position of the Image

0 = spacing between image & text

You should find easily how to use the ContentLayout in C#