Android 顶部标题栏随滑动时的渐变隐藏和渐变显示效果
程序员文章站
2023-11-24 08:40:28
各位早上好,话不多说,先上效果图:
注意顶部:首页textview的变化(显示和隐藏)!
首先分析下:ui状态,其是由recyclerview添加头部组成+recy...
各位早上好,话不多说,先上效果图:
注意顶部:首页textview的变化(显示和隐藏)!
首先分析下:ui状态,其是由recyclerview添加头部组成+recyclerview
头部添加和recyclerview分别引用如下:具体的分装数据的过程这里就不在说明,下篇博客会更加深入的写关于
recyclerview总添加多种不同type类型
compile 'com.bartoszlipinski.recyclerviewheader:library:1.2.1' compile 'com.android.support:recyclerview-v7:25.3.1'
第一步:生成布局视图
<framelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:background="#f2f2f2" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.recyclerview android:id="@+id/recycler" android:layout_width="match_parent" android:layout_height="match_parent"/> <textview android:background="#ffffff" android:paddingtop="5dp" android:paddingbottom="5dp" android:gravity="center_horizontal" tools:visibility="visible" android:textcolor="#000000" android:textsize="20sp" android:id="@+id/home_text" android:visibility="invisible" android:text="首页" android:layout_width="match_parent" android:layout_height="wrap_content"/> </framelayout>
第二步:直接上其他主要的代码,其注释很详细,不多说
public class mainactivity extends appcompatactivity { private textview mtextview; private int mtextviewheight; private recyclerview mrecyclerview; private recyclerviewheader mrecyclerviewheader; //头部图片(轮播图的高度) private int mrecyclerheaderbannerheight; //头部的高度 private int mrecyclerheaderheight; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); mtextview = (textview) findviewbyid(r.id.home_text); //recyclerview填充数据(忽略不计) initdata(); mrecyclerview = (recyclerview) findviewbyid(r.id.recycler); mrecyclerview.setlayoutmanager(new linearlayoutmanager(this)); mrecyclerview.setadapter(madapter); //获取到文本的高度 mtextviewheight = mtextview.getheight(); //轮播图片的高度--和xml图片的高度是一样的 mrecyclerheaderbannerheight = (int) getresources().getdimension(r.dimen.home_page_banner_height); //recyclerview每个item之间的距离,和adapter中设置的距离一样 final int recycleritemheight = (int) getresources().getdimension(r.dimen.home_page_list_item_margin_top); //添加头部视图,其布局文件就忽略 mrecyclerviewheader = recyclerviewheader.fromxml(this, r.layout.list_item_prime_product_header); //设置其滑动事件 mrecyclerview.addonscrolllistener(new recyclerview.onscrolllistener() { @override public void onscrolled(recyclerview recyclerview, int dx, int dy) { //设置其透明度 float alpha = 0; int scollyheight = getscollyheight(true, mrecyclerheaderheight); //起始截止变化高度,如可以变化高度为mrecyclerheaderheight int baseheight = mrecyclerheaderbannerheight - recycleritemheight - mtextviewheight; if(scollyheight >= baseheight) { //完全不透明 alpha = 1; }else { //产生渐变效果 alpha = scollyheight / (baseheight*1.0f); } mtextview.setalpha(alpha); super.onscrolled(recyclerview, dx, dy); } }); //将头部视图添加到recyclerview中 mrecyclerviewheader.attachto(mrecyclerview); //第一次进来其状态显示 mrecyclerviewheader.post(new runnable() { @override public void run() { mrecyclerheaderheight = mrecyclerviewheader.getheight(); mtextviewheight = mtextview.getheight(); mtextview.setvisibility(view.visible); mtextview.setalpha(0); } }); }
第三步:获取其滑动的距离
/** * 计算recyclerview滑动的距离 * @param hashead 是否有头部 * @param headerheight recyclerview的头部高度 * @return 滑动的距离 */ private int getscollyheight(boolean hashead, int headerheight) { linearlayoutmanager layoutmanager = (linearlayoutmanager) mrecyclerview.getlayoutmanager(); //获取到第一个可见的position,其添加的头部不算其position当中 int position = layoutmanager.findfirstvisibleitemposition(); //通过position获取其管理器中的视图 view firstvisiablechildview = layoutmanager.findviewbyposition(position); //获取自身的高度 int itemheight = firstvisiablechildview.getheight(); //有头部 if(hashead) { return headerheight + itemheight*position - firstvisiablechildview.gettop(); }else { return itemheight*position - firstvisiablechildview.gettop(); } }
以上:就可以实现其效果!
以上所述是小编给大家介绍的android 顶部标题栏随滑动时的渐变隐藏和渐变显示效果,希望对大家有所帮助