textview、edittext下劃線邊框,以及圓弧邊框的新增
阿新 • • 發佈:2019-01-29
學習應該是一件被嚴謹對待的事情,近期正在做一個專案,如今算是告一段落,打算慢慢地將專案中用到的瑣碎的東西貼出來留作記憶以及與大家分享,好了不多廢話,上效果以及程式碼:
效果如圖所示:
所需要的是各種形狀的邊框以及下劃線,程式碼如下:
在工程中新建drawable資料夾,建立xml檔案,選擇shape:接下來就是編寫不同的效果:如下所示:
一、textview圓角邊框:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圓角邊框 --> <!-- 實心 背景色--> <solid android:color="@android:color/transparent" /> <!-- 邊框 顏色--> <stroke android:width="0.5dp" android:color="@android:color/black" /> <!-- 邊距 --> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> <corners android:bottomLeftRadius="10dp" android:bottomRightRadius="10dp" android:topLeftRadius="10dp" android:topRightRadius="10dp" /> </shape>
二、圓形邊框:
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" android:useLevel="false" > <solid android:color="@color/red" /> <padding android:bottom="20dp" android:left="10dp" android:right="10dp" android:top="20dp" /> <!-- 背景色 --> <solid android:color="@color/transparents" /> <!-- 邊框顏色 --> <stroke android:width="1dp" android:color="@color/red" /> <size android:height="15dp" android:width="15dp" /> </shape>
三、左右兩側弧形邊框
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="@color/colorAccent" /> <size android:height="30dp" /> <corners android:bottomLeftRadius="20dp" android:bottomRightRadius="20dp" android:topLeftRadius="20dp" android:topRightRadius="20dp" /> <!-- 邊距 --> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> </shape>
以上drawable資料夾下的檔案,可以直接在xml佈局中引用,使用background即可完成
四、edittext下劃線邊框:
新建一個MyEditText類繼承edittext,重寫MyEditText、onDraw方法
package com.example.shapebuttondemo.utils;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.EditText;
/**
* 自定義EditText控制元件,新增白色下劃線
* */
public class MyEditText extends EditText {
private Paint mPaint;
public MyEditText(Context context, AttributeSet attrs) {
super(context, attrs);
mPaint = new Paint();
mPaint.setStyle(Paint.Style.STROKE);
// 你可以根據自己的具體需要在此處對畫筆做更多個性化設定
mPaint.setColor(Color.BLACK);
}
@Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
// 畫底線
canvas.drawLine(0, this.getHeight() - 1, this.getWidth() - 1, this.getHeight() - 1, mPaint);
}
}
五、xml佈局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.shapebuttondemo.activity.MainActivity"
android:background="@color/background">
<!-- 圓角邊框 -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:background="@drawable/shape_textview"
android:text="圓角邊框" />
<!-- 橢圓邊框 -->
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:background="@drawable/shape_circle"
android:text="紅色按鈕"
android:textColor="@color/red" />
<!-- 左右兩邊圓形邊框 -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_text"
android:layout_margin="15dp"
android:text="左右兩邊圓形邊框" />
<com.example.shapebuttondemo.utils.MyEditText
android:layout_width="160dp"
android:layout_height="wrap_content"
android:background="@color/transparents"
android:layout_margin="15dp"
android:hint="EditText下劃線"
android:textColorHint="@color/red"
android:textSize="12sp"
/>
<com.example.shapebuttondemo.utils.TextViewUtils
android:layout_width="160dp"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:hint="TextView下劃線"
android:textColorHint="@color/red"
android:textSize="12sp"
/>
</LinearLayout>
按照以上步驟,即可獲得截圖上的邊框效果。