gallery左右滑动时图片淡入淡出

前几天,公司项目有一个功能要做成滑动图片的淡入淡出,要一边滑动一边改变,所以ViewFlipper左右滑动效果就不能了。网上找了很久,也找不到资料,所以自己写了一个,通过滑动改变imageView的透明度。当按下图片时,先记下imageView的位置,图片滑动时,位置发生变化,就可以算出移动的距离,从而可以算出alpha的值。当图片向左滑动时,设置imageView的Alpha即imageView.setAlpha(255-alpha),设置下一个nextView的Alpha即nextView.setAlpha(alpha);当图片向右滑动时,设置imageView的Alpha即imageView.setAlpha(255-alpha),设置上一个lastView的Alpha即lastView.setAlpha(alpha);效果如图所示

      

废话就不多说了,上代码哈


package com.gallery.gradient;

import android.content.Context;
import android.util.AttributeSet;
import android.view.KeyEvent;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;

public class MyGallery extends Gallery {

private ImageAdapter adapter;
private int position ;
private ImageView imageView;
private int[] viewLocation;
private ImageView nextView;
private ImageView lastView;
private int winWeight;
private Context context;

public MyGallery(Context context, AttributeSet attrs) {
super(context, attrs);
this.context = context;
}

public MyGallery(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
this.context = context;
}

public MyGallery(Context context, int[] residList) {
super(context);
this.context = context;
adapter = new ImageAdapter(context, residList);
setAdapter(adapter);
}

@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
position = getSelectedItemPosition();
imageView = (ImageView) findViewWithTag(position);
viewLocation = new int[2];
imageView.getLocationInWindow(viewLocation);
WindowManager wm = (WindowManager) context.getApplicationContext().getSystemService(
Context.WINDOW_SERVICE);
winWeight = wm.getDefaultDisplay().getWidth();
break;
case MotionEvent.ACTION_MOVE:

break;
case MotionEvent.ACTION_UP:
// int position = getSelectedItemPosition();
// ImageView imageView = (ImageView) findViewWithTag(position);
// if (imageView != null) {
// System.out.println("imageView");
// imageView.setAlpha(255);
// int[] location = new int[2];
// imageView.getLocationInWindow(location);
// }
break;

default:
break;
}

return super.onTouchEvent(event);
}

// @Override
// public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
// float distanceY) {
// if (e1.getX() > e2.getX()) {
// lastView = (ImageView) findViewWithTag(position+1);
// }else {
// nextView = (ImageView) findViewWithTag(position-1);
// }
//
//
// return super.onScroll(e1, e2, distanceX, distanceY);
// }

@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
int[] location = new int[2];
imageView.getLocationInWindow(location);

if (location[0] != 0) {
if (location[0] > viewLocation[0]) {
int alpha = location[0] - viewLocation[0];
alpha = alpha * 255 / winWeight;
imageView.setAlpha(255-alpha);
lastView = (ImageView) findViewWithTag(position-1);
if (lastView != null) {
lastView.setAlpha((alpha));
}
}else {
int alpha = viewLocation[0] - location[0];
alpha = alpha * 255 / winWeight;
imageView.setAlpha(255-alpha);
nextView = (ImageView) findViewWithTag(position+1);
if (nextView != null) {
nextView.setAlpha(alpha);
}
}
}
if (location[0] == 0) {
if (lastView != null) {
lastView.setAlpha((255));
}
if (nextView != null) {
nextView.setAlpha(255);
}
}
}

@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,

float velocityY) {
int kEvent;
if(isScrollingLeft(e1, e2)){ //Check if scrolling left
kEvent = KeyEvent.KEYCODE_DPAD_LEFT;
}
else{ //Otherwise scrolling right
kEvent = KeyEvent.KEYCODE_DPAD_RIGHT;
}
onKeyDown(kEvent, null);
return true;
}

private boolean isScrollingLeft(MotionEvent e1, MotionEvent e2){
return e2.getX() > e1.getX();
}

