我在新的材质设计侧导航规范中看到,你可以在操作栏上方和状态栏后面显示抽屉。我如何实现这个?


当前回答

随着最新的Android支持库(rev 22.2.0)的发布,我们有了一个设计支持库,作为它的一部分,一个名为NavigationView的新视图。我们不用自己用ScrimInsetsFrameLayout做所有的事情,我们只用这个视图,所有的事情都为我们完成了。

例子

步骤1

将设计支持库添加到构建中。gradle文件

dependencies {
    // Other dependencies like appcompat
    compile 'com.android.support:design:22.2.0'
}

步骤2

添加NavigationView到你的DrawerLayout:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/drawer_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:fitsSystemWindows="true"> <!-- this is important -->

     <!-- Your contents -->

     <android.support.design.widget.NavigationView
         android:id="@+id/navigation"
         android:layout_width="wrap_content"
         android:layout_height="match_parent"
         android:layout_gravity="start"
         app:menu="@menu/navigation_items" /> <!-- The items to display -->
 </android.support.v4.widget.DrawerLayout>

步骤3

在/res/menu中创建一个新的菜单资源,并添加你想要显示的项目和图标:

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_home"
            android:icon="@drawable/ic_action_home"
            android:title="Home" />
        <item
            android:id="@+id/nav_example_item_1"
            android:icon="@drawable/ic_action_dashboard"
            android:title="Example Item #1" />
    </group>

    <item android:title="Sub items">
        <menu>
            <item
                android:id="@+id/nav_example_sub_item_1"
                android:title="Example Sub Item #1" />
        </menu>
    </item>

</menu>

步骤4

Init NavigationView并处理点击事件:

public class MainActivity extends AppCompatActivity {

    NavigationView mNavigationView;
    DrawerLayout mDrawerLayout;

    // Other stuff

    private void init() {
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mNavigationView = (NavigationView) findViewById(R.id.navigation_view);
        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {
                mDrawerLayout.closeDrawers();
                menuItem.setChecked(true);
                switch (menuItem.getItemId()) {
                    case R.id.nav_home:
                        // TODO - Do something
                        break;
                    // TODO - Handle other items
                }
                return true;
            }
        });
    }
}

步骤5

请务必在value -v21中设置android: windowdrawssystembarbackground和android:statusBarColor,否则你的抽屉将不会在状态栏下显示

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Other attributes like colorPrimary, colorAccent etc. -->
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

可选步骤

在NavigationView中添加一个头。为此,只需创建一个新的布局,并添加app:headerLayout="@layout/my_header_layout"到NavigationView。

结果

笔记

突出显示的颜色使用了通过colorPrimary属性定义的颜色 列表项使用通过textColorPrimary属性定义的颜色 图标使用通过textColorSecondary属性定义的颜色

你也可以检查Chris Banes的示例应用程序,它突出了NavigationView和其他新视图,这些新视图是设计支持库的一部分(如FloatingActionButton, TextInputLayout, Snackbar, TabLayout等)。

其他回答

这里提到的所有答案都太旧太长了。与最新的Navigationview一起工作的最佳和简短的解决方案是

@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
    super.onDrawerSlide(drawerView, slideOffset);

    try {
        //int currentapiVersion = android.os.Build.VERSION.SDK_INT;
        if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP){
            // Do something for lollipop and above versions

        Window window = getWindow();

        // clear FLAG_TRANSLUCENT_STATUS flag:
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

        // add FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS flag to the window
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);

        // finally change the color to any color with transparency

         window.setStatusBarColor(getResources().getColor(R.color.colorPrimaryDarktrans));}

    } catch (Exception e) {

        Crashlytics.logException(e);

    }
}

这将改变你的状态栏颜色为透明当你打开抽屉

现在,当你关闭抽屉,你需要改变状态栏颜色再次为深色。你可以这样做。

        public void onDrawerClosed(View drawerView) {
        super.onDrawerClosed(drawerView);
        try {
    if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP){
    // Do something for lollipop and above versions

    Window window = getWindow();

    // clear FLAG_TRANSLUCENT_STATUS flag:
    window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

    // add FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS flag to the window
    window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);

    // finally change the color again to dark
    window.setStatusBarColor(getResources().getColor(R.color.colorPrimaryDark));}
    } catch (Exception e) {
    Crashlytics.logException(e);
                    }
                    }

然后在主布局中添加一行

            android:fitsSystemWindows="true"

你的抽屉布局会是这样的

            <android.support.v4.widget.DrawerLayout     
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/drawer_layout"
            android:fitsSystemWindows="true"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

导航视图是这样的

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/navigation_header"
        app:menu="@menu/drawer"
        />

我已经测试过了,它完全可以工作。希望它能帮助到别人。这可能不是最好的方法,但它工作平稳,实现简单。 如果有用的话,做个记号。快乐编码:)

