android UI繪制加減號按鈕
更新時間：2021年06月29日 17:02:57 作者：夜輝疾風(fēng)
這篇文章主要為大家詳細(xì)介紹了android UI繪制加減號按鈕，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了android UI繪制加減號按鈕的具體代碼，供大家參考，具體內(nèi)容如下
在項目中我們常常會用到這么一個view。
這時候我們會選擇使用兩個圖片來相互切換。其實，只要會基本的2D繪圖這樣簡單的圖片自己繪制出來不在話下。
先給出我做出來的效果圖：
接下來，我將給出加號減號繪制的代碼以供大家參考：
以下是關(guān)鍵代碼
/**
* +號
*/
public class AddView extends View {
protected Paint paint;
protected int HstartX, HstartY, HendX, HendY;//水平的線
protected int SstartX, SstartY, SsendX, SsendY;//垂直的線
protected int paintWidth = 2;//初始化加號的粗細(xì)為10
protected int paintColor = Color.BLACK;//畫筆顏色黑色
protected int padding = 3;//默認(rèn)3的padding
public int getPadding() {
return padding;
}
//讓外界調(diào)用，修改padding的大小
public void setPadding(int padding) {
SsendY = HendX = width - padding;
SstartY = HstartX = padding;
}
//讓外界調(diào)用，修改加號顏色
public void setPaintColor(int paintColor) {
paint.setColor(paintColor);
}
//讓外界調(diào)用，修改加號粗細(xì)
public void setPaintWidth(int paintWidth) {
paint.setStrokeWidth(paintWidth);
}
public AddView(Context context, AttributeSet attrs) {
super(context, attrs);
initView();
}
private void initView() {
paint = new Paint();
paint.setColor(paintColor);
paint.setStrokeWidth(paintWidth);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int widthSize = MeasureSpec.getSize(widthMeasureSpec);
int widthMode = MeasureSpec.getMode(widthMeasureSpec);
int width;
if (widthMode == MeasureSpec.EXACTLY) {
// MeasureSpec.EXACTLY表示該view設(shè)置的確切的數(shù)值
width = widthSize;
} else {
width = 60;//默認(rèn)值
}
SstartX = SsendX = HstartY = HendY = width / 2;
SsendY = HendX = width - getPadding();
SstartY = HstartX = getPadding();
//這樣做是因為加號寬高是相等的，手動設(shè)置寬高
setMeasuredDimension(width, width);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//水平的橫線
canvas.drawLine(HstartX, HstartY, HendX, HendY, paint);
//垂直的橫線
canvas.drawLine(SstartX, SstartY, SsendX, SsendY, paint);
}
}
/**
* -號
*/
public class RemoveView extends AddView {
public RemoveView(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
protected void onDraw(Canvas canvas) {
//水平的橫線，減號不需要垂直的橫線了
canvas.drawLine(HstartX, HstartY, HendX, HendY, paint);
}
}
其中主要的是計算橫線和豎線的位置。獲得view的寬度后，將view設(shè)置成正方形，然后就如如所示：
這樣，最主要的加減號做完了，其他的都是小意思了。
我把主要的xml文件貼出來：
主視圖：layout_add_remove.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:padding="2dp"
android:background="@drawable/bg_add_remove_view"
android:orientation="horizontal">
<com.android.ui.TextView.AddView
android:id="@+id/add_view"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:background="@drawable/bg_add_view" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="3dp"
android:background="@null"
android:inputType="number"
android:text="0" />
<com.android.ui.TextView.RemoveView
android:id="@+id/remove_view"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:background="@drawable/bg_remove_view" />
</LinearLayout>
主視圖背景：bg_add_remove_view.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- 設(shè)置圓角矩形 -->
<corners android:radius="5dp" />
<!-- 文本框里面的顏色 -->
<solid android:color="@android:color/white" />
<!-- 邊框的顏色 -->
<stroke
android:width="0.5dp"
android:color="@android:color/darker_gray" />
</shape>
加號背景：bg_add_view.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/bg_add_true" android:state_pressed="true" /> <item android:drawable="@drawable/bg_add_false" android:state_pressed="false" /> </selector>
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 邊框的顏色 -->
<item>
<shape>
<solid android:color="@android:color/darker_gray" />
</shape>
</item>
<item
android:bottom="0dp"
android:left="0dp"
android:right="0.5dp"
android:top="0dp">
<!--設(shè)置只有底部有邊框-->
<shape>
<!-- 主體背景顏色值 -->
<solid android:color="@android:color/darker_gray" />
</shape>
</item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 邊框的顏色 -->
<item>
<shape>
<solid android:color="@android:color/darker_gray" />
</shape>
</item>
<item
android:bottom="0dp"
android:left="0dp"
android:right="0.5dp"
android:top="0dp">
<!--設(shè)置只有底部有邊框-->
<shape>
<!-- 主體背景顏色值 -->
<solid android:color="@android:color/white" />
</shape>
</item>
</layer-list>
減號的背景色配置和加號一樣，只不過豎線的位置不同而已：
<item
android:bottom="0dp"
android:left="0.5dp"
android:right="0dp"
android:top="0dp">
我們可以在完全不用圖片的情況下完成這個ui。
當(dāng)然，還有很多可以優(yōu)化的地方。比如設(shè)置padding，修改加減號顏色，就該布局大小，這些都是可以通過代碼來實現(xiàn)的。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了Android仿QQ個人標(biāo)簽添加與刪除功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-12-12
這篇文章主要介紹了詳解Android代碼混淆實戰(zhàn)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
這篇文章主要為大家詳細(xì)介紹了Android中Dialog自定義上下文花式菜單，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要給大家介紹了關(guān)于利用Android實現(xiàn)360市場下載按鈕效果的方法，文中給出了詳細(xì)的示例代碼供大家參考學(xué)習(xí)，并在文末給出了源碼供大家下載，需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2017-05-05
Android 讓自定義TextView的drawableLeft與文本一起居中
本文主要介紹Android 自定義控件TextView顯示居中問題,在開發(fā)過程中經(jīng)常會遇到控件的重寫,這里主要介紹TextView的drawableLeft與文本一起居中的問題2016-07-07
這篇文章主要為大家詳細(xì)介紹了Android帶進(jìn)度的圓形進(jìn)度條，實現(xiàn)自定義View，自定義屬性，感興趣的小伙伴們可以參考一下2016-02-02
這篇文章主要為大家詳細(xì)介紹了Android ImageSelector微信圖片選擇器，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
Android實現(xiàn)自動變換大小的ViewPager
ViewPager使用適配器類將數(shù)據(jù)和view的處理分離，ViewPager的適配器叫PagerAdapter，這是一個抽象類，不能實例化，所以它有兩個子類：FragmentPagerAdapter 和 FragmentStatePagerAdapter，這兩個都是處理頁面為Fragment的情況2022-11-11
這篇文章主要為大家詳細(xì)介紹了Flutter質(zhì)感設(shè)計之列表項，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-08-08
Android 拍照并對照片進(jìn)行裁剪和壓縮實例詳解
這篇文章主要介紹了Android 拍照并對照片進(jìn)行裁剪和壓縮實例詳解的相關(guān)資料,這里提供實例代碼，需要的朋友可以參考下2017-07-07