Android自定义View图片按Path运动和旋转

本文实例为大家分享了Android自定义View图片按Path运动旋转的具体代码,供大家参考,具体内容如下

View:

/**
 * author : stone
 * email : aa86799@163.com
 * time : 16/5/29 15 29
 */
public class EarthPathView extends View { 

 private Path mPath;
 private Paint mPaint;
 private Bitmap mBitmap;
 private PathMeasure mPathMeasure;
 private float[] mPoint;
 private float[] mTan;
 private float mDdegrees; 

 public EarthPathView(Context context) {
  this(context, null);
 } 

 public EarthPathView(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 } 

 public EarthPathView(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr); 

  mPaint = new Paint();
  mPaint.setColor(Color.RED);
  mPaint.setStyle(Paint.Style.STROKE);
  mPaint.setStrokeWidth(10); 

  InputStream is = getResources().openRawResource(R.drawable.earth);
  mBitmap = BitmapFactory.decodeStream(is); 

 } 

 public void setPath(Path path) {
  mPath = path;
  mPathMeasure = new PathMeasure(path, false);
  mPoint = new float[2];
  mTan = new float[2]; 

 } 

 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  if (mPath == null) {
   return;
  } 

  canvas.rotate(mDdegrees+=2, getWidth()/2, getHeight()/2);
  canvas.drawPath(mPath, mPaint); 

  float degress = (float) Math.toDegrees(Math.atan2(mTan[1], mTan[0]));
  Matrix matrix = new Matrix();
  matrix.postRotate(degress, mBitmap.getWidth() / 2, mBitmap.getHeight() / 2);
  matrix.postTranslate(mPoint[0] - mBitmap.getWidth() / 2, mPoint[1] - mBitmap.getHeight() / 2);
  canvas.drawBitmap(mBitmap, matrix, null); 

 } 

 @TargetApi(Build.VERSION_CODES.HONEYCOMB)
 public void startAnim() {
  ValueAnimator animator = ValueAnimator.ofFloat(0, mPathMeasure.getLength());
  animator.setDuration(2000);
  animator.setInterpolator(new LinearInterpolator()); //插值器
  animator.setRepeatCount(ValueAnimator.INFINITE);
  animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
   @Override
   public void onAnimationUpdate(ValueAnimator animation) {
    float distance = (float) animation.getAnimatedValue();
    mPathMeasure.getPosTan(distance, mPoint, mTan);
    invalidate();
   }
  });
  animator.start();
 }
}

Activity

package com.stone.canvaspath; 

import android.app.Activity;
import android.graphics.Path;
import android.os.Bundle; 

import com.stone.canvaspath.earth.EarthPathView; 

/**
 * author : stone
 * email : aa86799@163.com
 * time : 16/5/29 15 27
 */
public class EarthActivity extends Activity { 

