An open-source library to create an awesome draggable user interface

Publicado el 21/4/2014 por Pedro Gómez, Mobile Apps Engineer

DraggablePanel is a library that helps developers implement a cool user interface pattern based on a drag effect: a top panel that can be dragged to minimize it or to dismiss it and a bottom panel that is going to be hidden automatically while the user drag the top one. This UI pattern was implemented by YouTube’s developers to one of the latest version. They applied this new effect to their videos. This video shows how the library can be used:

Some months ago I saw that new UI effect and I thought: I have to implement that, I have create a library for other developers...that effect is really cool! I started coding and implementing some proof of concepts and two months later DraggablePanel is the result.

Technically the library is not very complex, it’s based on an Android SDK component called ViewDragHelper available on Android Support Library v4 to implement the drag effect. The library implementation it’s based on two main components:

  1. DraggableView: A configurable custom view created as a ViewGroup that will contain two views that will work as top and bottom view. All the DraggableView configuration can be provided by styleable xml attributes or programatically.
  2. DraggablePanel: Wrapper created in top of DraggableView to facilitate the usage of this component with fragments. This custom view can also be configured from xml or programatically.

Today, DraggablePanel already has 350 stars obtained in only one week. This library was a little challenge for me and now is one of the trending github java repositories of the week. I’m really proud of this job and I hope other developers start using it soon.

Tuenti Hosts the 5th PHPMad Meetup about Drupal

Publicado el 10/4/2014 por Eng. Outreach Committee

As every month, we hosted the 5th PHPMad meeting in the kitchen of our central Madrid office. Samuel Solís talked about Drupal as a framework. Drupal is a well known open-source CMS written in PHP. He brought us a new perspective of the product.

In addition to the PHPMad, we are open to hosting other user group meetings and talks so, if you’re interested in organising a tech or design-related event, get in touch!

Making your IDE better

Publicado el 03/4/2014 por Jaime Sánchez, Senior Software Engineer

If you use any of JetBrains' IDEs and you are a Vim lover like myself, you probably know the excellent IdeaVim plugin, which enables a Vim mode within the IDE. Most of the features of Vim are supported by IdeaVim but not all of them.

One feature that was missing and that I consider crucial for my everyday editing is showing the line numbers of the editor relative to the current caret position. With that, it is very simple to move the caret a few lines up or down to yank or edit some piece of code. If you want to jump to a line that you need to edit, you take a look at the number on its left and if it says 5, you type '5k' to go 5 lines up and do your edit. No need for your mouse and no need for typing 'k' 5 times :)

Since that was missing from IdeaVim and IdeaVim is open source, I went ahead and included that feature myself. Using JetBrain's Open Api it was a piece of cake (although a bit more of documentation on their side wouldn't hurt :P). Once I was done I created a pull request for the IdeaVim guys on Github to include my feature and went ahead and published the relative line numbers feature as an standalone plugin (so I didn't have to wait for the pull request to be approved to be able to enable the feature directly within my IDE).

Here's a screenshot of my editor with relative line numbers enabled:

An open-source library to make Android’s action bar shine out

Publicado el 01/4/2014 por Manuel Peinado, Mobile Apps Engineer

FadingActionBar is a library that helps developers implement a cool UI pattern: a picture occupies the top part of the screen, and the action bar is initially invisible. Once the user scrolls down to reveal more content, the action bar becomes opaque as the image disappears into the top of the screen. A picture is worth a thousand words:


It is fair to mention that I didn’t invent this pattern, I simply wrote the first open-source implementation of it. As far as I know it was introduced in the Play Music application about a year ago and then has been adopted by several other apps like Foursquare. My library has been just in the right place at the right time, when this pattern was growing really popular among the Android community, and it soon became successful. To be honest, its success caught me by surprise. At that time I had developed some other libraries that had not hit the 100 star mark on GitHub and I couldn’t even dream of ever having one that would reach 1000 stars. In fact I still cannot believe it!

In addition to the 1000-star milestone, I’m also proud to say that the library is currently used by several applications already in the Play Store, and that almost one year later people still add it to their new projects. In fact I get emails related to the library and new issues on Github almost every day, it’s hard to keep up with them.

Technically the library is not very complex, in fact I think I finished the first version in just a couple days. Then, I added some other improvements like ListView support (which is a bit buggy yet and I wish I had more time to devote to it) or WebView support. Another big improvement came with v3 a few months ago when I rewrote most of the library and added support for all action bar types (native, Sherlock and AppCompat) under a single project. Oh, and in case any test engineers from Tuenti are reading this, I have to admit that the library doesn’t have any unit tests. Sorry guys, I’ll do a better job next time!

Before I finish I would like to thank Android guru Cyrili Mottier because he wrote the blog post that made my library possible. If you are interested in knowing more about the way the library works internally, then his blog post is the place to go.

We host the MongoDB user group meetup at our office

Publicado el 28/3/2014 por Eng. Outreach Committee

Keeping in the loop with the newest database technologies, we hosted a special event from MongoDB user group in Madrid in our headquarters. This time, we have with us Massimo Brignoli, a senior solution architect at MongoDB Inc. He came expressly from Italy to share his thoughts about how to design your application database in the best possible way, giving all the assistants tips and tricks to boost their databases performance and what’s new on the table with MongoDB 2.6.

As usual, we are willing to hosting other user groups meetings and talks. Contact us if you have something astonishing in mind to share with the community!

Pages