如何使后台活动较小，同时打开抽屉式导航栏？ [英] How to make background Activity smaller while opening the Navigation Drawer?

问题描述

我要让我的背景活动稍微小了一点，同时打开抽屉式导航，模拟效果存在于制作的Airbnb 应用程序。我想最好的解释是截图：

I want to make my background Activity a little bit smaller while opening the Navigation Drawer, Simulate the effect that exists in the Airbnb application. I guess the best explanation would be a screenshot:

但问题是，不使视图只是小，但要使其成为被同步到抽屉打开/关闭动画的动画。所以，如果你开始打开抽屉的中间决定停止并返回，背景活动规模将受到相应的影响。

But the point is not to make the View just smaller, but to make it an animation that is synchronized to the Drawer Open/Close animation. So if you started to open the Drawer an in the middle decided to stop and go back, the background Activity scale will be affected accordingly.

这怎么使用DrawerLayout构建做些什么呢？是否有一些这方面的执行？

How can this be done using the build in DrawerLayout? Is there some implementation for this?

在此先感谢。

推荐答案

您可以通过执行此效果的<一个href=\"http://developer.android.com/reference/android/support/v4/app/ActionBarDrawerToggle.html\">ActionBarDrawerToggle 在支持库V4。

You can perform this effect using the ActionBarDrawerToggle in the support library v4.

所有你需要做的是重写onDrawerSlide方法来检索抽屉菜单开幕％，然后扩展您的FrameLayout您的片段放在

All you have to do is to Override onDrawerSlide method to retrieve the opening % of the drawer menu, and then scale your FrameLayout where your fragment is placed in.

与code示例：

main_layout.xml

main_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

    <FrameLayout android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>    

    <ListView android:id="@+id/left_drawer"
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:choiceMode="singleChoice"
    android:divider="@android:color/transparent"
    android:dividerHeight="0dp"/>

</android.support.v4.widget.DrawerLayout>

现在在你的活动持有的抽屉：

Now in your Activity which holds the Drawer:

public class ConfigurerActivity extends ActionBarActivity 
{
    private DrawerLayout mDrawerLayout;
    private ListView mDrawerList;
    private ActionBarDrawerToggle mDrawerToggle;
    private FrameLayout frame;
    private float lastScale = 1.0f;

    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_layout);

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerList = (ListView) findViewById(R.id.left_drawer);
        frame = (FrameLayout) findViewById(R.id.content_frame);

        mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_drawer, R.string.acc_drawer_open, R.string.acc_drawer_close) 
        {            
            @SuppressLint("NewApi")
            public void onDrawerSlide(View drawerView, float slideOffset)
            {
                float min = 0.9f;
                float max = 1.0f;
                float scaleFactor = (max - ((max - min) * slideOffset));

                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) 
                {
                    frame.setScaleX(scaleFactor);
                    frame.setScaleY(scaleFactor);
                }
                else
                {               
                    ScaleAnimation anim = new ScaleAnimation(lastScale, scaleFactor, lastScale, scaleFactor, frame.getWidth()/2, frame.getHeight()/2);
                    anim.setDuration(0);
                    anim.setFillAfter(true);
                    frame.startAnimation(anim);

                    lastScale = scaleFactor;
                }
            }
        };

        mDrawerLayout.setDrawerListener(mDrawerToggle);

        // ... more of your code
    }
}

请注意，我用2个不同的方式向规模化，因为setScaleX / Y不在pre可用 - 蜂窝的Andr​​oid版本

Note that i use 2 different methods to scale, because setScaleX/Y are not available in PRE - Honeycomb Android versions.

有了这个，你可以设置自己的比例因子（我认为0.9F它足够小），或者尝试新的效果（变色）的基础上抽屉的开启％。

With this, you can set your own scaleFactor (i think 0.9f its small enough) or maybe try new effects (change color) based on the opening % of the drawer.

希望它帮助。

这篇关于如何使后台活动较小，同时打开抽屉式导航栏？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！