 private EarthPathView mPathView;
 private Path mPath; 

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState); 

  int w = getResources().getDisplayMetrics().widthPixels;
  int h = getResources().getDisplayMetrics().heightPixels; 

  mPathView = new EarthPathView(this); 

  setContentView(mPathView); 

  int min = Math.min(w, h);
  buildPath(w / 2 + 100, h / 2 + 100, min / 4); 

  mPathView.setPath(mPath); 

  mPathView.startAnim();
 } 

 private void buildPath(float x, float y, float radius) {
  mPath = new Path();
  mPath.addCircle(x, y, radius, Path.Direction.CW);
 } 

} 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android 自定View实现仿QQ运动步数圆弧及动画效果

    在之前的Android超精准计步器开发-Dylan计步中的首页用到了一个自定义控件,和QQ运动的界面有点类似,还有动画效果,下面就来讲一下这个View是如何绘制的. 1.先看效果图 2.效果图分析 功能说明:黄色的代表用户设置的总计划锻炼步数,红色的代表用户当前所走的步数. 初步分析:完全自定义View重写onDraw()方法,画圆弧. 3.画一个圆弧必备知识 在Canvas中有一个画圆弧的方法 drawArc(RectF oval, float startAngle, float sweepA

  • Android UI设计系列之ImageView实现ProgressBar旋转效果(1)

    提起ProgressBar,想必大家都比较熟悉,使用起来也是比较方便,直接在XML文件中引用,然后添加属性,运行就OK了,虽然使用ProgressBar很方便但是在我们开发的每一个应用基本上都有自己的主体风格,如果使用了系统自带的效果图,给人的感觉是和总体风格太不搭配了,看上去很是别扭,我们自己开发也觉得不爽,于是就想着自定义一下效果,其实自定义ProgressBar的效果也不难,大概可分为三步走吧: 一.在anim文件夹下使用animation-list定义动画集 <?xml version=

  • Android自定义View实现叶子飘动旋转效果(四)

    上一篇实现了叶子飘动功能,<Android自定义叶子飘动> 现在实现旋转效果 要实现这个效果,要在之前的功能上添加2个功能 1.通过matrix.postTranslate(int x, int y)在添加在Y轴上滑动 2.通过matrix.postRotate(float degrees, float px, float py)实现叶子旋转 代码实现 1.获取Y坐标 private float getMatrixY() { float w = (float) ((float) 2 * Mat

  • Android自定义View仿微博运动积分动画效果

    自定义View一直是自己的短板,趁着公司项目不紧张的时候,多加强这方面的练习.这一系列文章主要记录自己在自定义View的学习过程中的心得与体会. 刷微博的时候,发现微博运动界面,运动积分的显示有一个很好看的动画效果.OK,就从这个开始我的自定义view之路! 看一下最后的效果图: 分数颜色,分数大小,外圆的颜色,圆弧的颜色都支持自己设置,整体还是和微博那个挺像的.一起看看自定义View是怎样一步一步实现的: 1.自定义view的属性: 在res/values/ 下建立一个attrs.xml ,

  • Android UI之ImageView实现图片旋转和缩放

    这一篇,给大家介绍一下ImageView控件的使用,ImageView主要是用来显示图片,可以对图片进行放大.缩小.旋转的功能. android:sacleType属性指定ImageVIew控件显示图片的方式,例如:center表示图像以不缩放的方式显示在ImageView控件的中心,如果设置为fitCenter,表示图像按照比例缩放至合适的位置,并在ImageView控件的中心. 首先我们开发一个简单的案例,实现图片的放大缩小和旋转: 先看看实现的效果: 缩放截图1: 缩放截图2: 旋转截图1

  • Android自定义View实现QQ音乐中圆形旋转碟子

    QQ音乐中圆形旋转碟子 思路分析: 1.在onMeasure中测量整个View的宽和高后,设置宽高 2.获取我们res的图片资源后,在ondraw方法中进行绘制圆形图片 3.通过Handler发送Runnable来启动旋转线程(如果只想做圆形头像的话,这步可以去掉) 4.在布局中使用我们的View 效果图: 贴出我们的变量信息: //view的宽和高 int mHeight = 0; int mWidth = 0; //圆形图片 Bitmap bitmap = null; //圆形图片的真实半径

  • Android自定义View叶子旋转完整版(六)

    上一篇实现多叶子飘动旋转,今天完成最后的功能. 1.添加右侧旋转枫叶 2.添加滑动条效果,显示百分比 3.修复叶子飘出边框问题 1.添加右侧旋转叶子 Bitmap turnBitmap = ((BitmapDrawable) mResources.getDrawable(R.drawable.fengshan, null)).getBitmap(); int turnLeafAngle = 0; private void setTurnLeaf(Canvas canvas) { Matrix m

  • Android中imageView图片放大缩小及旋转功能示例代码

    一.简介 二.方法 1)设置图片放大缩小效果 第一步:将<ImageView>标签中的android:scaleType设置为"fitCenter" android:scaleType="fitCenter" 第二步:获取屏幕的宽度 DisplayMetrics dm=new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(dm); dm.widthPixels 第三

  • Android使用RotateImageView 旋转ImageView

    废话不多说了,直接给大家代码. 具体代码如下所示: package com.droidhen.game.layout; import android.content.Context; import android.graphics.Bitmap; import android.graphics.Bitmap.Config; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.

  • Android自定义View实现QQ运动积分转盘抽奖功能

    因为偶尔关注QQ运动, 看到QQ运动的积分抽奖界面比较有意思,所以就尝试用自定义View实现了下,原本想通过开发者选项查看下界面的一些信息,后来发现积分抽奖界面是在WebView中展示的,应该是在H5页面中用js代码实现的,暂时不去管它了. 这里的自定义View针对的是继承自View的情况,你可以将Canvas想象为画板, Paint为画笔,自定义View的过程和在画板上用画笔作画其实类似,想象在画板上作画的过程,你要画一个多大图形(对应View的测量 onMeasure方法),你要画什么样的图

随机推荐