使用 Syncfusion 在 Xamarin.Forms 中扩展 SfRadioButton 功能

Extend SfRadioButton functionality in Xamarin.Forms using Syncfusion

我有一个针对 Android 的 Xamarin.Forms 应用程序,我正在使用 Syncfusion 的 SfRadioGroup 和 SfRadioButton 来向用户提供一些选项。但是,我想提供有关用户可以做出的每个特定选择的更多信息。

我认为实现此目的的一个好方法是在每个 RadioButton 旁边添加一个信息按钮,该按钮将打开一个弹出窗口,其中包含有关该选择的更多信息。

我曾尝试将 RadioButton 和信息按钮包含在 StackLayout 或 Gird 中,但按钮之间的同步将丢失。 RadioButtons 需要直接放在 SFRadioButtonGroup 中,否则选中其中一个将不会取消选中其他按钮。使用 FlowListView 和 DataTemplate 也不起作用。

我在 Wpf 中执行此操作的方法是创建一个扩展 RadioButton 的新控件,对于控件的视图,我将采用默认 Xaml 并修改它以添加信息按钮。但是,我找不到 SfRadioButton 的 Xaml 的源代码,这使得扩展控件变得非常困难。

有什么方法可以扩展或自定义 SfRadioButton?如果没有,我有什么替代方法可以在用户选择旁边添加更多信息?

下面是一个简单的代码示例,用于说明我想要实现的目标(这不起作用,因为 RadioButtons 的直接父级不是 RadioButtonGroup,而是 StackLayouts)

 <buttons:SfRadioGroup
        Grid.Row="3" Grid.Column="0"
        x:Name="radioGroup"
        HorizontalOptions="Fill"
        Orientation="Vertical"
        VerticalOptions="CenterAndExpand"
        Margin="10,5,10,0">

        <StackLayout Orientation="Horizontal">
        <buttons:SfRadioButton
            TextColor="{StaticResource AppForegroundColor}"
            IsChecked="{Binding Option1, Mode=TwoWay}"
            Text="Individual"
            VerticalOptions="Center" Margin="1,1,1,1" />
        <Button Command="{Binding Path=OpenPopupInfoOption1}"/>
        </StackLayout>

        <StackLayout Orientation="Horizontal">
        <buttons:SfRadioButton
            TextColor="{StaticResource AppForegroundColor}"
            IsChecked="{Binding Option2, Mode=TwoWay}"
            Text="Sum"
            VerticalOptions="Center" Margin="1,1,1,1" />
        </StackLayout>
        <Button Command="{Binding Path=OpenPopupInfoOption2}"/>
    </buttons:SfRadioGroup>

我不认为你可以用你的方式实现它,因为你需要将 buttons:SfRadioButton 放在 buttons:SfRadioGroup 下。

what alternatives do I have in order to add more information next to a user's choice?

我给你一个解决方案:

在每个SfRadioButton下放一个label,并在标签中写明详情。将标签的 IsVisible 与 SfRadioButtonischecked 绑定,因此标签将显示一次 SfRadioButton isChecked 否则标签为 invisible.

如果信息很长,可以把下面的label改成button SfRadioButton。并点击按钮弹出信息

<buttons:SfRadioGroup
        Grid.Row="3" Grid.Column="0"
        x:Name="radioGroup"
        HorizontalOptions="Fill"
        Orientation="Vertical"
        VerticalOptions="CenterAndExpand"
        Margin="10,5,10,0">


        <buttons:SfRadioButton
            x:Name="Sum"
            TextColor="Gray"
            IsChecked="{Binding Option2, Mode=TwoWay}"
            Text="Sum"
            VerticalOptions="Center" Margin="1,1,1,1" />

        <Label Text="detail Sum" BackgroundColor="Gray" BindingContext="{x:Reference Sum}" IsVisible="{Binding IsChecked}"/>


        <buttons:SfRadioButton
            x:Name="Individual"
        TextColor="Blue"
        IsChecked="{Binding Option1, Mode=TwoWay}"
        Text="Individual"
        VerticalOptions="Center" Margin="1,1,1,1" StateChanged="SfRadioButton_StateChanged"/>

        <Label Text="detail Individual" BackgroundColor="Gray" BindingContext="{x:Reference Individual}" IsVisible="{Binding IsChecked}"/>


    </buttons:SfRadioGroup>

这是您可以查看的 gif:

有问题请回复我

根据 SfRadioGroup 的当前行为,仅当将 RadioButton 添加为 SfRadioGroup 的直接子项时,RadioButton 列表才会被视为组。为了实现您的要求,我们无法将 SfRadioButton 添加为直接子项。

所以,我们可以通过手动更改其他两个SfRadioButton 的状态来实现您的要求。请参考以下代码片段。

代码片段:

private void GoogleChrome_StateChanged(object sender, Syncfusion.XForms.Buttons.StateChangedEventArgs e)  
        {  
            if(e.IsChecked.Value)  
            {  
                Instagram.IsChecked = false;  
                Skype.IsChecked = false;  
            }  
        }  

示例http://www.syncfusion.com/downloads/support/directtrac/226145/ze/RadioButtonSample1174471588

此外,我们已经将此功能请求添加到我们的数据库中。

我们没有任何立即实施此功能的计划。在每个发布周期的规划阶段,我们都会审查所有开放功能。您可以从下面的反馈门户跟踪该功能。

https://www.syncfusion.com/feedback/4463

注意:我在 Syncfusion 工作。

此致,
达纳塞卡