如何实现一个标准的MD风格页面

来源：互联网发布：手机淘宝购物要需要哪编辑：程序博客网时间：2024/06/04 19:01

如何实现一个标准的MD风格页面

自上而下

首先是透明的状态栏

getWindow().requestFeature(Window.FEATURE_NO_TITLE);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    Window window = getWindow();
    window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
            | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
    window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
            | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
    window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
    window.setStatusBarColor(Color.TRANSPARENT);
    //window.setNavigationBarColor(Color.TRANSPARENT);
}

然后是Toolbar

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="?attr/mainBackground"
    android:fitsSystemWindows="true"
    tools:context="skkk.gogogo.dakainote.Activity.SettingActivity.SettingActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay">

            <android.support.v7.widget.Toolbar
                android:id="@id/tb_author"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:title="@string/author" />
        </android.support.design.widget.AppBarLayout>

       
        //这里放置需要显示的页面        


    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>

这里初始化一下toolbar

设置一下我们需要的返回按钮

tbAuthor = (Toolbar) findViewById(R.id.tb_author);
setSupportActionBar(tbAuthor);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

tbAuthor.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        onBackPressed();
    }
});

如果需要加入toolbar右侧菜单的话那么还有如下设置：

/添加菜单
tbNoteDetail.inflateMenu(R.menu.note_edit_menu);

菜单xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@id/menu_note_share"
        android:orderInCategory="80"
        android:title="@string/note_edit_menu"
        android:icon="@drawable/vector_share"
        app:showAsAction="ifRoom">
    </item>
</menu>

设置菜单点击事件

* @方法 添加菜单点击事件
*
*/
@Override
public boolean onOptionsItemSelected(MenuItem item) {
    //获取菜单item_id
    int id = item.getItemId();
    //根据菜单判断
    switch (id) {
        case R.id.menu_note_share:
          
            break;
    }

    return super.onOptionsItemSelected(item);
}

这就完成了一个标准的MD页面

0 0