MAUI单选按钮暗黑模式下边框不可见问题求助

针对Android和iOS平台暗黑模式下未选中RadioButton边框不显示的问题，可按以下方案逐一排查解决：

1. 显式设置BorderWidth属性 #

默认情况下，RadioButton的BorderWidth可能为0，或在暗黑模式下被平台样式覆盖，需显式指定边框宽度：

直接在控件上设置 #

<RadioButton x:Name="MyRadio0No" 
             Grid.Row="0" Grid.Column="1" 
             Content="No" 
             BackgroundColor="White" 
             BorderColor="{StaticResource AppMainColor}"
             BorderWidth="2"  <!-- 添加边框宽度设置 -->
             FontSize="Body" 
             TextColor="{StaticResource AppMainColor}" 
             IsChecked="false"  
             CheckedChanged="OnRadioButton0CheckedChanged" />

在全局样式中设置 #

<Style TargetType="RadioButton">
    <Setter Property="BorderColor" Value="{AppThemeBinding Light={StaticResource AppMainColor}, Dark={StaticResource AppMainColor}}" />
    <Setter Property="BorderWidth" Value="2" /> <!-- 添加边框宽度设置 -->
    <!-- 其他样式设置 -->
</Style>

2. 验证颜色资源的可用性 #

如果使用StaticResource引用颜色，需确认该资源在暗黑模式的资源字典中已正确定义。可临时替换为固定颜色值测试，排除资源加载问题：

BorderColor="{AppThemeBinding Light=#FF2196F3, Dark=#FF2196F3}"

3. 通过VisualStateManager强制定义状态样式 #

利用视觉状态管理器，明确指定未选中（Normal）状态下的边框样式，避免平台默认样式覆盖：

<RadioButton x:Name="MyRadio0No" 
             Content="No" 
             IsChecked="false">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
            <VisualState x:Name="Normal">
                <VisualState.Setters>
                    <Setter Property="BorderColor" Value="{StaticResource AppMainColor}" />
                    <Setter Property="BorderWidth" Value="2" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Checked">
                <VisualState.Setters>
                    <Setter Property="BorderColor" Value="{StaticResource AppMainColor}" />
                    <Setter Property="BorderWidth" Value="2" />
                    <!-- 可自定义选中状态的填充色等 -->
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</RadioButton>

4. 平台特定调整 #

Android平台 #

Android原生RadioButton的默认样式可能在暗黑模式下隐藏边框，可通过自定义渲染器强制设置：

using Android.Content;
using Android.Widget;
using YourAppName.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(RadioButton), typeof(CustomRadioButtonRenderer))]
namespace YourAppName.Droid
{
    public class CustomRadioButtonRenderer : RadioButtonRenderer
    {
        public CustomRadioButtonRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.RadioButton> e)
        {
            base.OnElementChanged(e);
            if (Control != null)
            {
                // 设置未选中时的边框样式
                Control.ButtonDrawable = Context.GetDrawable(Resource.Drawable.custom_radio_button);
            }
        }
    }
}

随后在Android项目的Resources/drawable和Resources/drawable-night目录下创建custom_radio_button.xml，定义未选中和选中状态的Drawable：

<!-- drawable/custom_radio_button.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/radio_checked" />
    <item android:drawable="@drawable/radio_unchecked" />
</selector>

再分别创建radio_checked.xml和radio_unchecked.xml，定义圆形边框与填充样式。

iOS平台 #

可通过自定义渲染器调整未选中状态的边框样式：

using YourAppName.iOS;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(RadioButton), typeof(CustomRadioButtonRenderer))]
namespace YourAppName.iOS
{
    public class CustomRadioButtonRenderer : RadioButtonRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.RadioButton> e)
        {
            base.OnElementChanged(e);
            if (Control != null)
            {
                // 调整未选中状态的边框颜色和宽度
                Control.Layer.BorderColor = Element.BorderColor.ToCGColor();
                Control.Layer.BorderWidth = Element.BorderWidth;
                Control.Layer.CornerRadius = Control.Frame.Height / 2;
            }
        }
    }
}

内容的提问来源于stack exchange，提问作者jess