DrawLayout
如何实现上述的侧边栏效果呢?
起始很简单,Android以及帮我们想好了,只需要添加一个控件即可DrawerLayout
此处代码放在LinearLayout里面(也就是侧滑栏那一块)
特别注意如果没有这段代码,你侧滑没有效果
android:layout_gravity="start"
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.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:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/drawerlayout02"
tools:context=".Drawer02Activity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
/>
</FrameLayout>
<LinearLayout
android:id="@+id/left_layout"
这里也的宽度也要设置一些,不要设置为match_parent
android:layout_width="300dp"
android:layout_height="match_parent"
特别注意如果没有这段代码,你侧滑没有效果
android:layout_gravity="start"
android:orientation="horizontal"
android:layout_gravity="start">
<com.google.android.material.navigation.NavigationView
android:layout_width="240dp"
android:layout_height="match_parent"
android:id="@+id/nav_view"
app:menu="@menu/nav_menu"
app:headerLayout="@layout/nav_header"
/>
</LinearLayout>
</androidx.drawerlayout.widget.DrawerLayout>
这里通过DrawerLayout作为根布局,然后里面包裹了FrameLayout,里面包含的是主页是所包含的内容,LinearLayout包裹了NavigationView,这个LinearLayout是侧边栏所要展示的内容。app:menu为菜单栏,app:headerLayout包裹上面的头部信息。
NavigationView滑动菜单页面
需要添加依赖
implementation 'com.android.support:design:24.2.1'
下面的依赖是实现圆角图片的
implementation 'de.hdodenhof:circleimageview:3.1.0'
av_header xml
<?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="180dp"
android:padding="10dp"
android:background="#009688">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="70dp"
android:layout_height="70dp"
android:id="@+id/animal"
android:src="@drawable/animal"
android:layout_centerInParent="true"/>
<TextView
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/mail"
android:layout_alignParentBottom="true"
android:text="2640622467@qq.com"
android:textSize="20sp"
android:textColor="#fff"/>
<TextView
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/username"
android:layout_above="@+id/mail"
android:textSize="20sp"
android:textColor="#fff"
android:text="William——tao"
/>
</RelativeLayout>
nav_menu
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item
android:id="@+id/nav_call"
android:icon="@drawable/add"
android:title="Call"/>
/>
<item
android:id="@+id/nav_friends"
android:icon="@drawable/delete"
android:title="Friends"/>
<item
android:id="@+id/nav_mail"
android:icon="@drawable/menu"
android:title="Mail"/>
</group>
</menu>
java部分代码:
public class Drawer02Activity extends AppCompatActivity {
private DrawerLayout drawerLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_drawer02);
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
drawerLayout = findViewById(R.id.drawerlayout02);
NavigationView navigationView = findViewById(R.id.nav_view);
//获取标题栏
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
/// 给左上角图标的左边加上一个返回的图标
actionBar.setDisplayHomeAsUpEnabled(true);
//改变原有图标的icon
actionBar.setHomeAsUpIndicator(R.drawable.menu);
}
//为滑动菜单页面添加事件,点击每一个菜单,就退出滑动菜单页面
navigationView.setCheckedItem(R.id.nav_call);
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
//退出滑动菜单页面
drawerLayout.closeDrawers();
return true;
}
});
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
drawerLayout.openDrawer(GravityCompat.START);
}
return true;
}
}
另外注意:主界面布局一定要位于所有侧滑界面布局之前,宽度与高度应设置为 match_parent ,并且不能包含 layout_gravity 标签。