仿QQ空间视差效果,ListView.setHeader( )

根据listview的手指移动事件,动态设置listview上面的图片的宽高,并在手指放开的时候

实现图片的动画(随时间变化的动画值) ValueAnimator.ofInt ( )

import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Bitmap;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.ViewGroup;
import android.view.animation.OvershootInterpolator;
import android.widget.ImageView;
import android.widget.ListView;

/**
 * Created by lxj on 2017/1/5.
 */

public class ParallaxListView extends ListView {
    public ParallaxListView(Context context) {
        super(context);
    }

    public ParallaxListView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ParallaxListView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    int originalHeight;//最初的高度,就是120dp
    ImageView image;
    int maxHeight;//小孩的最大高度,就是设定为图片本身的高度
    public void setParallaxImage(ImageView image){
        this.image = image;

        //从dimens文件中读取image_height的值,并自动转为像素
        originalHeight = getResources().getDimensionPixelSize(R.dimen.image_height);

        maxHeight = this.image.getDrawable().getIntrinsicHeight();
    }

    /**
     * 该方法是在listview滑动到头的时候执行,并且可以在该方法中获取到手指移动的距离
     * @param deltaY    手指移动的距离,顶部到头是负值,底部到头是正值
     * @param scrollY   scrollTo滚动的坐标
     * @param maxOverScrollY    listview滑到头之后可以继续滑动的最大距离
     * @param isTouchEvent   是否是手指拖动到头,true:是, false:表示是靠惯性滑动到头
     * @return
     */
    @Override
    protected boolean overScrollBy(int deltaX, int deltaY, int scrollX, int scrollY,
                                   int scrollRangeX, int scrollRangeY,
                                   int maxOverScrollX, int maxOverScrollY,
                                   boolean isTouchEvent) {

        //如果是手指拖动到头,并且是顶部到头,其他忽略不处理
        if(isTouchEvent && deltaY<0){
            //让ImageView的高度随着手指移动而增高
            int newHeight = image.getHeight() + Math.abs(deltaY)/3;
            //限制newHeight
            if(newHeight>maxHeight){
                newHeight = maxHeight;
            }

            ViewGroup.LayoutParams params = image.getLayoutParams();
            params.height = newHeight;
            image.setLayoutParams(params);
        }

        return super.overScrollBy(deltaX, deltaY, scrollX, scrollY, scrollRangeX,              scrollRangeY, maxOverScrollX, maxOverScrollY, isTouchEvent);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        if(ev.getAction()==MotionEvent.ACTION_UP){
            //让ImageView的高度缓慢恢复到最初的120高度
            ValueAnimator animator = ValueAnimator.ofInt(image.getHeight(),originalHeight);
            //监听动画值的变化,实现自己的动画逻辑
            animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator animation) {
                    int value = (int) animation.getAnimatedValue();
                    //我们需要将value设置给高度
                    ViewGroup.LayoutParams params = image.getLayoutParams();
                    params.height = value;
                    image.setLayoutParams(params);
                }
            });
            animator.setInterpolator(new OvershootInterpolator());
            animator.setDuration(500);
            animator.start();

        }
        return super.onTouchEvent(ev);
    }
}
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AbsListView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

    private ParallaxListView listview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        listview = (ParallaxListView) findViewById(R.id.listview);

        //去掉listview滑动到头的时候边缘的蓝色阴影
        listview.setOverScrollMode(AbsListView.OVER_SCROLL_NEVER);

        //添加header
        View header = View.inflate(this, R.layout.header, null);
        ImageView image = (ImageView) header.findViewById(R.id.image);
        listview.addHeaderView(header);
        //设置ImageView
        listview.setParallaxImage(image);

        listview.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,
                Constant.NAMES));

    }
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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.zh.parallax97.MainActivity">

    <com.itheima.parallax97.ParallaxListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>
时间: 2024-08-05 15:10:34

仿QQ空间视差效果,ListView.setHeader( )的相关文章

ScrollView的阻尼回弹效果实现(仿qq空间)

玩过新浪微博,qq空间等手机客户端的童鞋,都应该清楚,在主界面向下滑动时,会有一个阻尼回弹效果,看起来挺不错,接下来我们就来实现一下这种效果,下拉后回弹刷新界面,先看效果图: 这个是编辑器里面的界面效果,不言自明: 运行效果: 正常界面下: 下拉: 下拉结束: 实现代码: 主要部分就是重写的ScrollView: package com.byl.scollower; import android.content.Context; import android.graphics.Rect; imp

