当前位置： 移动技术网 > 移动技术>移动开发>Android > Android自定义view制作抽奖转盘

Android自定义view制作抽奖转盘

2019年07月31日  | 移动技术网移动技术  | 我要评论

本文实例为大家分享了android自定义view制作抽奖转盘的具体代码，供大家参考，具体内容如下

效果图

turntableactivity

package com.bawei.myapplication.turntable;

import android.support.v7.app.appcompatactivity;
import android.os.bundle;
import android.view.motionevent;
import android.view.view;
import android.view.animation.rotateanimation;

import com.bawei.myapplication.r;
import com.bawei.myapplication.turntable.customturntableview;

/**
 * 转盘
 * @author hasee
 */
public class turntableactivity extends appcompatactivity {

 customturntableview customturntableview;
 boolean istouchinside = false;
 float mdownx, mdowny;


 @override
 protected void oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  setcontentview(r.layout.activity_turntable);

  initview();
 }

 private void initview() {
  customturntableview = findviewbyid(r.id.custom);
//  findviewbyid(r.id.custom_inside).setonclicklistener(new view.onclicklistener() {
//   @override
//   public void onclick(view v) {
//    float degrees = (float)(720 + math.random() * 1000);
//    rotateanimation rotateanimation = new rotateanimation(0, -degrees, 450, 450);
//    rotateanimation.setduration(5000);
//    rotateanimation.setfillafter(true);
//    customcircleview.startanimation(rotateanimation);
//   }
//  });

  findviewbyid(r.id.custom_inside).setontouchlistener(new view.ontouchlistener() {
   @override
   public boolean ontouch(view v, motionevent event) {
    if (event.getaction() == motionevent.action_down &&
      event.getx() > 200 &&
      event.getx() < 300 &&
      event.gety() > 200 &&
      event.gety() < 300) {
     istouchinside = true;
     mdownx = event.getx();
     mdowny = event.gety();
     return true;
    }else if(event.getaction() == motionevent.action_move && (
      event.getx() < mdownx -10 ||
      event.getx() > mdownx + 10 ||
      event.gety() < mdowny -10 ||
      event.gety() > mdowny + 10) ){
     istouchinside = false;
    } else if (event.getaction() == motionevent.action_up &&
      event.getx() > mdownx -10 &&
      event.getx() < mdownx + 10 &&
      event.gety() > mdowny -10 &&
      event.gety() < mdowny + 10 &&
      istouchinside) {
     float degrees = (float) (720 + math.random() * 1000);
     rotateanimation rotateanimation = new rotateanimation(0, -degrees, 250, 250);
     rotateanimation.setduration(5000);
     rotateanimation.setfillafter(true);
     customturntableview.startanimation(rotateanimation);
    }
    istouchinside = false;
    return false;
   }
  });
 }
}

对应的布局

<?xml version="1.0" encoding="utf-8"?>
<relativelayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:id="@+id/ll"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 tools:context=".mainactivity">

 <com.bawei.myapplication.turntable.customturntableview
  android:id="@+id/custom"
  android:layout_width="wrap_content"
  android:layout_height="500dp"
  />

 <com.bawei.myapplication.turntable.customturntableinsideview
  android:id="@+id/custom_inside"
  android:layout_width="wrap_content"
  android:layout_height="500dp"
  app:text="开始"
  android:background="#3300ff00" />
</relativelayout>

自定义customturntableview继承view

package com.bawei.myapplication.turntable;

import android.content.context;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.paint;
import android.graphics.path;
import android.graphics.rectf;
import android.support.annotation.nullable;
import android.util.attributeset;
import android.view.view;

/**
 * 这里是画转盘的
 * @author hasee
 */
public class customturntableview extends view{
 paint mpaint;
 int mcirclecount = 6;
 float mstartangle = 0;

 rectf rectf;

 public customturntableview(context context) {
  super(context);
  init();
 }

 public customturntableview(context context, @nullable attributeset attrs) {
  super(context, attrs);
  init();
 }

