Android滑动组件悬浮固定在顶部效果
程序员文章站
2024-02-17 16:44:46
要想实现的效果是如下:
场景:有些时候是内容中间的组件当滑动至顶部的时候固定显示在顶部。
实现的思路:
1.目标组件(button)有两套,放在顶部和内容中间...
要想实现的效果是如下:
场景:有些时候是内容中间的组件当滑动至顶部的时候固定显示在顶部。
实现的思路:
1.目标组件(button)有两套,放在顶部和内容中间;
2.当内容中间的组件滑动至顶部栏位置时控制显示/隐藏顶部和中间的组件(涉及到组件获取在屏幕的位置知识点);
activity代码:
public class mainactivity extends appcompatactivity implements observablescrollview.scrollviewlistener { private observablescrollview scrollview; private button topbtn1, topbtn2, middlebtn1, middlebtn2; private view toppanel, middlepanel; private int topheight; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); initviews(); initlisteners(); } @override public void onwindowfocuschanged(boolean hasfocus) { super.onwindowfocuschanged(hasfocus); rect frame = new rect(); getwindow().getdecorview().getwindowvisibledisplayframe(frame); int statusbarheight = frame.top;//状态栏高度 int titlebarheight = getwindow().findviewbyid(window.id_android_content).gettop();//标题栏高度 topheight = titlebarheight + statusbarheight; } private void initviews() { scrollview = (observablescrollview) findviewbyid(r.id.scrollview); toppanel = findviewbyid(r.id.toppanel); topbtn1 = (button) toppanel.findviewbyid(r.id.button1); topbtn2 = (button) toppanel.findviewbyid(r.id.button2); middlepanel = findviewbyid(r.id.middlepanel); middlebtn1 = (button) middlepanel.findviewbyid(r.id.button1); middlebtn2 = (button) middlepanel.findviewbyid(r.id.button2); } private void initlisteners() { topbtn1.setonclicklistener(new view.onclicklistener() { @override public void onclick(view view) { middlebtn1.setbackgroundcolor(color.white); topbtn1.setbackgroundcolor(color.white); } }); middlebtn1.setonclicklistener(new view.onclicklistener() { @override public void onclick(view view) { middlebtn1.setbackgroundcolor(color.blue); topbtn1.setbackgroundcolor(color.blue); } }); scrollview.setscrollviewlistener(this); } @override public void onscrollchanged(observablescrollview scrollview, int x, int y, int oldx, int oldy) { int[] location = new int[2]; middlebtn1.getlocationonscreen(location); int locationy = location[1]; log.e("locationy", locationy + " " + "topheight的值是:" + topheight); if (locationy <= topheight && (toppanel.getvisibility() == view.gone || toppanel.getvisibility() == view.invisible)) { toppanel.setvisibility(view.visible); } if (locationy > topheight && toppanel.getvisibility() == view.visible) { toppanel.setvisibility(view.gone); } } }
要点解析:
1.在onwindowfocuschanged()方法中获取屏幕状态栏和标题栏的高度(在oncreate()方法中是获取是0);
2.因为布局中的scrollview的onscrollchangelistener()方法低版本api不支持——>所以activity实现了自定义scrollview中的onscrollchanged()接口方法——>在此方法中实现组件的显示/隐藏;
自定义scrollview的代码:
public class observablescrollview extends scrollview { private scrollviewlistener scrollviewlistener = null; public observablescrollview(context context) { super(context); } public observablescrollview(context context, attributeset attrs, int defstyle) { super(context, attrs, defstyle); } public observablescrollview(context context, attributeset attrs) { super(context, attrs); } public void setscrollviewlistener(scrollviewlistener scrollviewlistener) { this.scrollviewlistener = scrollviewlistener; } @override protected void onscrollchanged(int x, int y, int oldx, int oldy) { super.onscrollchanged(x, y, oldx, oldy); if (scrollviewlistener != null) { scrollviewlistener.onscrollchanged(this, x, y, oldx, oldy); } } public interface scrollviewlistener { void onscrollchanged(observablescrollview scrollview, int x, int y, int oldx, int oldy); } }
然后是布局文件:
<?xml version="1.0" encoding="utf-8"?> <framelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.administrator.slideholdapp.mainactivity"> <com.example.administrator.slideholdapp.observablescrollview android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/scrollview"> <linearlayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <textview android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginbottom="30dp" android:text="@string/content" /> <include android:id="@+id/middlepanel" layout="@layout/middle_item_layout"></include> <textview android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margintop="30dp" android:text="@string/content" /> </linearlayout> </com.example.administrator.slideholdapp.observablescrollview> <include android:id="@+id/toppanel" layout="@layout/middle_item_layout" android:visibility="gone"/> </framelayout>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。