Android各种侧滑栏总结

前言

经常我们使用Android APP时，会注意到很多app都有侧滑栏，比如网易云、B站、滴滴、QQ等。

网易云

滴滴

效果展示

本篇博客一共实现了5种样式：

侧边栏样式一 Android原生风格

侧边栏样式二 B站网易云滴滴风格

侧边栏样式三 iOS侧滑风格

侧边栏样式四（仿QQ 5.0.0）风格

侧边栏样式五（仿QQ 8.0.0）风格

5种侧边栏效果

代码实现

侧边栏样式一 Android原生风格

xml布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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:orientation="vertical"
    tools:context=".MainActivity">

    <!--标题栏样式一-->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="@color/colorPrimary"
        app:subtitleTextColor="@android:color/white"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:title="样式1"
        app:titleTextColor="@android:color/white">
    </android.support.v7.widget.Toolbar>

    <!--侧边栏样式-->
    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:openDrawer="start">

        <!--主页内容-->
        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Hello World!"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent"/>
        </android.support.constraint.ConstraintLayout>

        <!--侧边栏内容-->
        <android.support.design.widget.NavigationView
            android:id="@+id/navigation_view"
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/navigationview_header"
            app:menu="@menu/menu_navigation">

            <!--添加脚布局-->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="48dp"
                android:layout_gravity="bottom"
                android:gravity="center"
                android:orientation="horizontal">

                <Button
                    android:id="@+id/footer_item_setting"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:adjustViewBounds="true"
                    android:background="@android:color/transparent"
                    android:drawableStart="@drawable/ic_setting"
                    android:drawableLeft="@drawable/ic_setting"
                    android:drawablePadding="1dp"
                    android:gravity="center"
                    android:paddingLeft="5dp"
                    android:text="设置"
                    android:textAlignment="inherit"
                    android:textColor="@color/colorPrimary"/>

                <Button
                    android:id="@+id/footer_item_out"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:background="@android:color/transparent"
                    android:drawableStart="@drawable/ic_out"
                    android:drawableLeft="@drawable/ic_out"
                    android:drawablePadding="1dp"
                    android:gravity="center"
                    android:paddingLeft="5dp"
                    android:text="退出"
                    android:textAlignment="center"
                    android:textColor="@color/colorPrimary"/>
            </LinearLayout>

        </android.support.design.widget.NavigationView>
    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

这里使用DrawerLayout+NavigationView实现的， NavigationView在标签里添加布局可以实现脚布局。

在menu文件添加item条目，

<?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">
    <group
        android:id="@+id/group1"
        android:checkableBehavior="single">
        <item
            android:id="@+id/single_1"
            android:icon="@drawable/ic_android_fill"
            android:title="安卓"
            app:actionLayout="@layout/bage_hint"/>

        <item
            android:id="@+id/single_2"
            android:icon="@drawable/ic_apple_fill"
            android:title="苹果"/>
    </group>

    <group
        android:id="@+id/group2"
        android:checkableBehavior="single">
        <item
            android:id="@+id/single_3"
            android:icon="@drawable/ic_github_line"
            android:title="github"/>

        <item
            android:id="@+id/single_4"
            android:icon="@drawable/ic_wechat_fill"
            android:title="wechat"/>
    </group>

    <item
        android:title="子菜单">
        <menu>
            <item
                android:id="@+id/item_2"
                android:icon="@drawable/ic_taobao_fill"
                android:title="淘宝"/>

            <item
                android:id="@+id/item_1"
                android:icon="@drawable/ic_baidu_line"
                android:title="百度"/>

            <item
                android:id="@+id/item_3"
                android:icon="@drawable/ic_qq_fill"
                android:title="腾讯"/>
        </menu>
    </item>
</menu>

bage_hint.xml布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:orientation="vertical">

    <TextView
        android:id="@+id/msg_bg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/badge_bg"
        android:gravity="center"
        android:text="0"
        android:textColor="@android:color/white"
        android:textSize="10sp"/>
</LinearLayout>

vip_view.xml布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv_vip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableStart="@drawable/ic_vip"
        android:drawableLeft="@drawable/ic_vip"
        android:gravity="center"
        android:text="开通Vip 99元"
        android:textColor="@android:color/holo_red_light"
        android:textSize="12sp"/>
</LinearLayout>

其中需要注意的是app:actionLayout="@layout/bage_hint"，actionLayout这里是item扩展布局，布局是从右向左显示，当太宽的时候，会遮盖item的内容。

item扩展信息

Style1Activity.class代码：