 private void init(){
  mpaint = new paint();
  mpaint.setcolor(color.blue);
  mpaint.setstrokewidth(10);
  mpaint.settextsize(60);
  mpaint.setstyle(paint.style.fill);

  rectf = new rectf();
  rectf.top = 100;
  rectf.left = 100;
  rectf.right = 400;
  rectf.bottom = 400;
 }
 string[] textcolor = {"一 等 奖","二 等 奖","三 等 奖","四 等 奖","五 等 奖","六 等 奖"};
 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);
  for(int i = 0; i < mcirclecount; i++){
   //按角标单双号设置扇形颜色，
   if(i % 2 == 0 ){
    mpaint.setcolor(color.blue);
   }else{
    mpaint.setcolor(color.green);
   }
   canvas.drawarc(rectf, mstartangle, 60, true, mpaint);
   //设置转盘上的文字
   mpaint.setcolor(color.black);
   mpaint.settextsize(20);
   path path = new path();
   path.addarc(rectf,mstartangle+20,60);
   canvas.drawtextonpath(textcolor[i],path,-10,40,mpaint);
   mstartangle += 60;
  }
 }
}

自定义customturntableinsideview继承view

package com.bawei.myapplication.turntable;

import android.content.context;
import android.content.res.typedarray;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.paint;
import android.graphics.rectf;
import android.support.annotation.nullable;
import android.util.attributeset;
import android.view.view;

import com.bawei.myapplication.r;

/**
 * 转盘中间开始按钮和指针
 * @author hasee
 */
public class customturntableinsideview extends view {
 /**
  * 画笔
  */
 paint mpaint;
 rectf mrectf;
 string mstr;

 public customturntableinsideview(context context) {
  super(context);
  init();
 }

 public customturntableinsideview(context context, @nullable attributeset attrs) {
  super(context, attrs);

  //自定义属性，如何添加自定义属性如下（考点）
  //第一步：在values文件夹下创建attrs.xml
  //第二步：详见attrs.xml文件内部
  //第三步：在所在的布局文件的根layout中添加xmlns:app="http://schemas.android.com/apk/res-auto"
  //第四步：在布局文件的控件中添加app:"你在attrs中设置的attr name"="你的值"
  //第五步：调用下面这句话，最后的为r.styleable.你在attrs中设置的declare-styleable name
  typedarray typedarray = context.obtainstyledattributes(attrs, r.styleable.customturntableview);
  //第六步：调用下面这句话，根据你在attrs中设置的format，选择getxxx方法，
  //入参为 r.styleable. 加上 你在attrs中设置的declare-styleable name 加上 _ 加上 你在attrs中设置的attr name
  mstr = typedarray.getstring(r.styleable.customturntableview_text);
  init();
 }

 private void init() {
  //以下注释请看custombingview里面
  mpaint = new paint();
  mpaint.setcolor(color.red);
  mpaint.setstrokewidth(10);
  mpaint.settextsize(20);
  mpaint.setstyle(paint.style.fill);

  mrectf = new rectf();
  mrectf.top = 50;
  mrectf.bottom = 300;
  mrectf.right = 300;
  mrectf.left = 200;
 }

 @override
 protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
  super.onmeasure(widthmeasurespec, heightmeasurespec);

//  setmeasureddimension(300, 300);
 }

 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);

  //设置画笔颜色为黑色，
  mpaint.setcolor(color.black);
  //画出指针，用一个扇形，然后盖住后面补分来简单表示
  canvas.drawarc(mrectf, 60, 60, true, mpaint);

  mpaint.setcolor(color.red);
  //画一个红色的圆形，就是中间的大按钮
  canvas.drawcircle(250, 250, 50, mpaint);

  mpaint.setcolor(color.black);
  //添加按钮上的文字
  canvas.drawtext(mstr, 230, 260, mpaint);

  //画三角，第一步，创建路径
//  path path = new path();
  //第二步，moveto第一个顶点
//  path.moveto(300, 300);
  //后续相继lineto其他顶点
//  path.lineto(300, 400);
//  path.lineto(400, 400);
  //闭合
//  path.close();
//  画
//  canvas.drawpath(path, mpaint);
 }
}

自定义属性attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <!-- name为想要调用这个属性的类名即可 -->

 <declare-styleable name="customturntableview">
  <!-- name为属性的名字，可以随意起，只要符合规则看得懂 -->
  <!-- format为属性内容的类型 -->
  <attr name="text" format="string"></attr>
 </declare-styleable>
</resources>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网，关注移动技术网公众号的更多精彩内容。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网