Facebook lide slideout menu (Not using that library)

Question

I want to have facebook like menu in my application. There are many threads on this and all of them suggest to use a library which actually just takes a screenshot of the screen and slides that image towards right so as to show menu on left hand side and slide image with some transition. But in that case, the layout on the right is not clickable since its an image.

But I have some another way of doing it in which I have a Root Layout which already has Menu Layout and Content Layout. But root layout is set some negative margin towards left so it is not visible. Like this-

Content when menu is not pressed

When user presses menu button, the Menu Layout is slid to the right and root layout's left margin is set to 0. So now what we see is this-

Content when menu is pressed and menu layout is shown

Now, The real problem starts here

I want to slide both the layouts with some animation. So when I animate the Menu layout & Content Layout, the animation for both the layouts is not at same speed even if I am applying same animation to it. So I tried to Shift ROOT LAYOUT only towards right/left by setting margin to it. But on doing so nothing is shown on the screen. Where am I going wrong. The way I set margin is shown here-

int width = leftLayout.getWidth();
isLayoutShown = !isLayoutShown;
if(isLayoutShown){
    rootLayoutParams.setMargins(0, 0, 0, 0);
    rootLayout.setLayoutParams(rootLayoutParams);    
}else{
    rootLayoutParams.setMargins(-width, 0, 0, 0);
    rootLayout.setLayoutParams(rootLayoutParams);
}

Yes, the problem is solved somehow. Please check the answer below. — Rajkiran
You might want to look at the answers to this question : stackoverflow.com/q/17884277/1491212 — Armel Larcier

Rajkiran Rajkiran · Accepted Answer · 2012-07-10T06:03:13

Finally somehow I could do it. Here's the code used when I click on the menu button on the left top corner:

@Override
public void onClick(View v) {
rootLayoutParams = new LayoutParams(rightLayout.getWidth(),
    rightLayout.getHeight());

if (lhsMenu.getVisibility() == View.GONE) {
    lhsMenu.setVisibility(View.VISIBLE);
    Animation slideRight = setRightSlidingAnimation();
    rightLayout.setAnimation(slideRight);
    lhsMenu.setAnimation(slideRight);
} else {
    Animation slideLeft = setLeftSlidingAnimation();
    rightLayout.setAnimation(slideLeft);
    lhsMenu.setAnimation(slideLeft);
    lhsMenu.setVisibility(View.GONE);
    }
}

Update: Also set margin to left and right (if needed) of rightLayout so that the rightLayout will not shrink.

_rightLayoutParams.setMargins(width, 0, -width, 0);

where width = 200 in my case.

Facebook lide slideout menu (Not using that library)

1 Answers