ScrollView做的上拉效果

2024-09-04 18:08
文章标签 效果 scrollview

本文主要是介绍ScrollView做的上拉效果，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！



Java代码   收藏代码
  1. import android.content.Context;  
  2. import android.util.AttributeSet;  
  3. import android.view.MotionEvent;  
  4. import android.widget.ScrollView;  
  5.   
  6. public class MyScrollView extends ScrollView {  
  7.   
  8.     // 滚动监听接口  
  9.     private OnScrollChangedListeneer onScrollChangedListeneer;  
  10.   
  11.     public MyScrollView(Context context) {  
  12.         super(context);  
  13.         // TODO Auto-generated constructor stub  
  14.     }  
  15.   
  16.     public MyScrollView(Context context, AttributeSet attrs) {  
  17.         super(context, attrs);  
  18.         // TODO Auto-generated constructor stub  
  19.     }  
  20.   
  21.     public MyScrollView(Context context, AttributeSet attrs, int defStyleAttr) {  
  22.         super(context, attrs, defStyleAttr);  
  23.         // TODO Auto-generated constructor stub  
  24.     }  
  25.   
  26.     @Override  
  27.     public boolean onTouchEvent(MotionEvent ev) {  
  28.         // TODO Auto-generated method stub  
  29.         // 屏蔽touch事件,才能在监听其子控件的touch事件  
  30.         super.onTouchEvent(ev);  
  31.         return false;  
  32.     }  
  33.   
  34.     @Override  
  35.     public boolean onInterceptTouchEvent(MotionEvent event) {  
  36.         // 屏蔽touch事件传递,才能在监听其子控件的touch事件  
  37.         super.onInterceptTouchEvent(event);  
  38.         return false;  
  39.     }  
  40.   
  41.     @Override  
  42.     protected void onScrollChanged(int l, int t, int oldl, int oldt) {  
  43.         // TODO Auto-generated method stub  
  44.         super.onScrollChanged(l, t, oldl, oldt);  
  45.         if (onScrollChangedListeneer != null) {  
  46.             onScrollChangedListeneer.onScrollChanged(l, t, oldl, oldt);  
  47.         }  
  48.     }  
  49.   
  50.     // 滚动事件监听，获取滚动的距离，用户处理一些其他事  
  51.     public interface OnScrollChangedListeneer {  
  52.         public void onScrollChanged(int l, int t, int oldl, int oldt);  
  53.     }  
  54.   
  55.     public void setOnScrollChangedListeneer(  
  56.             OnScrollChangedListeneer onScrollChangedListeneer) {  
  57.         this.onScrollChangedListeneer = onScrollChangedListeneer;  
  58.     }  
  59.   
  60. }  


