Android自定义View实现左右滑动选择出生年份

概述自定义view的第三篇，模仿的是微博运动界面的个人出生日期设置view，先看看我的效果图：

自定义view的第三篇，模仿的是微博运动界面的个人出生日期设置vIEw，先看看我的效果图：

支持设置初始年份，左右滑动选择出生年份，对应的TextVIEw的值也会改变。这个动画效果弄了好久，感觉还是比较生硬，与微博那个还是有点区别。大家有改进的方案，欢迎一起交流。

自定义view四部曲，这里依旧是这个套路，看看怎么实现的。

1.自定义view的属性：
在res/values/ 下建立一个attrs.xml ， 在里面定义我们的属性以及声明我们的整个样式。

<?xml version="1.0" enCoding="utf-8"?><resources> //自定义属性名,定义公共属性 <attr name="TitleSize" format="dimension"></attr> <attr name="TitleText" format="string"></attr> <attr name="Titlecolor" format="color"></attr> <attr name="outCirclecolor" format="color"></attr> <attr name="inCirclecolor" format="color"></attr> <attr name="linecolor" format="color"></attr> <declare-styleable name="MyScrollVIEw">  <attr name="TitleSize"></attr>  <attr name="Titlecolor"></attr>  <attr name="linecolor"></attr> </declare-styleable></resources>

依次定义了字体大小，字体颜色，线的颜色3个属性，format是值该属性的取值类型。
然后就是在布局文件中申明我们的自定义view：

 <TextVIEw  androID:ID="@+ID/year_txt"  androID:layout_wIDth="wrap_content"  androID:layout_height="wrap_content"  androID:layout_margin="30dp"  androID:text="出生年份 (年)"  androID:textSize="20dp" /> <com.example.tangyangkai.myvIEw.MyScrollVIEw  androID:ID="@+ID/scroll_vIEw"  androID:layout_wIDth="match_parent"  androID:layout_height="70dp"  myscroll:linecolor="@color/Font_text"  myscroll:Titlecolor="@color/strong"  myscroll:TitleSize="30dp"> </com.example.tangyangkai.myvIEw.MyScrollVIEw>

自定义view的属性我们可以自己进行设置，记得最后要引入我们的命名空间，
xmlns:app=”http://schemas.AndroID.com/apk/res-auto”

