使用ToolBar,DrawerLayout,NavigationView实现侧滑栏
如果不能使用DrawerLayout请在Projec Structure里面添加依赖项:
官方推荐把DrawerLayout放在根布局,避免覆盖点击事件。看以看到main_activity.xml由两部分组成,main_layout,NavigationView.其中NavigationView的layout_gravity=“start”,表示在屏幕左侧。
app:headerLayout表示侧滑栏的头部部分,我放的是一个headlayout,里面是一张图片。
app:menu表示侧滑栏里面的菜单项,我放的是left_menu.
由Toobar【作为工具栏】,FrameLayout【当选择侧滑栏的按钮时,替换FrameLayout里面的Fragment】组成。
headlayout.xml: 里面放了一张图片作为侧滑栏,顶部的图片
left_menu.xml Navigation里面用 app:menu="left_menu"来引用: 这个是菜单项
接下来是java代码:
main_activity.java:
package com.example.copylooklook;
import android.content.res.Configuration;
import android.support.annotation.NonNull;
import android.support.design.widget.NavigationView;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private DrawerLayout mDrawerLayout;
private Toolbar mToolbar;
private ActionBarDrawerToggle mDrawerToggle;
private NavigationView mNavigationView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = findViewById(R.id.toolbar); //main_layout里面的toolbar
setSupportActionBar(mToolbar); //将toolbar设置到工具栏
mNavigationView = findViewById(R.id.nav_view);
mDrawerLayout = findViewById(R.id.drawer_layout); //将toolbar与Drawerlayout绑定,实现点击toolbar图标打开它
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,mToolbar,R.string.ic_open,R.string.ic_close){
@Override //可参考官方教程 :
https://developer.android.com/training/implementing-navigation/nav-drawer.html?hl=zh-cn
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
Log.d("mainactivity", "onDrawerClosed: ");
}
@Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
Log.d("Mainactivity", "onDrawerOpened: ");
}
};
mDrawerLayout.setDrawerListener(mDrawerToggle); //===这里真正进行将DrawerLayout与ToolBar绑定
mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override //NavigationView的点击侦听,这里监听了菜单的点击
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
updateItemCheckedView();
switch (item.getItemId()){
case R.id.zhihu:
Toast.makeText(MainActivity.this,"点击了知乎",Toast.LENGTH_SHORT).show();
item.setChecked(true);
break;
case R.id.wangyii:
Toast.makeText(MainActivity.this,"点击了网易",Toast.LENGTH_SHORT).show();
item.setChecked(true);
break;
case R.id.meiri:
Toast.makeText(MainActivity.this,"点击了每日",Toast.LENGTH_SHORT).show();
item.setChecked(true);
break;
}
return true;
}
});
}
@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
mDrawerToggle.onConfigurationChanged(newConfig);
}
public boolean onOptionsItemSelected(MenuItem item) {
// Pass the event to ActionBarDrawerToggle, if it returns
// true, then it has handled the app icon touch event
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}
// Handle your other action bar items...
return super.onOptionsItemSelected(item);
}
private void updateItemCheckedView(){ //当点击侧滑栏选项时,将其余
for(int i = 0; i < 3; i ++){ // 选项设置成未选中
mNavigationView.getMenu().getItem(i).setChecked(false);
}
}
}
此时,虽然有侧滑栏,但是侧滑栏的高度不是撑满屏幕的:
因此还要更改主题风格: