Android自定义控件RatingBar调整字体大小

 更新时间:2020年04月18日 09:22:30   作者:rome753  
这篇文章主要为大家详细介绍了Android自定义控件RatingBar调整字体大小的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

项目需要,做一个可以调整字体大小的控件,能在滑动或点击时改变选中的位置,效果图如下:

这是一个类似于RatingBar的控件,然而配置RatingBar的样式难以实现这样的效果,如选中的图案和上面的文字对齐。因此,有必要写一个自定义View来实现。

思路如下:

  • 新建一个TextRatingBar继承View类
  • 在onDraw()方法中绘制元素:文字、横线、短竖线和圆形标记
  • 重写onMeasure()方法,控制整体大小和边界
  • 在onTouchEvent()方法中处理ACTION_DOWN和ACTION_MOVE事件,调用invalidate()方法引起View的重绘,以更新视图
  • 定义一个用户选中某个字体的回调接口,以通知外部处理,比如去设置字体大小。

TextRatingBar类代码如下:

package cc.rome753.demo.view;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;

/**
 * Created by rome753 on 2017/3/10
 */

public class TextRatingBar extends View{

 //paddingLeft
 private int mLeft;
 //paddingTop
 private int mTop;
 //当前rating
 private int mRating;
 //总raring数
 private int mCount;
 //rating文字
 private String[] texts = {"小","中","大","超大"};
 //相邻raring的距离
 private int mUnitSize;
 //bar到底部的距离
 private int mYOffset;
 //小竖条的一半长度
 private int mMarkSize;

 Paint paint = new Paint();

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

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

 public TextRatingBar(Context context, AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);
 mCount = 4;
 mRating = 0;
 mMarkSize = 3;
 }

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 super.onMeasure(widthMeasureSpec, heightMeasureSpec);
 Log.i("test", getMeasuredWidth() + " " + getMeasuredHeight());
 mLeft = (getPaddingLeft()+getPaddingRight())/2;
 mTop = getPaddingTop();
 int barWidth = getMeasuredWidth() - 2 * mLeft;
 mUnitSize = barWidth/(mCount - 1);
 mYOffset = getMeasuredHeight() - getPaddingBottom();
 }

 @Override
 protected void onDraw(Canvas canvas) {
 paint.setStrokeWidth(2);
 paint.setColor(Color.RED);
 canvas.drawLine(mLeft,mYOffset,mLeft+mRating*mUnitSize,mYOffset,paint);
 for(int i=0;i<mCount;i++){
  paint.setColor(Color.RED);
  canvas.drawLine(mLeft+i*mUnitSize,mYOffset-mMarkSize,mLeft+i*mUnitSize,mYOffset+mMarkSize,paint);
  paint.setColor(mRating == i ? Color.RED : Color.BLACK);
  paint.setTextSize(30);
  paint.setTextAlign(Paint.Align.CENTER);
  canvas.drawText(texts[i],mLeft+i*mUnitSize,mTop,paint);
 }
 paint.setColor(Color.GRAY);
 canvas.drawLine(mLeft+mRating*mUnitSize,mYOffset,mLeft+(mCount-1)*mUnitSize,mYOffset,paint);
 canvas.drawCircle(mLeft+mRating*mUnitSize,mYOffset,10,paint);

 }

 @Override
 public boolean onTouchEvent(MotionEvent event) {
 if(event.getAction() == MotionEvent.ACTION_DOWN || event.getAction() == MotionEvent.ACTION_MOVE){
  float x = event.getX();
  for(int i=0;i<mCount;i++){
  float distance = mLeft+i*mUnitSize - x;
  if(Math.abs(distance) < 100){
   setRating(i);
   if(onRatingListener != null){
   onRatingListener.onRating(mRating);
   }
   break;
  }
  }
 }
 return true;
 }

 public void setRating(int rating) {
 mRating = rating;
 invalidate();
 }

 private OnRatingListener onRatingListener;

 public void setOnRatingListener(OnRatingListener onRatingListener) {
 this.onRatingListener = onRatingListener;
 }

 interface OnRatingListener{
 void onRating(int rating);
 }
}

几个要点:

  • onDraw()中的绘制要注意周围的预留空间,防止最左边的字体只显示一半,或滑动条下面没有一点空白的预留空间,导致用户不好划。因此在计算每一个绘制坐标时额外加上这些。
  • 触摸事件是判断当前触摸点离哪个rating点最近,要加上左右临界值Math.abs(distance),用户点击或划动在distance范围内就算发生了onRating()事件。

没有用到自定义属性,使用时直接放到布局中,周围加上padding就行了。

 <cc.rome753.demo.view.TextRatingBar
 android:paddingTop="20dp"
 android:paddingLeft="40dp"
 android:paddingRight="40dp"
 android:paddingBottom="35dp"
 android:layout_width="match_parent"
 android:layout_height="70dp" />

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

相关文章

  • Android实现自动匹配关键字并且标红功能

    Android实现自动匹配关键字并且标红功能

    这篇文章主要为大家详细介绍了Android实现自动匹配关键字并且标红功能,单关键字和多关键字进行匹配,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05
  • Android深色模式适配适配过程详解

    Android深色模式适配适配过程详解

    这篇文章主要介绍了Android深色模式适配适配过程,深色模式其实就是我们经常讲到的夜间模式,与白天模式我们需要的屏幕高亮不同,晚上更加需要的是柔和的光,有助于减少手机对眼睛的伤害
    2023-04-04
  • Android百度地图应用开发基础知识

    Android百度地图应用开发基础知识

    这篇文章主要为大家详细介绍了Android百度地图应用开发基础知识,为开发百度地图应用做准备,感兴趣的小伙伴们可以参考一下
    2016-06-06
  • Android中View位置和触摸事件详解

    Android中View位置和触摸事件详解

    这篇文章主要给大家介绍了关于Android中View位置和触摸事件的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-08-08
  • Android工具栏顶出转场动画的实现方法实例

    Android工具栏顶出转场动画的实现方法实例

    这篇文章主要给大家介绍了关于Android工具栏顶出转场动画的实现方法,文中通过示例代码介绍的非常详细,对各位Android开发者们具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-09-09
  • 如何从UA分辨出Android设备类型

    如何从UA分辨出Android设备类型

    本文主要介绍如何从UA分辨出Android设备类型,这里整理了相关资料,来讲解分辨Android设备类型,有兴趣的小伙伴可以参考下
    2016-08-08
  • Android响应事件onClick方法的五种实现方式小结

    Android响应事件onClick方法的五种实现方式小结

    本篇文章主要介绍了Android响应onClick方法的五种实现方式小结,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-03-03
  • Android下拉刷新PtrFrameLayout的使用实例代码

    Android下拉刷新PtrFrameLayout的使用实例代码

    本篇文章主要介绍了Android下拉刷新PtrFrameLayout的使用实例代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • Android营造雪花和雨滴浪漫效果

    Android营造雪花和雨滴浪漫效果

    这篇文章主要为大家介绍了Android营造雪花和雨滴浪漫效果的相关资料,感兴趣的小伙伴们可以参考一下
    2016-01-01
  • Android手势ImageView三部曲 第一部

    Android手势ImageView三部曲 第一部

    这篇文章主要为大家详细介绍了Android手势ImageView三部曲的第一部,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-03-03

最新评论