Android NavigationView

在这里插入图片描述
NavigationView优点

使用简单,只需要指定headerLayout和menu作为条目即可。

NavigationView缺点

格式固定,宽高等已经被控件指定,可设置的参数少。

  • navigation_header.xml(NavigationView的header)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:padding="10dp">

    <ImageView
        android:id="@+id/headPortrait"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop"
        android:contentDescription="@string/app_name"
        android:src="@mipmap/ic_launcher_round"
        android:padding="10dp"/>

    <TextView
        android:id="@+id/nickname"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/headPortrait"
        android:layout_marginTop="15dp"
        android:text="@string/nickname"
        android:textColor="@android:color/white"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/headPortrait"
        android:layout_below="@id/nickname"
        android:layout_marginTop="5dp"
        android:text="@string/signature"
        android:textColor="@android:color/white"/>
</RelativeLayout>

  • menu_main.xml(NavigationView的条目)
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group>
        <item
            android:id="@+id/mine"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/mine"/>
        <item
            android:id="@+id/friends"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/friends"/>
        <item
            android:id="@+id/notify"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/notify"/>
        <item
            android:id="@+id/message"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/message"/>
    </group>

    <!-- group要加上id才会有分割线 -->
    <group android:id="@+id/group1">
        <item
            android:id="@+id/appManager"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/app_manager"/>
    </group>

    <group android:id="@+id/group2">
        <item
            android:id="@+id/themeStyle"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/theme_style"/>
        <item
            android:id="@+id/nightPattern"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/night_pattern"/>
        <item
            android:id="@+id/setting"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/setting"/>
        <item
            android:id="@+id/feed"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/feed"/>
        <item
            android:id="@+id/about"
            android:icon="@mipmap/ic_launcher_round"
            android:title="@string/about"/>
    </group>

    <!--<item android:title="@string/sub_item">-->
        <!--<menu>-->
            <!--<item android:title="@string/sub_item1"/>-->
            <!--<item android:title="@string/sub_item2"/>-->
        <!--</menu>-->
    <!--</item>-->
</menu>

  • activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<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/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.vincent.MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include layout="@layout/tool_bar_layout"/>

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

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

  • MainActivity.java
public class MainActivity extends AppCompatActivity {

    private DrawerLayout mDrawerLayout;
    private ActionBarDrawerToggle mDrawerToggle;
    private Toolbar mToolbar;
    private NavigationView mNavigationView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
        mToolbar = (Toolbar) findViewById(R.id.toolbar);
        mNavigationView = (NavigationView) findViewById(R.id.navigationView);

        initToolbar();
        setDrawerState(true);
    }

    private void initToolbar() {
        mToolbar.setTitle(getString(R.string.app_name));
        mToolbar.setTitleTextColor(ContextCompat.getColor(this, android.R.color.white));
        setSupportActionBar(mToolbar);

        //自定义设置toolbar的menu图标
//        final ActionBar actionBar = getSupportActionBar();
//        actionBar.setHomeAsUpIndicator(R.mipmap.ic_launcher_round);
//        actionBar.setDisplayHomeAsUpEnabled(true);
//        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
//            @Override
//            public void onClick(View view) {
//                  closeDrawer();
//            }
//        });
    }

    private void setDrawerState(boolean isEnabled) {
        if (mDrawerToggle == null) {
            mDrawerToggle = new ActionBarDrawerToggle(this,
                    mDrawerLayout, mToolbar, R.string.open, R.string.close);
            mDrawerLayout.setDrawerListener(mDrawerToggle);
            mDrawerToggle.syncState();
        }

        if (isEnabled) {
            mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);
            mDrawerToggle.setDrawerIndicatorEnabled(true);
            mDrawerToggle.syncState();
        } else {
            mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
            mDrawerToggle.setDrawerIndicatorEnabled(false);
            mDrawerToggle.syncState();
        }

        initNavigationView();
    }

    private void initNavigationView() {
        //没有这句代码,menu下item的icon默认灰色背景不显示原始图片
        mNavigationView.setItemIconTintList(null);

        //获取NavigationView的头布局
        View navHeaderView = mNavigationView.getHeaderView(0);
        ImageView headPortrait = (ImageView) navHeaderView.findViewById(R.id.headPortrait);
        headPortrait.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "head portrait", Toast.LENGTH_SHORT).show();
                closeDrawer();
            }
        });

        //处理NavigationView条目点击事件
        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                if (item.isCheckable()) {
                    item.setCheckable(true);
                }

                String args = "";
                switch (item.getItemId()) {
                    case R.id.mine:
                        args = getString(R.string.mine);
                        break;
                    case R.id.friends:
                        args = getString(R.string.friends);
                        break;
                    case R.id.notify:
                        args = getString(R.string.notify);
                        break;
                    case R.id.message:
                        args = getString(R.string.message);
                        break;
                    case R.id.appManager:
                        args = getString(R.string.app_manager);
                        break;
                    case R.id.themeStyle:
                        args = getString(R.string.theme_style);
                        break;
                    case R.id.nightPattern:
                        args = getString(R.string.night_pattern);
                        break;
                    case R.id.setting:
                        args = getString(R.string.setting);
                        break;
                    case R.id.feed:
                        args = getString(R.string.feed);
                        break;
                    case R.id.about:
                        args = getString(R.string.about);
                        break;
                }
                //item.setChecked(true);//设置选中状态(只是文字选中)
                item.setCheckable(true); //设置选中状态(文字+背景)

                onSwitchFragment(args);
                closeDrawer();
                return true;
            }
        });
    }

    private void onSwitchFragment(String args) {
        Bundle bundle = new Bundle();
        bundle.putString("string", args);

        NavigationFragment fragment = new NavigationFragment();
        fragment.setArguments(bundle);

        getSupportFragmentManager().beginTransaction().replace(R.id.fl_content, fragment).commit();
    }

    private void closeDrawer() {
        if (mDrawerLayout.isDrawerOpen(GravityCompat.START)) {
            mDrawerLayout.closeDrawer(GravityCompat.START);
        }
    }

    private void openDrawer() {
        mDrawerLayout.openDrawer(GravityCompat.START);
    }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值