Skip to content

Commit

Permalink
Android: fix dialog button colors in dark mode (#15091)
Browse files Browse the repository at this point in the history
* Core(Android): fix dialog button colors in dark mode

Fix alert dialog button colors in dark mode.
Use ?attr/colorOnSurface for text color in dialogs.
This ensures contrasting color for both dark and light modes.

* Core(Android): use AppCompat alert dialog in picker

Use AppCompat version of AlertDialog in picker.
This ensures consistent styling between picker dialog and
alert dialog.

* Controls.DeviceTests: add AlertDialogTests

Add tests for checking brightness of AlertDialog button text.

Co-authored-by: webwarrior <reg@webwarrior.ws>

---------

Co-authored-by: Parham Saremi <parhaamsaremi@gmail.com>
  • Loading branch information
webwarrior-ws and parhamsaremi authored Jul 13, 2023
1 parent 2ac61e5 commit cda3eb3
Show file tree
Hide file tree
Showing 4 changed files with 63 additions and 3 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Microsoft.Maui.DeviceTests.Stubs;
using Microsoft.Maui.Platform;
using Xunit;
using AndroidX.AppCompat.App;
using Android.Graphics;

namespace Microsoft.Maui.DeviceTests
{
public partial class AlertDialogTests: ControlsHandlerTestBase
{

async Task<Color> GetDialogButtonTextColor(int nightMode)
{
var mauiContextStub1 = new ContextStub(ApplicationServices);
var activity = mauiContextStub1.GetActivity();
mauiContextStub1.Context = new Android.Views.ContextThemeWrapper(activity, Resource.Style.Maui_MainTheme_NoActionBar);
Color color = Color.Transparent;
await InvokeOnMainThreadAsync(() =>
{
var initialNightMode = activity.Delegate.LocalNightMode;
activity.Delegate.SetLocalNightMode(nightMode);
var builder = new AlertDialog.Builder(activity);
var alertDialog = builder.Create();
alertDialog.Show();
var button = alertDialog.GetButton((int)Android.Content.DialogButtonType.Negative);
var textColor = button.CurrentTextColor;
color = new Color(textColor);
activity.Delegate.SetLocalNightMode(initialNightMode);
alertDialog.Hide();
});

return color;
}

[Fact]
public void AlertDialogButtonColorLightTheme()
{
var textColor = GetDialogButtonTextColor(AppCompatDelegate.ModeNightNo).Result;
Assert.True(textColor.GetBrightness() < 0.5);
}

[Fact]
public void AlertDialogButtonColorDarkTheme()
{
var textColor = GetDialogButtonTextColor(AppCompatDelegate.ModeNightYes).Result;
Assert.True(textColor.GetBrightness() > 0.5);
}
}
}
5 changes: 3 additions & 2 deletions src/Core/src/Handlers/Picker/PickerHandler.Android.cs
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,13 @@
using Android.Text;
using Android.Text.Style;
using AResource = Android.Resource;
using AppCompatAlertDialog = AndroidX.AppCompat.App.AlertDialog;

namespace Microsoft.Maui.Handlers
{
public partial class PickerHandler : ViewHandler<IPicker, MauiPicker>
{
AlertDialog? _dialog;
AppCompatAlertDialog? _dialog;

protected override MauiPicker CreatePlatformView() =>
new MauiPicker(Context);
Expand Down Expand Up @@ -108,7 +109,7 @@ void OnClick(object? sender, EventArgs e)
{
if (_dialog == null && VirtualView != null)
{
using (var builder = new AlertDialog.Builder(Context))
using (var builder = new AppCompatAlertDialog.Builder(Context))
{
if (VirtualView.TitleColor == null)
{
Expand Down
2 changes: 1 addition & 1 deletion src/Core/src/Platform/Android/PickerExtensions.cs
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ internal static void UpdatePicker(this MauiPicker platformPicker, IPicker picker
platformPicker.Text = picker.GetItem(picker.SelectedIndex);
}

internal static void UpdateFlowDirection(this AlertDialog alertDialog, MauiPicker platformPicker)
internal static void UpdateFlowDirection(this AndroidX.AppCompat.App.AlertDialog alertDialog, MauiPicker platformPicker)
{
var platformLayoutDirection = platformPicker.LayoutDirection;

Expand Down
5 changes: 5 additions & 0 deletions src/Core/src/Platform/Android/Resources/values/styles.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
<item name="materialButtonStyle">@style/MauiMaterialButton</item>
<item name="checkboxStyle">@style/MauiCheckBox</item>
<item name="android:textAllCaps">false</item>
<item name="alertDialogTheme">@style/MauiAlertDialogTheme</item>
</style>
<style name="Maui.MainTheme.NoActionBar" parent="Maui.MainTheme">
<item name="windowActionBar">false</item>
Expand Down Expand Up @@ -66,6 +67,10 @@
<item name="android:minHeight">0dp</item>
</style>

<style name="MauiAlertDialogTheme" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<item name="colorPrimary">?attr/colorOnSurface</item>
</style>

<!--
The collectionViewScrollBars style will be used as the default style for ItemsViewRenderer (the base renderer
for CollectionView and CarouselView. We have to use a style to set up the scrollbars because there is currently
Expand Down

0 comments on commit cda3eb3

Please sign in to comment.