23

I'm starting to implement dark mode on my app and I'm using Theme.AppCompat.DayNight.NoActionBar. Everything is working fine on the device but I want to see the differences on the Android Studio so I don't have to keep running the code in order to see the changes.

How can I switch the Android Studio Preview to show me the night mode vs light mode themes?

Thanks.

Edit: just to be clear, I want to show on Preview whatever I have on resource folders -night instead of the normal resource folder.

casolorz
  • 8,486
  • 19
  • 93
  • 200

4 Answers4

47

If you're using the most recent version of Android Studio, you should see a dropdown titled with the default theme that you're using when you're in preview mode on the Design Editor. Click on that dropdown (the callout labelled "5") to access the list of themes:

Toolbar callouts in the Design Editor

^ Image taken directly from the documentation.

You can then click on the "Orientation for Preview" icon (see callout "2") to access a list of layout variants for the current layout. (See the documentation for more info on how to create a layout variant.)

For more info, check out the documentation for what the buttons on the toolbar are.

Edric
  • 24,639
  • 13
  • 81
  • 91
15

On the "Design" View in Android studio, select the un-intuitive "rotate device" icon for the drop down to select Night Mode.

enter image description here

Angel Koh
  • 12,479
  • 7
  • 64
  • 91
2

you need to be in Design window(!)

prt sc night mode

Adi Shumely
  • 367
  • 3
  • 5
-4

For simplicity, It is suggested to create a switch on the setting page or the bottom tab buttons for setup.

Hence, you need to define the color of the dark theme and light theme for greater degree of customization.

enter image description here

Jeff Bootsholz
  • 2,971
  • 15
  • 70
  • 141
  • Please consider converting your image to a textual format such that it is easier to read and for a11y purposes. See https://meta.stackoverflow.com/q/303812 for more info. – Edric Oct 18 '19 at 02:05