Java代码   收藏代码
  1. import android.app.Activity;  
  2. import android.content.Context;  
  3. import android.graphics.Point;  
  4. import android.os.Bundle;  
  5. import android.util.DisplayMetrics;  
  6. import android.util.Log;  
  7. import android.view.MotionEvent;  
  8. import android.view.View;  
  9. import android.view.View.OnTouchListener;  
  10. import android.view.WindowManager;  
  11. import android.widget.RelativeLayout.LayoutParams;  
  12.   
  13. import com.mb.door.MyScrollView.OnScrollChangedListeneer;  
  14. import com.ywl5320.scrollanima.R;  
  15.   
  16. public class MainActivity extends Activity {  
  17.   
  18.     private View layout_content;  
  19.     private MyScrollView scrollView;  
  20.     private int offsetsum = 0;// 总的手指滑动距离  
  21.     private Point point = new Point();  
  22.     private View layout_sliding;  
  23.   
  24.     private boolean isOpen = false; // true:显示详情 false 反之  
  25.     private int screenHeight = 0;  
  26.   
  27.     private int handlerHeight = 100;// 把手的高度,该高度最好动态获取  
  28.     private int threshold=300;   
  29.     private Context context;  
  30.   
  31.     @Override  
  32.     protected void onCreate(Bundle savedInstanceState) {  
  33.         super.onCreate(savedInstanceState);  
  34.         setContentView(R.layout.activity_main);  
  35.         context = this;  
  36.         initViews();  
  37.     }  
  38.   
  39.     private void initViews(){  
  40.         handlerHeight = dip2px(context, 100);// 把手的高度,该高度最好动态获取  
  41.         int statusBarHeight=getStatusBarHeight();  
  42.           
  43.         scrollView = (MyScrollView) findViewById(R.id.scrollView);  
  44.         layout_content = findViewById(R.id.layout_content);  
  45.         layout_sliding = findViewById(R.id.layout_sliding);  
  46.   
  47.         // 设置滑动层为屏幕高度  
  48.         LayoutParams lp = (LayoutParams) layout_content.getLayoutParams();  
  49.         screenHeight = getScreenHeight();  
  50.         lp.height = screenHeight - statusBarHeight;  
  51.         layout_content.setLayoutParams(lp);  
  52.   
  53.         // 设置详细层的高度：等于屏幕高度-状态栏高度-阴影提示高度  
  54.         LayoutParams lp2 = (LayoutParams) layout_sliding.getLayoutParams();  
  55.         lp2.height = screenHeight  - statusBarHeight- handlerHeight;  
  56.         layout_sliding.setLayoutParams(lp2);  
  57.   
  58.         // 为上层添加touch事件，控制详情页显示隐藏  
  59.         layout_content.setOnTouchListener(new OnTouchListener() {  
  60.   
  61.             @Override  
  62.             public boolean onTouch(View v, MotionEvent event) {  
  63.                 // TODO Auto-generated method stub  
  64.                 int action = event.getAction();  
  65.                 int offsety = 0;  
  66.                 int y = 0;  
  67.                 switch (action) {  
  68.                 case MotionEvent.ACTION_DOWN:  
  69.                     point.y = (int) event.getRawY();  
  70.                     offsetsum = 0;  
  71.                     break;  
  72.                 case MotionEvent.ACTION_MOVE:  
  73.                     y = (int) event.getRawY();  
  74.                     offsety = y - point.y;  
  75.                     offsetsum += offsety;  
  76.                     point.y = (int) event.getRawY();  
  77.                     scrollView.scrollBy(0, -offsety);  
  78.                     break;  
  79.                 case MotionEvent.ACTION_UP:  
  80.                     if(offsetsum==0){  
  81.                         return true;  
  82.                     }  
  83.                     if (offsetsum > 0) {// offsetsum大于0时是往下拉  
  84.                         if (offsetsum > threshold) {  
  85.                             close();  
  86.                         } else {  
  87.                             open();  
  88.                         }  
  89.                     } else {// offsetsum小于0时是往上拉  
  90.                         if (offsetsum < -threshold) {  
  91.                             open();  
  92.                         } else {  
  93.                             close();  
  94.                         }  
  95.                     }  
  96.   
  97.                     break;  
  98.                 }  
  99.                 return true;  
  100.             }  
  101.         });  
  102.   
  103.         scrollView.setOnScrollChangedListeneer(new OnScrollChangedListeneer() {  
  104.   
  105.             @Override  
  106.             public void onScrollChanged(int l, int t, int oldl, int oldt) {  
  107.                 // TODO Auto-generated method stub  
  108.                 Log.i("tag", l + "--" + t + "--" + oldl + "--"+ oldt);  
  109.             }  
  110.         });  
  111.     }  
  112.       
  113.     private void open() {  
  114.         scrollView.smoothScrollTo(0, screenHeight - handlerHeight);  
  115.         isOpen = true;  
  116.     }  
  117.   
  118.     private void close() {  
  119.         scrollView.smoothScrollTo(0, 0);  
  120.         isOpen = false;  
  121.     }  
  122.   
  123.     public void toggle(){  
  124.         if(isOpen){  
  125.             close();  
  126.         }else{  
  127.             open();  
  128.         }  
  129.     }  
  130.       
  131.     /** 
  132.      * 获取屏幕高度 
  133.      *  
  134.      * @return 
  135.      */  
  136.     public int getScreenHeight() {  
  137.         WindowManager wManager = (WindowManager) getApplicationContext()  
  138.                 .getSystemService(Context.WINDOW_SERVICE);  
  139.         DisplayMetrics dm = new DisplayMetrics();  
  140.         wManager.getDefaultDisplay().getMetrics(dm);  
  141.         return dm.heightPixels;  
  142.     }  
  143.   
  144.     /** 
  145.      * dip转换为px 
  146.      *  
  147.      * @param context 
  148.      * @param dipValue 
  149.      * @return 
  150.      */  
  151.     public int dip2px(Context context, float dipValue) {  
  152.         final float scale = context.getResources().getDisplayMetrics().density;  
  153.         return (int) (dipValue * scale + 0.5f);  
  154.     }  
  155.   
  156.     /** 
  157.      * 获取状态栏高度 
  158.      *  
  159.      * @return 
  160.      */  
  161.     public int getStatusBarHeight() {  
  162.         int result = 0;  
  163.         int resourceId = getResources().getIdentifier("status_bar_height",  
  164.                 "dimen", "android");  
  165.         if (resourceId > 0) {  
  166.             result = getResources().getDimensionPixelSize(resourceId);  
  167.         }  
  168.         return result;  
  169.     }  
  170.   
  171. }  


