Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark Theme Support #28

Closed
Devo7v opened this issue Jun 8, 2020 · 14 comments
Closed

Dark Theme Support #28

Devo7v opened this issue Jun 8, 2020 · 14 comments
Labels
enhancement New feature or request

Comments

@Devo7v
Copy link

Devo7v commented Jun 8, 2020

It would be nice to support Android's system wide dark mode implementation in Android 10+. This could be implemented in 2 locations:

  1. The settings menus for ToDo Agenda. 3 options make sense here: light, dark, & system default.
  2. The widget itself. In many cases the widget is shown on a wallpaper which doesn't change when dark mode is toggled. However, it is possible through the use of third party apps to change the wallpaper when dark mode is toggled. In these cases it would be useful to be able to set up a second set of colors within ToDo Agenda that is activated when dark mode is toggled. Again, this could be optional similar to how the settings menu option is implemented.
@yvolk
Copy link
Member

yvolk commented Jul 11, 2020

@Devo7v Thank you for suggestion. Yes, I see this documentation page with most of information needed to implement Dark Mode: https://developer.android.com/guide/topics/ui/look-and-feel/darktheme

There are two major app/widget changes needed for this:

  1. Allowing for a User to have TWO sets of colors (for each widget, of course) instead of one available now.

Optional feature: Allowing to switch between them manually (in the Widget's settings). This feature itself is not very needed: who would like to change widget's setting every evening and every morning? :-).

  1. Automatic switching of widget colors between Day (Light) and Night (Dark) modes. This requires changing references in the widget's layouts to the "night-qualified resources" (cited from documentation). So a User wouldn't need to go to our widget's setting to switch Dark mode on or off: system-wide settings will be used.

Meanwhile (and especially for Android 9-) a User can create TWO widgets: one for general use and another (on some "Night home screen") - for use at night. Not very bad, I would say?!

@yvolk yvolk added the enhancement New feature or request label Jul 11, 2020
@Devo7v
Copy link
Author

Devo7v commented Jul 11, 2020

Exactly. Right now I'm manually changing 5 colors (all the text colors) from light to black and back again when dark mode turns on and off. I was able to pick a background color that looks good on both light and dark mode so I don't need to adjust them.

Hopefully you can come up with an elegant method of allowing the user to set 2 colors because I would love got the widget to automatically change when dark mode turns on/off. Thank you for considering this suggestion.

@yvolk
Copy link
Member

yvolk commented Jul 11, 2020

Right now I'm manually changing 5 colors (all the text colors) from light to black and back again when dark mode turns on and off. I was able to pick a background color that looks good on both light and dark mode so I don't need to adjust them.

I would suggest for you to create / allocate one Home screen specifically for Dark Mode, and create another ToDo Agenda widget instance on that page with "Night colors". So you wouldn't need to change colors, but look at different Home screens instead
?!

@Devo7v
Copy link
Author

Devo7v commented Jul 31, 2020

If implementing a dark mode for the widget isn't high on you list, do you think you could at least implement a dark mode to the settings screen? It is blinding at night when I'm changing color settings.

@yvolk
Copy link
Member

yvolk commented Aug 2, 2020

@Devo7v I'll look into this...

@yvolk yvolk changed the title [Feature Request] Dark Mode Support [Feature Request] Dark Theme Support Sep 1, 2020
@yvolk yvolk changed the title [Feature Request] Dark Theme Support Dark Theme Support Sep 1, 2020
@yvolk
Copy link
Member

yvolk commented Sep 1, 2020

Hi @Devo7v . Today I added Dark theme support for the widget's Settings screens. Theme of Settings screens switches automatically with Android system-wide "Dark theme" switch. Available since v.4.2.2. See #3

@Devo7v
Copy link
Author

Devo7v commented Sep 1, 2020

Works as expected and looks great, thanks for implementing this in the settings.

I'm going to leave this open for now in hopes that you're able to implement a similar functionality for the widget. It could be as simple as one checkbox to invert text color and another checkbox to invert background color.

@yvolk
Copy link
Member

yvolk commented Sep 1, 2020

@Devo7v Thanks for the feedback and inspiration!
Yes, I plan to add "Dark theme" switch to a widget itself also. Technically this looks easy, but I didn't decide on some important things yet. Will be glad to hear your or other user's opinions.

  1. Which settings should be different for Dark / Light themes?
    The first thought is: "Colors" section only. But maybe a User would like e.g. to increase text size at night?! ... Or maybe make changes in "Layout" section also...

  2. "Dark theme" switch with three options: "Dark / Light / Auto". Where should I place it?

