.NET MAUI Button Text Concatenation

Question

Does anyone know how to create a button in .NET MAUI where the text of the button contains multiple elements?

For example, I want to create a button where it has an icon and text, The icon is a binding to a static resource. Looking around, it looks like you can do it by using multi bindings by adding direct content to the button element in XAML, but .NET MAUI give an error stating that you cannot set direct content on a button.

I have tried adding direct content to the button, but that didn't work and other than that - I couldn't find much else to try.

Please help.

Answer 1

You best bet is to use either a VerticalStackLayout or a Grid including a label and the button.

<VerticalStackLayout>
    <Button/>
    <Label/>
</VerticalStackLayout>

or an example with Grid inside a border

<Border>
    <Grid>
       <Button VerticalOptions="Start"/>
       <Label VerticalOptions="End"/>
    </Grid>

    <Border.GestureRecognizers>
        <TapGestureRecognizer
             Tapped="TapGestureRecognizer_Tapped"
             Command="..."
             CommandParameter="..."/>
            
    </Border.GestureRecognizers>
</Border>

Also not that if the user taps the label and not the icon then your code will not execute. You have to include also code to your label. The same applies if the user taps the border.

hope that helps.