Is it possible to keep RadioButton as Header of the expandable control Xamarin forms 4.6

Question

I'm trying to make a payment method page. The functionality i'm trying to do is - click on the radio button and the expander body should show the text boxes to add the corresponding details. So I tried this code:

<Grid Grid.Row="2">
            <StackLayout Orientation="Vertical" >
                <Frame BorderColor="Gray"
                       CornerRadius="5"
                       Padding="8">
                    <StackLayout >
                        <Expander>
                            <Expander.Header>
                                <StackLayout>
                                    <Label Text="COD"/>
                                    <RadioButton GroupName="PaymentMethod" 
                                     Text="{lang:Translate COD}" 
                                     IsChecked="False"/>
                                </StackLayout>
                            </Expander.Header>                                
                        </Expander>
                    </StackLayout>
                </Frame>

                <Frame BorderColor="Gray"
                       CornerRadius="5"
                       Padding="8">
                    <StackLayout>
                        <Expander>
                            <Expander.Header>
                                <StackLayout>
                                    <Label  Text="Card Payment"/>
                                    <RadioButton GroupName="PaymentMethod" 
                                 Text="{lang:Translate Card}" 
                                 IsChecked="False"/>
                                </StackLayout>
                            </Expander.Header>
                            <Expander.Content>
                                <Grid Padding="10">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="auto"/>
                                        <RowDefinition Height="auto"/>
                                    </Grid.RowDefinitions>
                                    <Grid Grid.Row="0">
                                        <StackLayout Orientation="Horizontal">
                                            <local:XEntry Style="{StaticResource entry}"                                              
                                        Placeholder="Card Number"
                                        PlaceholderColor="LightGray"
                                        MaxLength="100"/>
                                            <!--Text="{Binding CardNumber}"-->
                                            <local:XEntry Style="{StaticResource entry}"
                                        Placeholder="MM"
                                        PlaceholderColor="LightGray"
                                        Text="{Binding Month}"
                                        MaxLength="2"/>
                                            <Label Text="/"/>
                                            <local:XEntry Style="{StaticResource entry}"
                                        Placeholder="YY"
                                        PlaceholderColor="LightGray"
                                        MaxLength="2"/>
                                            <!--Text="{Binding Year}"-->
                                            <local:XEntry Style="{StaticResource entry}"
                                        Placeholder="CVV"  
                                        PlaceholderColor="LightGray"
                                        MaxLength="3"/>
                                            <!--Text="{Binding CVV}"-->
                                        </StackLayout>
                                    </Grid>
                                    <Grid Grid.Row="1">
                                        <StackLayout>
                                            <local:XEntry Style="{StaticResource entry}"                                               
                                        Placeholder="Card Holder Name"
                                        PlaceholderColor="LightGray"
                                        MaxLength="100"/>
                                            <!--Text="{Binding CardHolderName}"-->
                                        </StackLayout>
                                    </Grid>
                                </Grid>
                            </Expander.Content>
                        </Expander>
                    </StackLayout>
                </Frame>
                <Frame BorderColor="Gray"
                       CornerRadius="5"
                       Padding="8">
                    <StackLayout>
                        <Expander>
                            <Expander.Header>
                                <StackLayout>
                                    <Label Text="Net Banking"/>
                                    <RadioButton GroupName="PaymentMethod" 
                                 Text="{lang:Translate Card}" 
                                 IsChecked="False" />
                                    <!--{Binding NetBank}-->
                                </StackLayout>
                            </Expander.Header>
                            <Expander.Content>
                                <StackLayout>                                        
                                    <Label  Text="Net Banking"/>
                                </StackLayout>
                            </Expander.Content>
                        </Expander>
                    </StackLayout>
                </Frame>
            </StackLayout>                                                 
        </Grid>

The Expander is working only if the header contains a Lable likw thw code i pasted above. When i add just the RadioButton in the header, it doesn't expand. I don't want the label in my header. Instead I want the expander to expand when the radio button is active. I'm using the Xamarin.Forms 4.6 Release RadioButton and Expander . Please suggest a solution. Thanks in advance.

Answer 1

Thanks for your time. Here is the answer:

<Expander x:Name="MyExpander"> <Expander.Header> <StackLayout> <RadioButton HorizontalOptions="StartAndExpand" WidthRequest="200" GroupName="PaymentMethod" Text="Credit/Debit Card" IsChecked="False" Clicked="RadioButton_Clicked"/> </StackLayout> </Expander.Header> </Expander>

and in the cs file:

private void RadioButton_Clicked(object sender, EventArgs e) { MyExpander.IsExpanded = !MyExpander.IsExpanded; }