2.获取自定义view的属性：

 public MyScrollVIEw(Context context) {  this(context,null); } public MyScrollVIEw(Context context,AttributeSet attrs) {  this(context,attrs,0); } public MyScrollVIEw(final Context context,AttributeSet attrs,int defStyleAttr) {  super(context,defStyleAttr);  //获取我们自定义的样式属性  TypedArray array = context.gettheme().obtainStyledAttributes(attrs,R.styleable.MyScrollVIEw,defStyleAttr,0);  int n = array.getIndexCount();  for (int i = 0; i < n; i++) {   int attr = array.getIndex(i);   switch (attr) {    case R.styleable.MyScrollVIEw_linecolor:     // 默认颜色设置为黑色     linecolor = array.getcolor(attr,color.BLACK);     break;    case R.styleable.MyScrollVIEw_Titlecolor:     textcolor = array.getcolor(attr,color.BLACK);     break;    case R.styleable.MyScrollVIEw_TitleSize:     // 默认设置为16sp，TypeValue也可以把sp转化为px     textSize = array.getDimensionPixelSize(attr,(int) TypedValue.applyDimension(       TypedValue.COMPLEX_UNIT_SP,16,getResources().getdisplayMetrics()));     break;   }  }  array.recycle();  init(); } private voID init() {  //初始化  mPaint = new Paint();  mPaint.setAntiAlias(true);  mBound = new Rect();  mTxtBound = new Rect();  bigTxtSize = textSize;  onesize = textSize - 15;  thirdSize = textSize - 15; }

自定义view一般需要实现一下三个构造方法，这三个构造方法是一层调用一层的，属于递进关系。因此，我们只需要在最后一个构造方法中来获得VIEw的属性以及进行一些必要的初始化 *** 作。尽量不要在onDraw的过程中去实例化对象，因为这是一个频繁重复执行的过程，new是需要分配内存空间的，如果在一个频繁重复的过程中去大量地new对象会造成内存浪费的情况。

3.重写onMesure方法确定vIEw大小：

上一篇自定义view的文章介绍的很详细，这里就不重复了，重点放在onDraw方法里面：
Android自定义View仿微博运动积分动画效果

4.重写onDraw方法进行绘画：

之前说过对于比较复杂的自定义view，重写onDraw方法之前，首先在草稿本上将大致的样子画出来，坐标，起始点都可以简单标注一下。这个方法很实用，思路很清晰。

A点的位置就是绘制数字的初始位置，B点的位置就是绘制竖线的起始位置。确定好这两个初始位置，我们只要写一个循环，找到规律，依次绘制出后面的线与字即可。因为涉及左右滑动的事件处理，所以需要AndroID事件分发的知识来进行处理。

 @OverrIDe public boolean dispatchtouchEvent(MotionEvent ev) {  int action = ev.getAction();  int x = (int) ev.getX();  int y = (int) ev.getY();  switch (action) {   case MotionEvent.ACTION_DOWN:    xDown = x;    yDown = y;    break;   case MotionEvent.ACTION_MOVE:    xMove = x;    yMove = y;    dx = xMove - xDown;    int dy = yMove - yDown;    //如果是从左向右滑动    if (xMove > xDown && Math.abs(dx) > mtouchSlop * 2 && Math.abs(dy) < mtouchSlop) {     state = 1;    }    //如果是从右向左滑动    if (xMove < xDown && Math.abs(dx) > mtouchSlop * 2 && Math.abs(dy) < mtouchSlop) {     state = 2;    }    break;   case MotionEvent.ACTION_UP:    break;  }  return super.dispatchtouchEvent(ev); }

重写VIEw的dispatchtouchEvent方法来区别左右滑动，mtouchSlop是AndroID默认的滑动最小距离，如果水平方向滑动的距离大于竖直方向滑动的距离，就判断为水平滑动。这里为了不让滑动那么明显，我让水平滑动的距离大于默认距离的两倍才判定左右滑动。state是记录滑动的状态。

 

 @OverrIDe public boolean ontouchEvent(MotionEvent ev) {  int action = ev.getAction();  switch (action) {   case MotionEvent.ACTION_DOWN:    break;   case MotionEvent.ACTION_MOVE:    if (state == 1 && bigTxtSize - onesize > -15) {     bigTxtSize = bigTxtSize - 1;     onesize = onesize + 1;     postInvalIDate();    }    if (state == 2 && bigTxtSize - thirdSize > -15) {     bigTxtSize = bigTxtSize - 1;     thirdSize = thirdSize + 1;     postInvalIDate();    }    break;   case MotionEvent.ACTION_UP:    if (state == 1) {     size = size - 1;     bigTxtSize = textSize;     onesize = textSize - 15;     postInvalIDate();     Listener.OnScroll(size);     state = 0;    }    if (state == 2) {     size = size + 1;     bigTxtSize = textSize;     thirdSize = textSize - 15;     postInvalIDate();     Listener.OnScroll(size);     state = 0;    }    break;  }  return true; }

重写VIEw的ontouchEvent方法来处理VIEw的点击事件。
(1)演示动态图中，左右滑动的过程中，中间数字会从大变小，左右的数字会从小变大，bigTxtSize代表中间的数字大小，onesize代表从左到右第二个数字的大小，thirdSize代表从左到右第四个数字的大小。在滑动过程中再使用postInvalIDate()方法来一直调用onDraw方法来重新进行绘制，达到数字大小变化的效果。
(2)滑动结束以后进行判断，如果是从左向右滑动，就会将数字减一；如果是从右向左滑动，就会将数字加一。最后将数字大小，滑动状态恢复到默认值。
(3)最后一定要返回true，表示消费当前滑动事件，不然滑动没反应

滑动的 *** 作已经全部处理好，接下来就是绘制：

 @OverrIDe protected voID onDraw(Canvas canvas) {  txtSize = size - 2;  bigText = String.valueOf(size);  smallText = String.valueOf(txtSize);  mPaint.setcolor(linecolor);  canvas.drawline(0,getWIDth(),mPaint);  canvas.drawline(0,getHeight(),mPaint);  lineX = getWIDth() / 10;  for (int i = 0; i < 5; i++) {   if (i == 2) {    mPaint.setTextSize(bigTxtSize);    if (bigTxtSize == textSize - 15) {     mPaint.setcolor(linecolor);     canvas.drawline(lineX,lineX,getHeight() / 5,mPaint);    } else {     mPaint.setcolor(textcolor);     canvas.drawline(lineX,getHeight() / 3,mPaint);    }    mPaint.getTextBounds(bigText,bigText.length(),mBound);    canvas.drawText(bigText,lineX - mBound.wIDth() / 2,getHeight() / 2 + mBound.height() * 3 / 4,mPaint);   } else if (i == 0 || i == 4) {    mPaint.setcolor(linecolor);    mPaint.setTextSize(textSize - 15);    mPaint.getTextBounds(smallText,smallText.length(),mTxtBound);    canvas.drawline(lineX,mPaint);    canvas.drawText(String.valueOf(txtSize),lineX - mTxtBound.wIDth() / 2,getHeight() / 2 + mTxtBound.height() * 3 / 4,mPaint);   } else if (i == 1) {    mPaint.setTextSize(onesize);    if (onesize == textSize) {     mPaint.setcolor(textcolor);     canvas.drawline(lineX,mPaint);    } else {     mPaint.setcolor(linecolor);     canvas.drawline(lineX,mPaint);    }    mPaint.getTextBounds(smallText,mTxtBound);    canvas.drawText(String.valueOf(txtSize),mPaint);   } else {    mPaint.setTextSize(thirdSize);    if (thirdSize == textSize) {     mPaint.setcolor(textcolor);     canvas.drawline(lineX,mPaint);    } else {     mPaint.setcolor(linecolor);     canvas.drawline(lineX,mPaint);   }   txtSize++;   lineX += getWIDth() / 5;  } }

这里其实就是得到滑动 *** 作的数字尺寸大小，然后进行绘制，最后将数字每次加一，lineX是B点的初始位置，每次加上宽度的五分之一。

5.得到当前的设置值
可以看到VIEw上面的TextVIEw也会跟着下面设置的值改变，所以这里我们需要单独处理一下。接口回调，简单暴力的方式。

在ontouchEvent的case MotionEvent.ACTION_UP中，得到最后设置的值

  Listener.OnScroll(size);

然后就是对应的Activity了：

public class SecondActivity extends AppCompatActivity implements MyScrollVIEw.OnScrollListener { private MyScrollVIEw scrollVIEw; private TextVIEw txt; @OverrIDe protected voID onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.activity_second);  initvIEw(); } private voID initvIEw() {  scrollVIEw = (MyScrollVIEw) findVIEwByID(R.ID.scroll_vIEw);  scrollVIEw.setSize(1992);  scrollVIEw.setListener(this);  txt = (TextVIEw) findVIEwByID(R.ID.year_txt);  txt.setText("出生年份" + scrollVIEw.getSize() + " (年)"); } @OverrIDe public voID OnScroll(int size) {  txt.setText("出生年份" + size + " (年)"); }}

实现接口的方法，进行初始化，设置初始值，然后就是在接口的方法更新数据即可。

自定义view的第一篇：Android自定义View实现BMI指数条

自定义view的第二篇：Android自定义View仿微博运动积分动画效果

OK，下一篇自定义view再见。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android自定义View实现左右滑动选择出生年份全部内容，希望文章能够帮你解决Android自定义View实现左右滑动选择出生年份所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。