Xml代码   收藏代码
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     tools:context="${relativePackage}.${activityClass}" >  
  6.   
  7.     <com.mb.door.MyScrollView  
  8.         android:id="@+id/scrollView"  
  9.         android:layout_width="match_parent"  
  10.         android:layout_height="match_parent"  
  11.         android:scrollbars="none" >  
  12.   
  13.         <RelativeLayout  
  14.             android:layout_width="match_parent"  
  15.             android:layout_height="match_parent" >  
  16.   
  17.             <FrameLayout  
  18.                 android:id="@+id/layout_content"  
  19.                 android:layout_width="match_parent"  
  20.                 android:layout_height="match_parent" >  
  21.   
  22.                 <FrameLayout  
  23.                     android:layout_width="match_parent"  
  24.                     android:layout_height="match_parent"  
  25.                     android:layout_gravity="center"  
  26.                     android:background="@android:color/holo_blue_dark" >  
  27.                 </FrameLayout>  
  28.   
  29.                 <TextView  
  30.                     android:id="@+id/handler"  
  31.                     android:layout_width="match_parent"  
  32.                     android:layout_height="100dip"  
  33.                     android:layout_gravity="bottom"  
  34.                     android:background="#aa000000"  
  35.                     android:gravity="center"  
  36.                     android:text="上滑查看详情"  
  37.                     android:textColor="#ffffff" />  
  38.             </FrameLayout>  
  39.   
  40.             <FrameLayout   
  41.                 android:id="@+id/layout_sliding"  
  42.                 android:layout_width="match_parent"  
  43.                 android:layout_height="match_parent"  
  44.                 android:layout_below="@id/layout_content"  
  45.                 android:background="@android:color/white"  
  46.                 >  
  47.             </FrameLayout>  
  48.               
  49.         </RelativeLayout>  
  50.     </com.mb.door.MyScrollView>  
  51.   
  52. </RelativeLayout>  


事实上，同样的效果可以使用 ViewDragHelper实现
http://gundumw100.iteye.com/blog/2114716
  • ScrollAnima.rar (4.5 MB)
  • ScrollAnima.rar (5.2 MB)
  • 描述: SlidingUpPanelLayout
  • 查看图片附件

这篇关于ScrollView做的上拉效果的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/1136654。

相关文章

前端原生js实现拖拽排课效果实例

前端原生js实现拖拽排课效果实例

《前端原生js实现拖拽排课效果实例》：本文主要介绍如何实现一个简单的课程表拖拽功能,通过HTML、CSS和JavaScript的配合,我们实现了课程项的拖拽、放置和显示功能,文中通过实例代码介绍的... 目录1. 效果展示2. 效果分析2.1 关键点2.2 实现方法3. 代码实现3.1 html部分3.2
阅读更多...
基于Python实现PDF动画翻页效果的阅读器