public class ImageAdapter extends BaseAdapter {
private Context mcontext;
private int[] residList;

public ImageAdapter(Context context, int[] residList) {
this.residList = residList;
mcontext = context;
}

@Override
public int getCount() {
return residList.length;
}

@Override
public Object getItem(int position) {
return residList[position];
}

@Override
public long getItemId(int position) {
return position;
}

public int getResId(int position) {
return residList[position];
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
ImageView img;
if (convertView == null) {
img = new ImageView(mcontext);
img.setScaleType(ImageView.ScaleType.FIT_XY);
img.setLayoutParams(new Gallery.LayoutParams(-1, -1));

} else {
img = (ImageView) convertView;
}
img.setTag(position);
img.setImageResource(residList[position]);
return img;
}

}
}

代码下载链接 http://pan.baidu.com/s/1hqxaYTu

gallery左右滑动时图片淡入淡出,布布扣,bubuko.com

时间: 2024-10-12 04:15:29

gallery左右滑动时图片淡入淡出的相关文章

有关网页常见图片淡入淡出的效果的随笔

网页常见的图片淡入淡出的效果还是比较常见的,在这里,我个人来分享一些自己的一些笔记. <!DOCTYPE html><html><head>    <meta charset="utf-8">    <title>淡入淡出图片效果图</title>    <style type="text/css">        #img1{ filter:alpha(opacity:30); o

javascript 图片淡入淡出效果 实例源代码

? 1 代码说明:把代码粘贴好之后,需要更改html代码中的图片路径,即可执行成功.<br>后面还有对js代码的详细说明,希望大家好好消化,好好理解.<br><br>html源代码: 1 <head> 2 <title>图片切换</title> 3 <script type="text/javascript" src="图片切换.js"></script> 4 <l

图片淡入淡出代码,鼠标移上透明度变化

又一个图片透明度特效,鼠标移在图片上,图片的透明度就发生变化,最初的透明度为20,鼠标移上后透明度恢复正常,很明显的响应鼠标的图片特效,而且代码超简单,新手也能学会使用. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>石家庄伸缩门</title> </head>

React-Native ListView加载图片淡入淡出效果的组件

今天练习项目中需要给listview在加载图片时增加一个淡入淡出的效果,因此干脆就自己封装了一个组件: 1 'use strict' 2 3 import React from 'react-native' 4 5 var { 6 Animated, 7 PropTypes 8 } = React 9 10 class AniImage extends React.Component { 11 static propTypes = { 12 url: PropTypes.string, 13 i

09.11 jquery04 效果 基本 滑动滑出 淡入淡出 自定义动画 动画操作 工具 浏览器 对象和属性操作核心

# 效果 ### 基本 (width/height/opacity) * show() * hide() * toggle() ### 滑动滑出 (height) * slideUp()       隐藏 * slideDown()  显示 * slideToggle() ### 淡入淡出 * fadeOut()    隐藏 * fadeIn()      显示 * fadeToggle() * fadeTo() 不占用位置 消失之后后面的自动向上移动 ### 自定义动画 * animate(p

js实现多个图片淡入淡出,框架

单个淡入淡出已经写过,可以看看上几遍的博文 <style> *{ margin:0; padding:0; } div{ height:100px; width:100px; background:red; margin:0 auto; margin-bottom:5px; filter:alpha(opacity:30); opacity:0.3; } </style> <body> <div></div> <div></di

JQuery--基础动画、滑动动画、淡入淡出动画、自定义动画

1 /** 2 * [JQ基础动画] 3 * show() 显示 4 * hide() 隐藏 5 * toggle() 切换 6 * 默认无动画,如果要产生动画 7 * 在括号内,添加毫秒数,可产生动画和控制动画的快慢 8 * 9 * <滑动动画> 10 * slideDown() 滑动显示(下) 11 * slideUp() 滑动隐藏(上) 12 * slideToggle 滑动切换 13 * 默认有动画,默认是400毫秒 14 * <淡入淡出动画> 15 * fadeIn()

iOS-CALayer图片淡入淡出动画

#import "ViewController.h" @interface ViewController ()@property (nonatomic,strong)CALayer *imageLayer; @end @implementation ViewController - (void)viewDidLoad {    [super viewDidLoad];    UIImage *image1 = [UIImage imageNamed:@"test1.jpg&q

实现基本的图片淡入淡出的效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #img1 { filter: alpha(opacity:20); opacity: 0.2; } </style> <script> window.onload = f