Android-library for Full Screen Image View

Stfalcon.com
AndroidPub
Published in
3 min readOct 17, 2017

by Alexandr Krol

Nowadays we can see lots of new solutions for mobile app design, however there is one thing remaining unchangeable while interaction with them — intuitive gestures.

Each of us has already got used to the fact that in the content does not fit the size of the screen, it should be scrolled down. And if there are tabs at the top — swipe it. Or for additional function you should press it longer. All those things can never be found in the app description, because we are used to them as much as to interact with buttons and menu.

Image viewer has already became one of such patterns. When we see a full screen image, we expect it to be able to be zoomed in and viewed in details by means of specific gestures. Moreover, if we don’t meet our expectations, we think something is working wrong. Don’t we? And with this gesture one more is supposed to be included in order to close view mode quickly. For this you just swipe image up (for example, as it is realized in VK app).

Unfortunately, in the world of open source there is no any available and working solution. Moreover, for working with images we started to use popular Fresco library, that is requiring a bit different logic, so this case in not an exception.

For these reasons we had to develop our own solution, and since this task is quite out-of-the-box (and as we understood later, really in demand), we decided to make it available for public use.

We decided to take PhotoDraweeView as a basis. Even so zooming logic is well implemented, horizontal switching between images was far from perfect anyway.

After developing the switching between images and the possibility of closing the viewer by gestures, we decided to add background fade animation as well. We didn’t forget about the simplicity of using the library so that developers could implement the task in one line:

new ImageViewer.Builder(context, images).show();

And here is what we came up with:

When we analyzed existing cases, we decide to add the possibility of overlaying different elements, which can be closed/viewed simply by single tap to the image. This option gives to developer more freedom in setting up the viewer, even so they are still very flexible due to Fresco system.

Having all this options the library can be easily implemented to all the apps where the view function is needed. By the way, as practice shows it is often requested option. If you have this solution in your portfolio, you can undoubtedly apply this techniques wherever needed without any extra expenses.

That is the way we made our contribution to Android ecosystem and made life of developers much easier =)

FrescoImageViewer at Github page

Originally published at stfalcon.com.

Thanks for reading the end. Before you go:

Follow us on Instagram, YouTube, and TikTok to see the company lifestyle.

Follow us on Bēhance, Dribbble, and Stfalcon to find design case studies.

Please consider clapping and following the blog!

--

--

Stfalcon.com
AndroidPub

IT company designing custom web services and mobile apps. Our goal is to create useful and convenient software. We are the founder of the Air Alert app