基于Python实现PDF动画翻页效果的阅读器

《基于Python实现PDF动画翻页效果的阅读器》在这篇博客中,我们将深入分析一个基于wxPython实现的PDF阅读器程序,该程序支持加载PDF文件并显示页面内容,同时支持页面切换动画效果,文中有详... 目录全部代码代码结构初始化 UI 界面加载 PDF 文件显示 PDF 页面页面切换动画运行效果总结主
阅读更多...
React实现原生APP切换效果

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用
阅读更多...
使用Python实现生命之轮Wheel of life效果

使用Python实现生命之轮Wheel of life效果

《使用Python实现生命之轮Wheeloflife效果》生命之轮Wheeloflife这一概念最初由SuccessMotivation®Institute,Inc.的创始人PaulJ.Meyer... 最近看一个生命之轮的视频，让我们珍惜时间，因为一生是有限的。使用python创建生命倒计时图表，珍惜时间
阅读更多...
防近视护眼台灯什么牌子好？五款防近视效果好的护眼台灯推荐

防近视护眼台灯什么牌子好？五款防近视效果好的护眼台灯推荐

在家里，灯具是属于离不开的家具，每个大大小小的地方都需要的照亮，所以一盏好灯是必不可少的，每个发挥着作用。而护眼台灯就起了一个保护眼睛，预防近视的作用。可以保护我们在学习，阅读的时候提供一个合适的光线环境，保护我们的眼睛。防近视护眼台灯什么牌子好？那我们怎么选择一个优秀的护眼台灯也是很重要，才能起到最大的护眼效果。下面五款防近视效果好的护眼台灯推荐： 一：六个推荐防近视效果好的护眼台灯的
阅读更多...
在网页上制作仿电视演职员表效果

在网页上制作仿电视演职员表效果

阅读更多...
【Godot4.3】多边形的斜线填充效果基础实现

【Godot4.3】多边形的斜线填充效果基础实现

概述 图案（Pattern）填充是一个非常常见的效果。其中又以斜线填充最为简单。本篇就探讨在Godot4.3中如何使用Geometry2D和CanvasItem的绘图函数实现斜线填充效果。 基础思路 Geometry2D类提供了多边形和多边形以及多边形与折线的布尔运算。按照自然的思路，多边形的斜线填充应该属于“多边形与折线的布尔运算”范畴。 第一个问题是如何获得斜线，这条斜线应该满足什么样
阅读更多...
UniApp实现漂亮的音乐歌词滚动播放效果

UniApp实现漂亮的音乐歌词滚动播放效果

在现代的音乐播放应用中，歌词的展示和滚动播放已经成为了一个非常常见的功能。今天，我们将通过UniApp来实现一个漂亮的歌词滚动播放功能。我们将使用UniApp提供的组件和API来完成这个任务。 页面结构 在页面的模板部分，我们需要创建一个音频播放器和歌词展示区域。使用<scroll-view>组件来实现歌词的滚动效果。 <template><view class="audio-co
阅读更多...
Nuxt3入门：过渡效果（第5节）

Nuxt3入门：过渡效果（第5节）

你好同学，我是沐爸，欢迎点赞、收藏、评论和关注。 Nuxt 利用 Vue 的 <Transition> 组件在页面和布局之间应用过渡效果。 一、页面过渡效果 你可以启用页面过渡效果，以便对所有页面应用自动过渡效果。 nuxt.config.js export default defineNuxtConfig({app: {pageTransition: {name: 'fade',mode
阅读更多...
Differential Diffusion，赋予每个像素它应有的力量，以及在comfyui中的测试效果

Differential Diffusion，赋予每个像素它应有的力量，以及在comfyui中的测试效果

🥽原论文要点 首先是原论文地址：https://differential-diffusion.github.io/paper.pdf 其次是git介绍地址：GitHub - exx8/differential-diffusion 感兴趣的朋友们可以自行阅读。 首先，论文开篇就给了一个例子： 我们的方法根据给定的图片和文本提示，以不同的程度改变图像的不同区域。这种可控性允许我们再现
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2