• Migrating to RecyclerView from ListView

    Google introduced RecyclerView as a part of the support library as the next-gen ListView. It’s new, efficient and highly customisable, no wonder everyone wants to make the switch. This step-by-step guide will show you how to migrate from an existing ListView (or GridView / StaggeredGridView / ExpandableListView), replacing the implementation with a RecyclerView. (more)

  • Translucent system bars + ListView done right

    About a year ago, Google introduced the translucent UI in KitKat, making the system bars transparent, with a hint of black gradient. After activating, apps are able to draw under the status bar (the one on top of the screen, with the notifications) and the navigation bar (this is optional, only present devices with no hardware buttons, at the bottom of the screen, contains the back, home and app switcher keys), which can result in a slick and modern user experience if done right. (more)

  • A look at the Palette class

    Back in February, Chris Banes’ two excellent blog posts (color matching part one and part two) demonstrated how can we extract the dominant colors from a bitmap. This can be a powerful asset to the user experience of your app: think about dynamically colored UI elements, or a filter based on the dominant color of your bitmap. The Palette class from the new Support Library announced at Google I/O does the same. (more)

  • ParallaxViewPager: parallax background effect for the ViewPager

    The so-called parallax effect is common in both web design and in mobile apps, it can be found on the major platforms, from Windows Phone to iOS through Android. According to Wikipedia, Parallax scrolling is a special scrolling technique in computer graphics, wherein background images move by the camera slower than foreground images, creating an illusion of depth (…). A popular, but not over-used effect, which goes well with a ViewPager and can do wonders with the user experience. The Android SDK doesn’t provide a built-in way to achieve it, so I created my own interpretation. (more)

  • How to dim bitmaps with RenderScript

    RenderScript was introduced with Honeycomb, aka API level 11. It is an API designed for performance intensive computations by executing native code on the device. These segments run either on the CPU or the GPU - this is not for the developer to decide, it is determined in runtime. I won’t go into more detail since there are a lot of comprehensive articles out there, for more info check out the documentation at the end of the post. This short tutorial is about how to write RenderScript code for simple image manipulation tasks. (more)

  • Using the SwipeRefreshLayout

    The pull to refresh is a UI pattern long since present in mobile applications - it makes the user able to refresh the current view with a vertical swipe. It’s most commonly used in iOS apps, although it can also be found in quite a few Android apps. Not long ago Google made an Androidified version (first appeared in Google Now), where the refresh indicator is built into the ActionBar. Although a great library was available for a couple of months now (ActionBar-PullToRefresh by Chris Banes), Google added an official way to to achieve this effect to the Support Library v19.1.0, called SwipeRefreshLayout. (more)

  • Creating custom notification cards with the Android Wear Developer Preview

    When Google presented Android Wear, we started to experiment with the Developer preview, and while at this time we’re limited to using only notifications (since currently, there is no real Android Wear SDK), the results are surprisingly good. This example will show you how to create a horizontally swipeable, card-like notification for Android Wear. (more)

  • Creating View reflections

    Although it looks like the age of skeuomorphism and over-designed apps is finally over, you shouldn’t forget everything you’ve learned in that era. One of the effects is reflection, which can be good and bad at the same time: overusing can make your UI look cheesy and bloated, but sometimes it’s the right thing to use to boost the UX. This tutorial will show you how to create the faded reflection of any View subclass. (more)