public class Style1Activity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_style1);

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        NavigationView navigationview = (NavigationView) findViewById(R.id.navigation_view);
        final DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

        setSupportActionBar(toolbar);//将toolbar与ActionBar关联
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, 0, 0);
        drawer.setDrawerListener(toggle);//初始化状态
        toggle.syncState();


        /*---------------------------添加头布局和尾布局-----------------------------*/
        //获取xml头布局view
        View headerView = navigationview.getHeaderView(0);
        //添加头布局的另外一种方式
        //View headview=navigationview.inflateHeaderView(R.layout.navigationview_header);

        //寻找头部里面的控件
        ImageView imageView = headerView.findViewById(R.id.iv_head);
        imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(), "点击了头像", Toast.LENGTH_LONG).show();
            }
        });
        navigationview.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                return false;
            }
        });
        ColorStateList csl = (ColorStateList) getResources().getColorStateList(R.color.nav_menu_text_color);
        //设置item的条目颜色
        navigationview.setItemTextColor(csl);
        //去掉默认颜色显示原来颜色  设置为null显示本来图片的颜色
        navigationview.setItemIconTintList(csl);

        //设置单个消息数量
        LinearLayout llAndroid = (LinearLayout) navigationview.getMenu().findItem(R.id.single_1).getActionView();
        TextView msg= (TextView) llAndroid.findViewById(R.id.msg_bg);
        msg.setText("99+");

        //设置条目点击监听
        navigationview.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                //安卓
                Toast.makeText(getApplicationContext(), menuItem.getTitle(), Toast.LENGTH_LONG).show();
                //设置哪个按钮被选中
//                menuItem.setChecked(true);
                //关闭侧边栏
//                drawer.closeDrawers();
                return false;
            }
        });
    }
}

侧边栏样式二 B站网易云滴滴

第二种方式第一种方式实现类似，只是调整了一下Toolbar与DrawerLayout顺序，国内大部分APP应用采用这种侧滑方式。

<?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/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <!--主页内容-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".MainActivity">

        <!--标题栏样式一-->
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?actionBarSize"
            android:background="@color/colorPrimary"
            app:subtitleTextColor="@android:color/white"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:title="样式2"
            app:titleTextColor="@android:color/white">
        </android.support.v7.widget.Toolbar>

        <!--主页内容-->
        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Hello World!"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent"/>
        </android.support.constraint.ConstraintLayout>

    </LinearLayout>

    <!--侧边栏内容-->
    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/navigationview_header"
        app:insetForeground="@android:color/transparent"
        app:menu="@menu/menu_navigation">

        <!--添加脚布局-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_gravity="bottom"
            android:gravity="center"
            android:orientation="horizontal">

            <Button
                android:id="@+id/footer_item_setting"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:adjustViewBounds="true"
                android:background="@android:color/transparent"
                android:drawableStart="@drawable/ic_setting"
                android:drawableLeft="@drawable/ic_setting"
                android:drawablePadding="1dp"
                android:gravity="center"
                android:paddingLeft="5dp"
                android:text="设置"
                android:textAlignment="inherit"
                android:textColor="@color/colorPrimary"/>

            <Button
                android:id="@+id/footer_item_out"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:drawableStart="@drawable/ic_out"
                android:drawableLeft="@drawable/ic_out"
                android:drawablePadding="1dp"
                android:gravity="center"
                android:paddingLeft="5dp"
                android:text="退出"
                android:textAlignment="center"
                android:textColor="@color/colorPrimary"/>
        </LinearLayout>

    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

状态栏遮挡

但是还是注意几点侧滑时隐藏状态栏，这里我们可以将状态栏变成透明色，xml根布局设置为android:fitsSystemWindows="true"，否则主布局会进入状态栏，在Activity当中添加如下代码实现状态栏透明：

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                //5.x开始需要把颜色设置透明，否则导航栏会呈现系统默认的浅灰色
                Window window = activity.getWindow();
                View decorView = window.getDecorView();
                //两个 flag 要结合使用，表示让应用的主体内容占用系统状态栏的空间
                int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                        | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
                decorView.setSystemUiVisibility(option);
                window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
                window.setStatusBarColor(Color.TRANSPARENT);
                //导航栏颜色也可以正常设置
//                window.setNavigationBarColor(Color.TRANSPARENT);
            } else {
                Window window = activity.getWindow();
                WindowManager.LayoutParams attributes = window.getAttributes();
                int flagTranslucentStatus = WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS;
                int flagTranslucentNavigation = WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION;
                attributes.flags |= flagTranslucentStatus;
//                attributes.flags |= flagTranslucentNavigation;
                window.setAttributes(attributes);
            }
        }

接着一个bug未解决，又出现一个问题，那就是侧滑时，状态栏存在阴影

状态栏阴影

最新的NavigationView控件作为侧滑内容，而谷歌把它写死了，一直都会有那个状态栏阴影，所以为NavigationView控件添加app:insetForeground=”@android:color/transparent” ，就可以完美解决这个问题。

最终结果

【注意】如果NavigationView默认Menu布局无法满足你们公司UI设计狮的要求，那么就要可以使用这个绝招了，通过Fragment自定义NavigationView布局。

NavigationView自定义布局

 getSupportFragmentManager().beginTransaction().replace(R.id.navigation_view,
                new NavigationViewFragment()).commit();

定义一个Fragment填充NavigationView，这样就可以显示Fragment的布局了。

侧边栏样式三 iOS风格侧滑

IOS侧边栏

这种风格侧边栏这里使用DrawerLayout两个子布局之间切换实现，具体代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--主页内容-->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include layout="@layout/activity_content3"/>
    </FrameLayout>

    <!--侧边栏内容-->
    <FrameLayout
        android:id="@+id/menu_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start">

        <include layout="@layout/left_menu3"/>
    </FrameLayout>

