看到帶下劃線的Edittext猖凛，估計大家會嗤之以鼻赂蠢，Edittext本就自帶下劃線，但我要實現(xiàn)的是下劃線是有間隔的辨泳。我們先看看效果虱岂，如果覺得有值得學習的地方再往下看玖院，省得浪費時間。
下劃線EdittextView.jpg
相信各位看官看了效果第岖，應該不會覺得那么簡單了吧难菌，但其實也不難。我們可以通過繼承Edittext自定義View來實現(xiàn)蔑滓。為啥非得繼承Edittext呢郊酒？原因很簡單，系統(tǒng)提供的Edittext可以獲取鍵盤的輸入键袱，省去了我們不少麻煩事燎窘。開始我也是想通過繼承View來實現(xiàn)的，顯得更高大上蹄咖，有逼可裝褐健。但在適配過程中發(fā)現(xiàn)，國內有的手機廠商的手機我們是監(jiān)聽不到用戶鍵盤點擊事件的比藻，除了刪除等一些公用的（估計是為了用戶信息安全考慮），因此也就放棄了這種實現(xiàn)方式倘屹。啰嗦了半天银亲，現(xiàn)在我們正式進入正題（下面是實現(xiàn)核心代碼）：
private void init(AttributeSet attrs) {
density = getContext().getResources().getDisplayMetrics().density;
initDefaultAttributes();
initCustomAttributes(attrs);
initDataStructures();
initPaint();
}
private void initDataStructures() {
underlines = new Underline[underlineAmount];
}
private void initPaint() {
underlinePaint = new Paint();
underlinePaint.setColor(underlineColor);
underlinePaint.setStrokeWidth(underlineStrokeWidth);
underlinePaint.setStyle(Paint.Style.STROKE);
textPaint = new Paint();
textPaint.setTextSize(textSize);
textPaint.setColor(textColor);
textPaint.setAntiAlias(true);
textPaint.setTextAlign(Paint.Align.CENTER);
backgroundPaint = new Paint();
backgroundPaint.setColor(backgroundColor);
}
@Override
protected void onSelectionChanged(int selStart, int selEnd) {
super.onSelectionChanged(selStart, selEnd);
if (selStart == selEnd){
//使光標一直處于文末
setSelection(getText().length());
}
}
//設置下劃線數(shù)量
public void setCodes(int codes) {
underlineAmount = codes;
initDataStructures();
}
private void initCustomAttributes(AttributeSet attrs) {
TypedArray attributes = getContext().obtainStyledAttributes(attrs, R.styleable.EditTextView);
try {
underlineColor = attributes.getColor(R.styleable.EditTextView_underline_color, underlineColor);
underlineAmount = attributes.getInt(R.styleable.EditTextView_codes, underlineAmount);
textColor = attributes.getInt(R.styleable.EditTextView_text_color, textColor);
textSize = attributes.getDimension(R.styleable.EditTextView_text_size, textSize);
backgroundColor = attributes.getColor(R.styleable.EditTextView_background_color, backgroundColor);
} finally {
attributes.recycle();
}
}
private void initDefaultAttributes() {
underlineStrokeWidth = 2 * density;
underlineWidth = 35 * density;
underlineReduction = 5 * density;
textSize = 15 * density;
textMarginBottom = 15 * density;
underlineColor = Color.parseColor("#cccccc");
textColor = Color.parseColor("#000000");
viewHeight = 50 * density;
underlineAmount = DEFAULT_CODES;
backgroundColor = Color.parseColor("#ffffff");
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged((int) ((underlineWidth + underlineReduction) * underlineAmount - underlineReduction), (int) viewHeight, oldw, oldh);
height = h;
width = w;
initRect();
initUnderline();
}
private void initRect() {
rectBackground = new RectF(0, 0, width, height);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension((int) ((underlineWidth + underlineReduction) * underlineAmount - underlineReduction), (int) viewHeight);
}
private void initUnderline() {
for (int i = 0; i < underlineAmount; i++) {
underlines[i] = createPath(i, underlineWidth);
}
}
private Underline createPath(int position, float sectionWidth) {
float fromX = (sectionWidth + underlineReduction) * (float) position;
return new Underline(fromX, height, fromX + sectionWidth, height);
}
@Override
protected void onDraw(Canvas canvas) {
//繪制白色背景將原有edittext遮住
canvas.drawRect(rectBackground, backgroundPaint);
for (int i = 0; i < underlines.length; i++) {
Underline sectionpath = underlines[i];
float fromX = sectionpath.getFromX();
float fromY = sectionpath.getFromY();
float toX = sectionpath.getToX();
float toY = sectionpath.getToY();
drawSection(fromX, fromY, toX, toY, canvas);
}
for (int i = 0; i < textLength; i++) {
drawCharacter(underlines[i].getFromX(), underlines[i].getToX(), getText().toString().charAt(i), canvas);
}
}
//繪制下劃線
private void drawSection(float fromX, float fromY, float toX, float toY, Canvas canvas) {
Paint paint = underlinePaint;
canvas.drawLine(fromX, fromY, toX, toY, paint);
}
//繪制文字
private void drawCharacter(float fromX, float toX, Character character, Canvas canvas) {
float actualWidth = toX - fromX;
float centerWidth = actualWidth / 2;
float centerX = fromX + centerWidth;
canvas.drawText(String.valueOf(character), centerX, height - textMarginBottom, textPaint);
}
@Override
protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
super.onTextChanged(text, start, lengthBefore, lengthAfter);
this.textLength = text.toString().length();
Editable text1 = getText();
if (text1.length() > underlineAmount){
setText(text1.subSequence(0, underlineAmount));
this.textLength = underlineAmount;
}
}
/**
* 下劃線
*/
class Underline {
float fromX;
float fromY;
float toX;
float toY;
public Underline() {
}
public Underline(float fromX, float fromY, float toX, float toY) {
this.fromX = fromX;
this.fromY = fromY;
this.toX = toX;
this.toY = toY;
}
public void from(float x, float y) {
this.fromX = x;
this.fromY = y;
}
public void to(float x, float y) {
this.toX = x;
this.toY = y;
}
public float getFromX() {
return fromX;
}
public void setFromX(float fromX) {
this.fromX = fromX;
}
public float getFromY() {
return fromY;
}
public void setFromY(float fromY) {
this.fromY = fromY;
}
public float getToX() {
return toX;
}
public void setToX(float toX) {
this.toX = toX;
}
public float getToY() {
return toY;
}
public void setToY(float toY) {
this.toY = toY;
}
}
<declare-styleable name="EditTextView">
<!--下劃線顏色-->
<attr name="underline_color" format="color" />
<!--文字顏色-->
<attr name="text_color" format="color" />
<!--下劃線數(shù)量-->
<attr name="codes" format="integer" />
<!--字體大小-->
<attr name="text_size" format="dimension"/>
<!--背景顏色-->
<attr name="background_color" format="color"/>
</declare-styleable>
沒錯就是這么簡單，一個能夠控制輸入數(shù)量纽匙、下劃線顏色可設置且攜帶所有Edittext屬性的自定義View就這么實現(xiàn)了务蝠。若要查看源碼可訪問我的倉庫。歡迎Star烛缔、Fork或者有更好的實現(xiàn)方式的建議可在下面留言馏段，謝謝。
