Radio button position

Question

Hi,

I have the following code:

<RadioButton x:Name="RadioButtonAuto" GroupName="RadioDisplay" Grid.Column="0" HeightRequest="100" Value="Auto" CheckedChanged="RadioButtonDisplay_CheckedChanged">  
<RadioButton.Content>  
        <StackLayout>  
            <Image WidthRequest="50" HeightRequest="50" HorizontalOptions="Center" VerticalOptions="Center">  
            <Image.Source>  
                <FontImageSource FontFamily="FontSolid" Glyph="&#xf186;" Color="Black" />  
            </Image.Source>  
            </Image>  
            <Label Text="Auto" HorizontalOptions="Center" VerticalOptions="End" />  
        </StackLayout>  
</RadioButton.Content>  
</RadioButton>  

and I am getting this output:

How can I change the radio button position to show like this:

Answer 1

Hello,

You need to redefine the style of RadioButton with with a ControlTemplate.

Please refer to Redefine RadioButton appearance.

You could use the code in the documentation to achieve the desired effect.

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.