10
Jun
ic_launcher

Every few months, Google experiments with a new design, widget, or pattern by injecting it into one of its most important apps. Preceding I/O 2013, we were treated to a steady stream of updates including the new Navigation Drawer. As we have seen, the latest GMail app joined the herd, but also gained a tweaked version of the now common pull-to-refresh gesture. While Google was kind enough to supply us with a library for the Navigation Drawer, anybody hoping to add the newly-stylized refresh is left to fend for themselves. Fortunately, the developer community is filled with people who can't wait for El Goog to get caught up. Among the generous developers open sourcing their code, Chris Banes brings his own implementation of the new pull-to-refresh.

header

Screenshot_2013-06-10-06-35-04Screenshot_2013-06-10-06-35-53Screenshot_2013-06-10-06-36-09

If you would like to see it in action, start by grabbing the sample app here. The library works with Honeycomb (API Level 11) and above, but Chris intends to add compatibility for ActionBarSherlock and ActionBarCompat to reach earlier versions of Android. There are also plans to extend and improve on customization options like header styles and drawable animations. While the sample demonstrates two different pull animations, a text percentage and a line that stretches from left-to-right, there is not yet an exact copy of GMail's, which stretches from the center outward. That is also on the to-do list.

Chris is careful to point out that this is still a preview and changes to the API should be expected. If you would like to give it a shot and add a little different flare to your app, check out the code and instructions on the Github page.

[Github]

Cody Toombs
Cody is a Software Engineer and Writer with a mildly overwhelming obsession with smartphones and the mobile world. If he’s been pulled away from the computer for any length of time, you might find him talking about cocktails and movies, sometimes resulting in the consumption of both.

  • PhineasJW

    Cool. Thanks.

  • sivkai

    I'm curious, why hasn't Google implemented this feature on their Google+ app? Even the iOS version has fancier animations than ours...what gives?

    • Daeshaun Griffiths

      Only time will tell. G+ doesn't have the swipeable side menu either. I'm sure it'll come.

    • http://tinyroar.com Cats-R-Friend

      A lot of the new design is not present in G+, there will probably be an update out soon with this and the new hamburger side tray

    • Satish Odedra

      They are probably busy with moving G+ messenger history to Hangouts. Once they complete the transaction, they'll update the G+ app which should remove G+ messenger and probably come with new interface.

  • Zhelyazko Atanasov

    There are some issues right now. But he will probably fix them soon. It's a great lib and his intention is to add an implementation like the one in the new Gmail app.

  • Dominic Powell

    I think they need to integrate google's colors into this action bar pull to refresh

    if it animated red green yellow and blue like their apple apps and hangouts online it would be a neater integrated element

    • sivkai

      Agreed. As much as I like Gmail's 'Pull-To-Refresh' effect, the iOS animations are something different altogether. They are more vibrant and refreshing (no pun intended) than their Android equivalent.

  • Lupe Fiasco

    For those wondering why the new Pull to refresh hasn't been implemented anywhere else besides Gmail, Roman Nurik made a Comment on a Google+ post saying this - "
    This isn't an "officially recommended" pattern right now. As with any new UI treatment in a Google app, until there are official guidelines, I would treat it as a design exploration rather than a recommended pattern." So if everyone ends up liking the new Pull To Refresh (Which Most people do) then it should make it's way to other Google Apps over time.

    • http://www.androidpolice.com/author/cody-toombs/ Cody Toombs

      Honestly, I'm not a huge fan of pull to refresh in most apps, including GMail. I feel like it makes sense in something like Falcon Pro or other Twitter clients because they are already designed around a chronological list with the most recent item at the top of the list. Anything you've already seen is destined to disappear. The pattern works because the list is fundamentally intended to only move in one direction, which inevitably has the user gesturing in the same direction. Other than chronological sorting, nothing about that describes GMail to me. I don't mind pull-to-refresh existing in GMail, but I really hope that the menu-bound refresh doesn't go away.

      • didibus

        Isn't the list in gmail chronological also? I feel like I always get newer mail at the top, there is no way that a refresh would cause a new entry down the list to appear. Oh, though now that I think of it, maybe the read or starred status could necessitate a refresh.

        Honestly, I'd prefer push to handle things like stars and read statuses, or even labels. But the pull to refresh makes sense, because in a way it's like, I want to keep going up, to see what is newer, so ya, your right, it applies to chronological lists.

        • http://www.androidpolice.com/author/cody-toombs/ Cody Toombs

          "Other than chronological sorting, nothing about that describes GMail to me."

          I did say gmail was chronological.

          When I'm checking my messages, I move up and down the list quite a bit. I also manage email (deleting, staring, tagging, whatever) from several devices at once. The side effect of those two things is that I can sometimes be in the middle of a list when I want to refresh. Really, if there is ever a time somebody won't be at the top of the list when it makes sense to refresh, then the user will be annoyed by having to travel to the top to perform a sync.

          • didibus

            Ya, I figured later on you were talking about starring, read/unread, labels, etc. for which I think instant push refresh would be best. But ya, pretty glad they have the refresh button as an in between solution to this. Also, really glad that on refresh it doesn't bring the list back to the top like a lot of other app do.

  • http://gplus.to/graemestanding Graeme Standing

    I prefer (in my personal opinion) calling it "swipe to refresh". There isn't a "pull" to it anymore.

    • didibus

      True that, even the label says Swipe Down to Refresh and not Pull