android头部固定悬停,Android开发上滑悬停且头部可刷新

需求：上滑列表后推荐，小岛，专题置顶，可左右切换。因为头部有重要内容，所有头部出现且滑到顶之后，再下来可刷新头部内容

效果图：

scroll1.jpg

Screenshot_20200627_134124_com.cong.coordinatorla.jpg

Screenshot_20200627_134130_com.cong.coordinatorla.jpg

实现思路：

首先上滑悬停想到的是协调布局CoordinatorLayout，

第二用刷新控件包裹着协调布局，我用的刷新控件是refreshlayout.RefreshLayout

第三在代码中app_bar_layout.addOnOffsetChangedListener判断刷新布局什么时候可用，什么时候不可用

下面是实现文档

步骤一：布局

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/tv_title"

android:layout_width="match_parent"

android:layout_height="48dp"

android:text="头部刷新"

android:gravity="center"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintTop_toTopOf="parent"

android:textSize="20sp"

android:background="@color/white"

/>

android:layout_width="match_parent"

android:layout_height="wrap_content"

app:layout_constraintTop_toBottomOf="@+id/tv_title"

>

android:id="@+id/mRefreshLayout"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:focusableInTouchMode="true"

app:layout_constraintTop_toTopOf="parent"

>

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@color/white">

android:id="@+id/app_bar_layout"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:clipChildren="false"

android:background="@color/white"

android:orientation="vertical">

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:clipChildren="false"

app:layout_scrollFlags="scroll|exitUntilCollapsed">

android:id="@+id/common_recycler"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_collapseMode="pin" />

android:layout_width="match_parent"

android:layout_height="wrap_content">

android:id="@+id/stl_ceo_data"

android:layout_width="match_parent"

android:layout_height="40dp"

app:layout_constraintTop_toTopOf="parent"

app:tl_indicator_color="@color/color_D5100A"

app:tl_indicator_height="2dp"

app:tl_indicator_width="21dp"

app:tl_tab_space_equal="true"

app:tl_textBold="BOTH"

app:tl_textSelectColor="@color/color_D5100A"

app:tl_textUnselectColor="@color/c_33"

app:tl_textsize="16sp" />

android:layout_width="0dp"

android:layout_height="1px"

android:layout_marginLeft="16dp"

android:layout_marginRight="16dp"

android:background="@color/c_f2efef"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toBottomOf="@id/stl_ceo_data" />

android:id="@+id/vp_pager_ceo_data"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_behavior="@string/appbar_scrolling_view_behavior" />

步骤二：使用示例

class OutRefreshActivity : AppCompatActivity() {

private var context: Context? = null

override fun onCreate(savedInstanceState: Bundle?) {

super.onCreate(savedInstanceState)

setContentView(R.layout.activity_out_refresh)

context = this

setRefreshLayout(mRefreshLayout)

common_recycler.layoutManager = LinearLayoutManager(context)

val headView = LayoutInflater.from(context).inflate(R.layout.layout_out_refresh_head, common_recycler, false)

val headAdapter = OutRefreshHeadAdapter()

common_recycler?.adapter = headAdapter

headAdapter.addHeaderView(headView)

//关键,什么时候RefreshLayout可用

app_bar_layout.addOnOffsetChangedListener(object :AppBarLayout.OnOffsetChangedListener{

override fun onOffsetChanged(p0: AppBarLayout?, verticalOffset: Int) {

mRefreshLayout.isEnabled = verticalOffset >=0

//只能下拉

mRefreshLayout?.direction = RefreshLayoutDirection.TOP

}

})

val fragments: MutableList = ArrayList()

fragments.add(AFragment())

fragments.add(BFragment())

fragments.add(CFragment())

val titles: MutableList = ArrayList()

titles.add("推荐")

titles.add("小岛")

titles.add("专题")

val baseFragmentAdapter = BaseFragmentAdapter(supportFragmentManager, fragments, titles)

vp_pager_ceo_data.setAdapter(baseFragmentAdapter)

stl_ceo_data.setViewPager(vp_pager_ceo_data)

}

protected fun setRefreshLayout(refreshLayout: RefreshLayout) {

refreshLayout.direction = RefreshLayoutDirection.BOTH

refreshLayout.setColorSchemeResources(R.color.m_red_two, R.color.m_charcoal_grey, R.color.m_purple, R.color.m_green, R.color.m_blue)

refreshLayout.setOnRefreshListener(object : RefreshLayout.OnRefreshListener {

override fun onPullDownToRefresh() {

//做刷新操作，模拟请求接口

Handler().postDelayed(object :Runnable{

override fun run() {

refreshLayout.isRefreshing = false //隐藏刷新圈圈

}

},1000)

}

override fun onPullUpToRefresh() {

//加载更多

}

})

}

}

上面有OutRefreshHeadAdapter，BaseFragmentAdapter，AFragment没给出，就是普通的操作类，相信你们都会写或者项目中就有。

重点是上面的关键代码

app_bar_layout.addOnOffsetChangedListener(object :AppBarLayout.OnOffsetChangedListener{

override fun onOffsetChanged(p0: AppBarLayout?, verticalOffset: Int) {

mRefreshLayout.isEnabled = verticalOffset >=0

//只能下拉

mRefreshLayout?.direction = RefreshLayoutDirection.TOP

}

})

ok,这样的效果就做好了。