Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Facebook style slide

The new Facebook application and its navigation is so cool. I was just trying to see how it can be emulated in my application.

Anyone has a clue how it can be achieved?

enter image description here

On clicking the the top left button the page slide and the following screen is shown:

enter image description here

YouTube Video

like image 693
Harsha M V Avatar asked Dec 28 '11 15:12

Harsha M V


3 Answers

I've had a play with this myself, and the best way I could find was to use a FrameLayout and lay a custom HorizontalScrollView (HSV) on top of the menu. Inside the HSV are your application Views, but there is a transparent View as the first child. This means, when the HSV has zero scroll offset, the menu will show through (and still be clickable surprisingly).

When the app starts up, we scroll the HSV to the offset of the first visible application View, and when we want to show the menu we scroll back to reveal the menu through the transparent View.

The code is here, and the bottom two buttons (called HorzScrollWithListMenu and HorzScrollWithImageMenu) in the Launch activity show the best menus I could come up with:

Android sliding menu demo

Screenshot from emulator (mid-scroll):

Screenshot from emulator (mid-scroll)

Screenshot from device (full-scroll). Note my icon is not as wide as the Facebook menu icon, so the menu view and 'app' view are not aligned.

Screenshot from device (full-scroll)

like image 55
Paul Grime Avatar answered Nov 18 '22 07:11

Paul Grime


I've implemented facebook-like slideout navigation in this library project.

You can easy built it into your application, your UI and navigation. You will need to implement only one Activity and one Fragment, let library know about it - and library will provide all wanted animations and navigation.

Inside the repo you can find demo-project, with how to use the lib to implement facebook-like navigation. Here is short video with record of demo project.

Also this lib should be compatible this ActionBar pattern, because is based on Activities transactions and TranslateAnimations (not Fragments transactions and custom Views).

Right now, the most problem is to make it work well for application, which support both portrait and landscape mode. If you have any feedback, please provide it via github.

All the best,
Alex

like image 41
AlexKorovyansky Avatar answered Nov 18 '22 07:11

AlexKorovyansky


Here is another lib and seems to be the best in my opinion. I did not write it..

UPDATE:

This code seems to work best for me and it moves the entire Actionbar similar to the G+ app.

How did Google manage to do this? Slide ActionBar in Android application

like image 24
Patrick Avatar answered Nov 18 '22 05:11

Patrick