Android导航栏滑动折叠效果

项目地址

https://github.com/oneAcorn/FoldNavScrollLayout
-------------------------------------------------------------------我是分割线---------------------------------------------------------------------

使用NestedScrollingParent实现的导航栏滑动折叠效果的ViewGroup

在这里插入图片描述

一 引用方法

1.在root build.gradle中加入
allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
	}
2.在项目的 build.gradle中加入
dependencies {
	        implementation 'com.github.oneAcorn:FoldNavScrollLayout:1.0'
	}

二 使用方法

1.在xml中声明(FoldNavScrollLayout内的View只是示例,只要id是对的就行)
<?xml version="1.0" encoding="utf-8"?>
<com.acorn.library.FoldNavScrollLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <RelativeLayout
        android:id="@id/fold_nav_layout"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:background="#ffffff"/>

    <android.support.design.widget.TabLayout
        android:id="@id/fold_tab_layout"
        android:layout_width="match_parent"
        android:layout_height="34dp"
        />

    <android.support.v4.view.ViewPager
        android:id="@id/fold_content_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</com.acorn.library.FoldNavScrollLayout>

请注意,FoldNavScrollLayout内第一层childView需要至少有3个如下id的View存在

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <item name="fold_nav_layout" type="id"/>
    <item name="fold_tab_layout" type="id"/>
    <item name="fold_content_layout" type="id"/>
</resources>

作用分别是
fold_nav_layout 导航栏,拖动时根据方向显示/隐藏
fold_tab_layout 位置固定的View,不一定是TabLayout
fold_content_layout 可竖向滑动的View

2.完成,就当它是个LinearLayout,该怎么用就怎么用

项目地址

https://github.com/oneAcorn/FoldNavScrollLayout

  • 0
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以通过在 RecyclerView 外部嵌套一个带有滑动导航栏的布局来实现这个效果。具体步骤如下: 1. 在布局文件中创建一个带有滑动导航栏的布局,例如使用 TabLayout 和 ViewPager2 实现: ```xml <com.google.android.material.tabs.TabLayout android:id="@+id/tab_layout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabGravity="center" app:tabMode="scrollable" /> <androidx.viewpager2.widget.ViewPager2 android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="match_parent" /> ``` 2. 在代码中初始化 TabLayout 和 ViewPager2,并设置 Adapter: ```kotlin val tabLayout: TabLayout = findViewById(R.id.tab_layout) val viewPager: ViewPager2 = findViewById(R.id.view_pager) val adapter = MyAdapter(supportFragmentManager, lifecycle) viewPager.adapter = adapter TabLayoutMediator(tabLayout, viewPager) { tab, position -> tab.text = "Tab ${position + 1}" }.attach() ``` 3. 在 Adapter 中创建 RecyclerView,并在 onCreateViewHolder 中返回 ViewHolder: ```kotlin override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder { if (viewType == TYPE_RECYCLER_VIEW) { val view = LayoutInflater.from(parent.context).inflate(R.layout.recyclerview_layout, parent, false) return RecyclerViewHolder(view) } else { val view = LayoutInflater.from(parent.context).inflate(R.layout.view_pager_layout, parent, false) return ViewPagerHolder(view) } } ``` 4. 在 RecyclerView 的 Adapter 中添加一个 header item,用来显示滑动导航栏,例如: ```kotlin override fun getItemViewType(position: Int): Int { return if (position == 0) TYPE_HEADER else TYPE_RECYCLER_VIEW } override fun getItemCount(): Int { return list.size + 1 // 添加一个 header item } override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) { if (holder is RecyclerViewHolder) { val item = list[position - 1] // 减去 header item holder.bind(item) } } ``` 5. 在 RecyclerView 的 LayoutManager 中,设置偏移量来使 RecyclerView 的内容不会被滑动导航栏遮挡: ```kotlin val layoutManager = LinearLayoutManager(this) recyclerView.layoutManager = layoutManager recyclerView.addItemDecoration(object : RecyclerView.ItemDecoration() { override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) { super.getItemOffsets(outRect, view, parent, state) if (parent.getChildAdapterPosition(view) == 0) { outRect.top = tabLayout.height } } }) ``` 这样,你就可以在 RecyclerView 中添加一个顶部滑动导航栏了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值