PullScrollView进阶(二)-----图片下拉回弹(简易QQ空间下拉效果)

2024-08-31 23:48

本文主要是介绍PullScrollView进阶(二)-----图片下拉回弹(简易QQ空间下拉效果),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

效果是:下拉上边那个图片会相应放大,我主要是实现QQ空间里面那个效果,给出一个思路即可,具体希望网友给出建议


activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent" ><ImageViewandroid:id="@+id/background_img"android:layout_width="match_parent"android:layout_height="300dp"android:layout_marginTop="-100dp"android:scaleType="fitXY"android:src="@drawable/pic3" /><com.example.pullscrollview.CustomScrollViewandroid:id="@+id/pullscrollview"android:layout_width="match_parent"android:layout_height="match_parent" ><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginTop="100dp"android:scaleType="fitXY"android:src="@drawable/pic3" /></com.example.pullscrollview.CustomScrollView></FrameLayout>

MainActivity

package com.example.pullscrollview;import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ImageView;public class MainActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ImageView background_img = (ImageView) findViewById(R.id.background_img);CustomScrollView customScrollView = (CustomScrollView) findViewById(R.id.pullscrollview);customScrollView.setmHeaderView(background_img);}}

CustomScrollView

package com.example.pullscrollview;import android.content.Context;
import android.graphics.Rect;
import android.support.v4.content.ContextCompat;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.AnimationSet;
import android.view.animation.TranslateAnimation;
import android.widget.ScrollView;public class CustomScrollView extends ScrollView {// 图片控件视图private View mRootView;// 用来保存手指的当前位置坐标值private int mpreY = 0;// 初始化图片视图的矩形区域坐标位置private Rect mNormalRect;private Context context;// 底部图片private View mHeaderView;/*** 构造器* @param context* @param attrs*/public CustomScrollView(Context context, AttributeSet attrs) {super(context, attrs);this.context = context;}/*** onFinishInflate()函数,明显是在布局解析结束后会调用的函数。* 获取scrollView的孩子view控件*/@Overrideprotected void onFinishInflate() {mRootView = getChildAt(0);super.onFinishInflate();}/*** dp转px*/public static int dip2px(Context context, float dpValue) {final float scale = context.getResources().getDisplayMetrics().density;return (int) (dpValue * scale + 0.5f);}/*** 根据手机的分辨率从 px(像素) 的单位 转成为 dp*/public static int px2dip(Context context, float pxValue) {final float scale = context.getResources().getDisplayMetrics().density;return (int) (pxValue / scale + 0.5f);}public void setmHeaderView(View view) {mHeaderView = view;}/*** 在onTouchEvent()中根据手指的移动距离,通过layout()函数将布局跟随移动即可*/@Overridepublic boolean onTouchEvent(MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN: {// 获取手指当前的位置y轴坐标mpreY = (int) event.getY();if (mRootView != null) {// 进行布局位置--获取图片初始化的矩形区域mNormalRect = new Rect(mRootView.getLeft(), mRootView.getTop(),mRootView.getRight(), mRootView.getBottom());Log.e("TAG", ""+px2dip(context, mRootView.getTop()));//100dpLog.e("TAG", ""+px2dip(context, mRootView.getBottom()));//612dp}}break;case MotionEvent.ACTION_MOVE: {//获取目前的移动的y轴值float curY = event.getY();// 获取手指移动的距离--乘以0.25是凸显阻尼效果int delta = (int) (curY - mpreY);// 根据手指滑动的距离,进行重新布局那个图片View控件!!!!!!!!!!!!//将移动的距离转为dp进行判断int deltaDP = px2dip(context, delta);int deltaPx = dip2px(context, 100);if (deltaDP <= 100) {mRootView.layout(mRootView.getLeft(), mNormalRect.top + 2* delta, mRootView.getRight(), mNormalRect.bottom + 2* delta);mHeaderView.layout(mRootView.getLeft(), dip2px(context, -100)+ delta, mRootView.getRight(), dip2px(context, 200)+ delta);} else {mRootView.layout(mRootView.getLeft(), mNormalRect.top + 2* deltaPx, mRootView.getRight(), mNormalRect.bottom + 2* deltaPx);}}break;case MotionEvent.ACTION_UP: {//回归mHeaderView.layout(mRootView.getLeft(), dip2px(context, -100),mRootView.getRight(), dip2px(context, 200));// 回归到初始化的那个矩形位置即可mRootView.layout(mNormalRect.left, mNormalRect.top,mNormalRect.right, mNormalRect.bottom);}break;}// 保存每次手指移动的最新位置return super.onTouchEvent(event);}}


这篇关于PullScrollView进阶(二)-----图片下拉回弹(简易QQ空间下拉效果)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1125344

相关文章

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

Java实现在Word文档中添加文本水印和图片水印的操作指南

《Java实现在Word文档中添加文本水印和图片水印的操作指南》在当今数字时代,文档的自动化处理与安全防护变得尤为重要,无论是为了保护版权、推广品牌,还是为了在文档中加入特定的标识,为Word文档添加... 目录引言Spire.Doc for Java:高效Word文档处理的利器代码实战:使用Java为Wo

Three.js构建一个 3D 商品展示空间完整实战项目

《Three.js构建一个3D商品展示空间完整实战项目》Three.js是一个强大的JavaScript库,专用于在Web浏览器中创建3D图形,:本文主要介绍Three.js构建一个3D商品展... 目录引言项目核心技术1. 项目架构与资源组织2. 多模型切换、交互热点绑定3. 移动端适配与帧率优化4. 可

基于C#实现PDF转图片的详细教程

《基于C#实现PDF转图片的详细教程》在数字化办公场景中,PDF文件的可视化处理需求日益增长,本文将围绕Spire.PDFfor.NET这一工具,详解如何通过C#将PDF转换为JPG、PNG等主流图片... 目录引言一、组件部署二、快速入门:PDF 转图片的核心 C# 代码三、分辨率设置 - 清晰度的决定因

Python从Word文档中提取图片并生成PPT的操作代码

《Python从Word文档中提取图片并生成PPT的操作代码》在日常办公场景中,我们经常需要从Word文档中提取图片,并将这些图片整理到PowerPoint幻灯片中,手动完成这一任务既耗时又容易出错,... 目录引言背景与需求解决方案概述代码解析代码核心逻辑说明总结引言在日常办公场景中,我们经常需要从 W

从基础到进阶详解Python条件判断的实用指南

《从基础到进阶详解Python条件判断的实用指南》本文将通过15个实战案例,带你大家掌握条件判断的核心技巧,并从基础语法到高级应用一网打尽,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一... 目录​引言:条件判断为何如此重要一、基础语法:三行代码构建决策系统二、多条件分支:elif的魔法三、

使用Python实现无损放大图片功能

《使用Python实现无损放大图片功能》本文介绍了如何使用Python的Pillow库进行无损图片放大,区分了JPEG和PNG格式在放大过程中的特点,并给出了示例代码,JPEG格式可能受压缩影响,需先... 目录一、什么是无损放大?二、实现方法步骤1:读取图片步骤2:无损放大图片步骤3:保存图片三、示php

使用Python实现一个简易计算器的新手指南

《使用Python实现一个简易计算器的新手指南》计算器是编程入门的经典项目,它涵盖了变量、输入输出、条件判断等核心编程概念,通过这个小项目,可以快速掌握Python的基础语法,并为后续更复杂的项目打下... 目录准备工作基础概念解析分步实现计算器第一步:获取用户输入第二步:实现基本运算第三步:显示计算结果进

Python进阶之列表推导式的10个核心技巧

《Python进阶之列表推导式的10个核心技巧》在Python编程中,列表推导式(ListComprehension)是提升代码效率的瑞士军刀,本文将通过真实场景案例,揭示列表推导式的进阶用法,希望对... 目录一、基础语法重构:理解推导式的底层逻辑二、嵌套循环:破解多维数据处理难题三、条件表达式:实现分支

基于Python编写自动化邮件发送程序(进阶版)

《基于Python编写自动化邮件发送程序(进阶版)》在数字化时代,自动化邮件发送功能已成为企业和个人提升工作效率的重要工具,本文将使用Python编写一个简单的自动化邮件发送程序,希望对大家有所帮助... 目录理解SMTP协议基础配置开发环境构建邮件发送函数核心逻辑实现完整发送流程添加附件支持功能实现htm