@Devo7v
Copy link
Author

Devo7v commented Sep 1, 2020

Personally, I would think only the colors section would need to be dynamic. If the text size or layout changes I would think that would be a separate widget at that point. The dark theme switch should be located in the Colors section and should probably only be a check box to follow the system dark mode when activated. The more I think through this the more complicated it could get. I think you have 3 paths forward:

  1. Activating dark mode simply inverts the text and background colors. This could be a simple check box for each item in the Colors section.
  2. Duplicate the Colors section to have 1 for "light mode" and 1 for "dark mode". The "dark mode" settings menu would be inaccessible or hidden if the user does not want to follow the system theme.
  3. Allow the user to assign 1 widget to light mode and another widget to dark mode. This would require a bit of a rework of the settings menu. The user would need to be able to select different widget names from a drop down and assign 1 to light mode and 1 to dark mode. This would likely be it's own section within the settings menu. Bonus points if you can figure out how to allow the user to "see" what the widget will look like.

The first two options simply modify the colors of the existing widget, the third option is more complex, but also allows the user to completely change everything about the widget if dark mode is activated including the text size and layout you mentioned.

@yvolk
Copy link
Member

yvolk commented Sep 1, 2020

  1. @Devo7v So it looks like "Dark theme" switch with three options: "Dark / Light / Auto" is not needed: "Dark theme" checkbox is enough. And for Android 10+ only!

A User either wants to follow Android system-wide Dark theme on/off changes (and thus needs the second set of some settings for "Dark theme"...) or not (and hence no need in that second set of settings).

  1. The checkbox should be placed in "Colors" section and have a name: "Different for Dark theme". Only colors will differ when system-wide Dark theme is on.

  2. And now, how / where do we place the second "Colors" section?
    It could be very simple: NO need in a separate section in Settings! A User turns "Dark theme" on in the Android system menu (or a notification area, no matter...) - and then our widget understands that now the User will configure "Dark theme" settings in the same Settings screens!

?!

@Devo7v
Copy link
Author

Devo7v commented Sep 1, 2020

On the main settings menu you could place a checkbox between the Layout and Colors sections, "Different Colors for Android System Dark Mode". This should only show up on Android 10+. If the user checks that box, a new section appears between Colors and Event Details, "Colors for Dark Mode". This would have the same settings as the Colors section and it should be prepopulated with the values from the Colors section unless the user modifies them.

EDIT: As I mentioned previously if you want to add more configuration than just the colors I think you're allowing the user to set up two different widgets and then select which one gets shown during light mode and dark mode.

@yvolk
Copy link
Member

yvolk commented Sep 15, 2020

@Devo7v Implemented in v.4.3.0, please check #3

Different colors for Android system Dark theme option added for Android 10+.
When this option is turned on, the widget uses different sets of colors for Dark and Light themes. Configured sets of colors are switched automatically following changes of the device-wide Dark theme switch.
Both sets of colors are configured in the same "Colors" settings section of "ToDo Agenda". Colors for "Dark theme" are configured, when Android system Dark theme is turned on. Colors for "Light theme" are configured, when Android system Dark theme is turned off.

@Devo7v
Copy link
Author

Devo7v commented Sep 15, 2020

I just updated and tried it. It works as expected. I understand why you have kept everything in a single menu, but I think you need a couple tweaks to make it more obvious:

  1. Say somewhere on the screen what mode the user is in when editing the colors. It's not obvious unless you already know.
  2. If you're in the colors settings and you toggle dark mode, the color settings do not toggle. You need to completely back out of settings and then open them up again to change colors for the other mode. This also causes an issue, if you toggle dark mode when in settings it takes whatever colors you have set and uses them for the other mode. You end up losing your settings.

I would suggest having a separate menu for dark mode colors that shows up when you enable dark mode support. Just as I described in my previous comment. Hopefully this could avoid some confusion and save the settings if toggling dark mode when the settings are open.

yvolk added a commit that referenced this issue Sep 18, 2020
@yvolk
Copy link
Member

yvolk commented Sep 18, 2020

@Devo7v Thank you for testing. As you suggested, I made currently being edited theme explicit by changing Colors section title.
As I see, switching "Dark theme" on and off during Settings editing works also.
Please see v.4.3.1 #3
Screenshot_1600407341

@yvolk yvolk closed this as completed Sep 25, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants