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

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

8d5b78da58e9ebef23a6bdf01792ed01.gif

这是一个类似于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

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

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就行了。

android:paddingtop="20dp"

android:paddingleft="40dp"

android:paddingright="40dp"

android:paddingbottom="35dp"

android:layout_width="match_parent"

android:layout_height="70dp" />

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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值