随着最新的Android支持库(rev 22.2.0)的发布,我们有了一个设计支持库,作为它的一部分,一个名为NavigationView的新视图。我们不用自己用ScrimInsetsFrameLayout做所有的事情,我们只用这个视图,所有的事情都为我们完成了。

例子

步骤1

将设计支持库添加到构建中。gradle文件

dependencies {
    // Other dependencies like appcompat
    compile 'com.android.support:design:22.2.0'
}

步骤2

添加NavigationView到你的DrawerLayout:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/drawer_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:fitsSystemWindows="true"> <!-- this is important -->

     <!-- Your contents -->

     <android.support.design.widget.NavigationView
         android:id="@+id/navigation"
         android:layout_width="wrap_content"
         android:layout_height="match_parent"
         android:layout_gravity="start"
         app:menu="@menu/navigation_items" /> <!-- The items to display -->
 </android.support.v4.widget.DrawerLayout>

步骤3

在/res/menu中创建一个新的菜单资源,并添加你想要显示的项目和图标:

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_home"
            android:icon="@drawable/ic_action_home"
            android:title="Home" />
        <item
            android:id="@+id/nav_example_item_1"
            android:icon="@drawable/ic_action_dashboard"
            android:title="Example Item #1" />
    </group>

    <item android:title="Sub items">
        <menu>
            <item
                android:id="@+id/nav_example_sub_item_1"
                android:title="Example Sub Item #1" />
        </menu>
    </item>

</menu>

步骤4

Init NavigationView并处理点击事件:

public class MainActivity extends AppCompatActivity {

    NavigationView mNavigationView;
    DrawerLayout mDrawerLayout;

    // Other stuff

    private void init() {
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mNavigationView = (NavigationView) findViewById(R.id.navigation_view);
        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {
                mDrawerLayout.closeDrawers();
                menuItem.setChecked(true);
                switch (menuItem.getItemId()) {
                    case R.id.nav_home:
                        // TODO - Do something
                        break;
                    // TODO - Handle other items
                }
                return true;
            }
        });
    }
}

步骤5

请务必在value -v21中设置android: windowdrawssystembarbackground和android:statusBarColor,否则你的抽屉将不会在状态栏下显示

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Other attributes like colorPrimary, colorAccent etc. -->
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

可选步骤

在NavigationView中添加一个头。为此,只需创建一个新的布局,并添加app:headerLayout="@layout/my_header_layout"到NavigationView。

结果

笔记

突出显示的颜色使用了通过colorPrimary属性定义的颜色 列表项使用通过textColorPrimary属性定义的颜色 图标使用通过textColorSecondary属性定义的颜色

你也可以检查Chris Banes的示例应用程序,它突出了NavigationView和其他新视图,这些新视图是设计支持库的一部分(如FloatingActionButton, TextInputLayout, Snackbar, TabLayout等)。

这是最简单的,对我来说很管用:

在值-21中:

<resources>
    <style name="AppTheme" parent="AppTheme.Base">
        ...
        <item name="android:windowTranslucentStatus">true</item>
    </style>
    <dimen name="topMargin">25dp</dimen>
</resources>

在值中:

<resources>
    <dimen name="topMargin">0dp</dimen>
</resources>

并设置到工具栏

android:layout_marginTop="@dimen/topMargin"

让它工作,在values-v21样式或主题xml需要使用这个属性:

<项名称=“android:窗口半透明状态”>true</item>

这就是奇迹!

以上所有的方法都是正确的,可能正在起作用。我已经按照上面的指南创建了一个工作演示,并在2上进行了测试。X至5.x

你可以从Github克隆

重要的事情是在主要活动中

toolbar = (Toolbar) findViewById(R.id.toolbar);
res = this.getResources();

this.setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeButtonEnabled(true);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { 
    ScrimInsetsFrameLayout scrimInsetsFrameLayout = (ScrimInsetsFrameLayout)
            findViewById(R.id.linearLayout);
    scrimInsetsFrameLayout.setOnInsetsCallback(this);
} 

还有回调

@Override
public void onInsetsChanged(Rect insets) {
    Toolbar toolbar = this.toolbar;
    ViewGroup.MarginLayoutParams lp = (ViewGroup.MarginLayoutParams)
        toolbar.getLayoutParams();
    lp.topMargin = insets.top;
    int top = insets.top;
    insets.top += toolbar.getHeight();
    toolbar.setLayoutParams(lp);
    insets.top = top; // revert
}

V21的主题绝对有魔力

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- API 21 theme customizations can go here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/accent_material_light</item>
    <item name="windowActionModeOverlay">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:windowTranslucentStatus">true</item>
</style>

和ScrimInsetsFrameLayout

现在有了新的设计支持库,这变得更容易了

compile 'com.android.support:design:22.2.0'

克隆来自@Chris Banes https://github.com/chrisbanes/cheesesquare