安卓开发之Kotlin和java双实现仿qq空间下拉图片拉伸

先不扯淡看今天要实现的效果: 话说使用Kotlin实现安卓功能,那我们还是要做一点准备工作,so,你得加一点插件到eclipse或android studio.然并卵,你现在还在使用eclipse开发的话我只能提供地址Kotlin Plugin for Eclipse,然后我使用的还是死丢丢. 死丢丢(android studio)集成kotlin安卓开发 要使用android studio开发kotlin的安卓app,那么你必须有开发kotlin的环境: Kotlin插件.打开Android

Fragment,仿QQ空间

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9023451          在今天的这篇文章当中,我依然会以实战加理论结合的方式教大家如何设计出自己觉得很炫的UI界面.好的,话不多说,进入正题.今天的这篇文章主要是以仿QQ空间的底部菜单栏效果为主,实现的效果有: <1>实现了点击按钮时的切换图片效果: <2>实现了点击按钮时的切换界面效果: <3>实现了点击中间圆形按钮时弹出菜单以及按钮图片切

IOS仿QQ空间时间显示

最近项目有类似QQ空间展示动态的UI,模仿了QQ空间的时间显示,在此记录,以备查阅. 这是QQ空间的ui: 时间显示为: 1.今天-->今天 xx:xx(今天 15:39)   2.昨天-->昨天 xx:xx(昨天 06:00)   3.前天-->前天 xx:xx(前天 19:00)   4.同一年, 例如:同一年的一月三号-->01-03 xx:xx(01-03 12:29)   5.不在同一年 --> xxxx-xx-xx(2014-12-12) 程序运行效果如下,以下为

仿QQ空间图片放缩查看

仿QQ空间图片放缩查看 仿QQ空间图片放缩查看,点击图片从原位置放大到全屏,后退从全屏缩小到原位置,效果非常好. 下载地址:http://www.devstore.cn/code/info/830.html  运行截图:   

【Android UI设计与开发】第09期:底部菜单栏(四)Fragment+PopupWindow仿QQ空间最新版底部菜单栏

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9023451          在今天的这篇文章当中,我依然会以实战加理论结合的方式教大家如何设计出自己觉得很炫的UI界面.好的,话不多说,进入正题.今天的这篇文章主要是以仿QQ空间的底部菜单栏效果为主,实现的效果有: <1>实现了点击按钮时的切换图片效果: <2>实现了点击按钮时的切换界面效果: <3>实现了点击中间圆形按钮时弹出菜单以及按钮图片切

Html - 仿QQ空间右下角工具浮动块

仿QQ空间右下角工具浮动块 <style type="text/css"> .cy-tp-area>.cy-tp-fixbtn>.cy-tp-text { display: none; margin-top: 15px; text-align: center; text-decoration: none; } .cy-tp-area>.cy-tp-fixbtn { background-color: #fafafa; color: #8c8c8c; } .

仿QQ空间用一个tableview显示多种自定义cell

第一部分 要实现效果 先来看看真实QQ空间的效果吧: 从这张截图中,可以看到两种自定义的cell,其实在QQ空间的我的空间中有三种自定义的cell,那么这就是我们要实现的效果. 第二部分 实现的思路 第一步(由于没有数据源,我们只好操作plist文件): 创建我们所需要的plist文件,如下图: 这是表格样式三所需的plist文件 这是我们表格样式一所需的plist文件 这是表格样式二所需要的文件 第二步 有了素材文件之后,就好办了,我们需要把它解析出来,由于这些plist文件都是以数组形式包装

android 自定义scrollview 仿QQ空间效果 下拉伸缩顶部图片,上拉回弹 上拉滚动顶部title 颜色渐变

首先要知道  自定义scrollview 仿QQ效果 下拉伸缩放大顶部图片 的原理是监听ontouch事件,在MotionEvent.ACTION_MOVE事件时候,使用不同倍数的系数,重置布局位置[注此处是伸缩隐藏,不是同比例放大] inner.layout(normal.left, (int) (normal.top + inner_move_H), normal.right, (int) (normal.bottom + inner_move_H)); 关于“自定义scrollview 仿