实现背景的变色动画

原创 2015年07月09日 15:56:26

随便点击View中的任何位置,都会启动一个动画效果成圆形慢慢扩充全屏,要实现这个效果首先我们先要自定义一个View,在View中监听到我们手指点击的位置,在根据这个位置启动一个动画,

代码如下:

import android.animation.ObjectAnimator;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

@SuppressLint("NewApi")
public class lightView extends View {
	private ObjectAnimator ainm1;
	private float progress;
	private int x;
	private int y;
	private int x1;
	private int y1;
	private int director;
	private int colors;
	private Paint paint;

	public lightView(Context context) {
		super(context);
	}
	//实现在布局文件中使用
	public lightView(Context context, AttributeSet attrs) {
		super(context, attrs);
		paint = new Paint(Paint.ANTI_ALIAS_FLAG);
		//属性动画
		ainm1 = ObjectAnimator.ofFloat(this, "progress", 0, 1).setDuration(500);
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		paint.setColor(colors);
		if (y < getHeight() / 2 && x > getWidth() / 2) {
			y1 = getHeight() - y;
			director = (int) Math.sqrt(x * x + y1 * y1);
		}
		if (x < getWidth() / 2 && y > getHeight() / 2) {
			x1 = getWidth() - x;
			director = (int) Math.sqrt(x1 * x1 + y * y);
		}
		if (x < getWidth() / 2 && y < getHeight() / 2) {
			y1 = getHeight() - y;
			x1 = getWidth() - x;
			director = (int) Math.sqrt(x1 * x1 + y1 * y1);
		}
		if (x > getWidth() / 2 && y > getHeight() / 2) {
			director = (int) Math.sqrt(x * x + y * y);
		}
		float r = progress * director;
		//画圆
		canvas.drawCircle(x, y, r, paint);
	}

	public void setProgress(float progress) {
		this.progress = progress;
		postInvalidate();
	}
	
	//获取点击的位置
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_UP:
			x = (int) event.getX();
			y = (int) event.getY();
			ainm1.start();
			break;
		}
		return true;
	}
}

如果要想点击其他控件来实现背景变色,首先要用RelativeLayout布局,把我们自定义这个View放在其他布局后面,然后把onTouchEvent这个方法屏蔽掉,加上下面两个方法

代码如下:

public void setColor(int color){
		colors = color;
	}
	public void start(int width, int height){
		x = width;
		y = height;
		ainm1.start();
	}

具体调用如下:

我这里是在gridView中点击其中的每一项会有不同的颜色
gridView.setOnItemClickListener(new OnItemClickListener() {// 颜色选择

			@Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				//获取点击按钮在屏幕中的具体位置,local[0]为宽,local[1]为高
				int[] local = new int[2];
				view.getLocationInWindow(local);
				lightView.setColor(colors[position]);
				lightView.start(local[0] + view.getWidth() / 2, local[1]);
			}
		});





JS 颜色渐变动画

function tggg() { //$("#asd").css({ "background-color": "red" }).show().fadeOut(500); ...
  • lvgaolong
  • lvgaolong
  • 2011年11月28日 14:32
  • 4160

--------CSS 属性取值(news)--------

/*要想看到边框的颜色,就必须设置边框的样式,否则看不到效果。 border也可以简写:border:1px solid Red 意思是设置边框border宽度为1px,样式为sol...
  • Fanbin168
  • Fanbin168
  • 2014年07月13日 16:54
  • 2196

Android-利用动画实现背景逐渐变暗

前言之前写了一篇Android-实现底部弹出PopupWindow并让背景逐渐变暗,介绍利用Handler动态改变背景透明度从而达到变暗的效果。现在补充一种方法,使用动画来实现相同的效果。...
  • u014616515
  • u014616515
  • 2016年12月15日 09:48
  • 1982

一个点击背景变色的JAVA小程序

import java.awt.Button; import java.awt.Color; import java.awt.event.ActionEvent; import java.awt.ev...
  • qq_31214295
  • qq_31214295
  • 2015年10月28日 18:14
  • 437

Android 自定义View背景动画 流程简读 <2>

这一篇主要根据上一篇的大致说明,我相信如果看完这一篇,对开发自定义View将会有很大的帮助, 先介绍ColorStateList和StateListDrawable两个类: ColorStateL...
  • qq_31726827
  • qq_31726827
  • 2016年05月04日 13:09
  • 1637

CSS3动画实现背景滚动

在上一个模仿微信打飞机的游戏中,在敌机掉落下来时,如果背景图片也可以一直无穷滚动的话,那么效果就会更好。 现在就是要利用CSS3来实现一张图片的无穷滚动。首先了解一下CSS3的动画属性: ①.an...
  • csdn_zsdf
  • csdn_zsdf
  • 2017年04月26日 16:28
  • 1060

css学习笔记

今天就要回家咯。好开心。在回家之前把css大概的学习了一遍也好开心。断断续续的学了不到一个周吧。不过还没检测自己学的这样,一直都是看视频做笔记,也没敲代码,估计也没学的多好。笔记贴上来,有点乱糟糟的,...
  • yumenawei
  • yumenawei
  • 2015年08月20日 08:38
  • 179

WPF 坑系列之一 颜色渐变动画

WPF 坑系列之一 颜色渐变动画坑 动画对象不能用于动画属性“BorderBrush”,因为它是不兼容的类型“System.Windows.Media.Brush” ...
  • gulingeagle
  • gulingeagle
  • 2016年06月02日 11:34
  • 3946

用CSS3的animation轻松实现背景动画:漂浮的云

背景动画如果用的恰当,会给网页带来意想不到的效果。在过去,我们只能用flash或Javascript来实现。幸运的是,CSS3的流行使得我们完全可以使用它来实现这种效果,不再依赖其它编程技术。一段简单...
  • smxueer
  • smxueer
  • 2016年10月12日 22:57
  • 1203

Android ListView item 点击背景不变色

xml文件中   ListView添加属性android:listSelector="#00000000"   背景透明                                       ...
  • tian11tianjava
  • tian11tianjava
  • 2014年12月19日 10:11
  • 4771
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:实现背景的变色动画
举报原因:
原因补充:

(最多只允许输入30个字)