Automate your app screenshots

with fastlane screengrab and Android Demo Mode

Published in
3 min readJan 21, 2018

--

Following my previous post about how to clean the status bar to take nice screenshots of your app using the Demo Mode of Android, here I will show you how you can automate the process of taking screenshots.

I chose to use the screengrab tool from fastlane because it’s an open source tool that allows you to automate the generation of screenshots. So first of all you need to install the tools (take a look to the official documentation to install fastlane and screengrab) and setup the UI tests for the screen generation.

You could configure screengrab with its screengrabfile, but I decided to create a shell script in order to use the Android Demo Mode to launch the broadcasts through command line. Let me show you how.

Creating the script

In a new shell script file, declare the locales to use and the paths to your app and tests builds. Also you need to assemble the builds and clear previous screenshots (if you don't clean this folder, all previous screenshots will appear in the final report again!):

Second, you declare one method to enter the Demo Mode and mock the status bar and one method to exit it:

and finally for every locale, you will start the Demo mode, call fastlane screengrab to take the screenshots and exit the Demo mode at the end:

You can take a look to the whole shell script here:

Now you need to start an emulator (or create a script for that 😉) and run the script from terminal:

# run the script
./screenshot.sh

Once the script runs, it will generate an HTML report with the screenshots it took for every locale. Let's check the screenshots generated:

Great! You have your automated screenshot with a clean status bar! Yay!!! 🎉

Adding more locales

Probably you also want to generate screenshots in different locales to upload them to Google Play Store. You simply need to add the locales to the list:

locales=('en-US' 'es-ES')

After running the script again, you will get an HTML report with the screenshots generated for all the locales.

If you are using an emulator with a recent API version (26 or 27) you will notice some problems. See:

As you can see, for the second locale not only the Demo mode was lost but the status bar is wrong! 😧

The problem

The screenshots in this post were generated with emulators running Android API 27. With API 26 I had the same issues, but with API 25 worked pretty well.

Debugging I found out that the Demo mode works as expected in the second iteration, but once the locale is changed by screengrab, the status bar gets messed up. As far as I’ve seen, the issue seems to be in the LocaleTestRule() from screengrab.

Shortly after publishing this post, Hugo Visser on twitter posted a solution using a custom test rule for Espresso which enables the demo mode. And it works! 🙌 🎉 Check it out here:

Do you have ideas, suggestions or even solutions for this issue? Please let me know! 💚

--

--

Android & Flutter Developer | Flutter/Dart GDE | I like cute things (✯◡✯)