</android.support.v4.widget.DrawerLayout>

Activity代码：

public class Style3Activity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //隐藏状态栏时，获取状态栏高度
        int statusBarHeight = ScreenInfoUtils.getStatusBarHeight(this);
        //隐藏状态栏
        ScreenInfoUtils.fullScreen(this);
        //初始化布局
        setContentView(R.layout.activity_style3);
        //初始化状态栏的高度
        View statusbar = (View) findViewById(R.id.view_statusbar);
        ConstraintLayout.LayoutParams params = new ConstraintLayout.LayoutParams(ConstraintLayout.LayoutParams.MATCH_PARENT, statusBarHeight);
        statusbar.setLayoutParams(params);

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        final DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);

        setSupportActionBar(toolbar);//将toolbar与ActionBar关联
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawerLayout, toolbar, 0, 0);
        drawerLayout.addDrawerListener(toggle);//初始化状态
        toggle.syncState();

        //蒙层颜色
        drawerLayout.setScrimColor(getResources().getColor(R.color.colorGray));
        drawerLayout.addDrawerListener(new DrawerLayout.DrawerListener() {
            @Override
            public void onDrawerStateChanged(int newState) {
            }

            @Override
            public void onDrawerSlide(@NonNull View drawerView, float slideOffset) {
                View mContent = drawerLayout.getChildAt(0);
                View mMenu = drawerView;
                ViewHelper.setTranslationX(mContent, mMenu.getMeasuredWidth() * slideOffset);
            }

            @Override
            public void onDrawerOpened(@NonNull View drawerView) {
            }

            @Override
            public void onDrawerClosed(@NonNull View drawerView) {
            }
        });
    }
}

侧边栏样式四（仿QQ 5.0.0）

缩放侧边栏

样式四与样式三差不多，只是onDrawerSlide里面跑的逻辑不一样

// 滑动的过程中执行 slideOffset：从0到1
//主页内容
View content = drawerLayout.getChildAt(0);
//侧边栏
View menu = drawerView;
//
float scale = 1 - slideOffset;//1~0
float leftScale = (float) (1 - 0.3 * scale);
float rightScale = (float) (0.7f + 0.3 * scale);//0.7~1
//menu.setScaleX(leftScale);//1~0.7
menu.setScaleY(leftScale);//1~0.7

//content.setScaleX(rightScale);
content.setScaleY(rightScale);
content.setTranslationX(menu.getMeasuredWidth() * slideOffset);//0~width
Log.d(TAG, "slideOffset=" + slideOffset + ",leftScale=" + leftScale + ",rightScale=" + rightScale);

侧边栏样式五（仿QQ 8.0.0）

样式五其实跟样式三差不多，它只是侧边栏全部铺满屏幕，这个时候侧边栏设置为match_parent仍然无法铺满屏幕。

 View leftMenu = findViewById(R.id.menu_frame);

//获取侧边栏默认宽度
ViewGroup.LayoutParams leftParams = leftMenu.getLayoutParams();
//获取屏幕宽度
final int width = ScreenInfoUtils.getWindowWidth(this);
//获取屏幕高度
final int height = ScreenInfoUtils.getFullActivityHeight(this);
//设置侧边的宽高(如果不重新设置，即时设置match_parent也只能占屏幕百分80)
leftParams.width = width;
leftParams.height = FrameLayout.LayoutParams.MATCH_PARENT;
leftMenu.setLayoutParams(leftParams);

这个时候我们可以将侧边视图的宽高设置为屏幕的宽高，就可以解决这个问题。

侧边栏全屏

总结

这些都是平常玩Android应用所看到的侧边栏，全部总结在这里，如果以后还看到其他类型的侧边栏再做补充。
github 地址

最后编辑于：2019.05.12 16:41:30

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 212,294评论 6赞 493
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 90,493评论 3赞 385
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 157,790评论 0赞 348
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 56,595评论 1赞 284
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 65,718评论 6赞 386
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 49,906评论 1赞 290
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 39,053评论 3赞 410
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 37,797评论 0赞 268
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 44,250评论 1赞 303
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 36,570评论 2赞 327
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 38,711评论 1赞 341
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 34,388评论 4赞 332
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 40,018评论 3赞 316
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 30,796评论 0赞 21
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,023评论 1赞 266
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 46,461评论 2赞 360
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 43,595评论 2赞 350

Android各种侧滑栏总结

前言

效果展示

侧边栏样式一 Android原生风格

侧边栏样式二 B站 网易云 滴滴风格

侧边栏样式三 iOS侧滑风格

侧边栏样式四（仿QQ 5.0.0）风格

侧边栏样式五（仿QQ 8.0.0）风格

代码实现

侧边栏样式一 Android原生风格

侧边栏样式二 B站 网易云 滴滴

侧边栏样式三 iOS风格侧滑

侧边栏样式四（仿QQ 5.0.0）

侧边栏样式五（仿QQ 8.0.0）

总结

推荐阅读更多精彩内容

侧边栏样式二 B站网易云滴滴风格

侧边栏样式二 B站网易云滴滴