SyncFusion Radio Button Group Appearance

Question

How can I change my radio buttons from looking like this:

to this:

<radiobutton:SfRadioGroup x:Name="radioGroup" Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
     <radiobutton:SfRadioButton x:Name="asc" Text="Ascending" IsChecked="True"/>
     <radiobutton:SfRadioButton x:Name="desc" Text="Descending"/>
</radiobutton:SfRadioGroup>

Answer 1

You could try to use SfSegmentedControl to replace the Radiobutton to get what you want.

Here is a code example you could refer to.

xmlns:buttons="clr-namespace:Syncfusion.XForms.Buttons;assembly=Syncfusion.Buttons.XForms"
xmlns:segmentCollection="clr-namespace:System.Collections.Generic;assembly=netstandard"

<buttons:SfSegmentedControl
    Grid.Row="1"
    Grid.Column="1"
    SelectionTextColor = "White"
    HeightRequest="80"
    VisibleSegmentsCount="2"
    Color="Transparent"
    BorderColor="Purple"
    BorderThickness="2"
    SelectedIndex="1"
    FontColor="Purple"
    FontSize="20"
    BackgroundColor="Transparent"
    CornerRadius="15">
    <segmentCollection:List x:TypeArguments="x:String">
        <x:String>Ascending</x:String>
        <x:String>Descending</x:String>
    </segmentCollection:List>
</buttons:SfSegmentedControl>