在畢設(shè)項(xiàng)目中多處用到自定義控件,一直打算總結(jié)一下自定義控件的實(shí)現(xiàn)方式,今天就來總結(jié)一下吧。在此之前學(xué)習(xí)了郭霖大神博客上面關(guān)于自定義View的幾篇博文,感覺受益良多,本文中就參考了其中的一些內(nèi)容。
湘東網(wǎng)站建設(shè)公司成都創(chuàng)新互聯(lián),湘東網(wǎng)站設(shè)計(jì)制作,有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為湘東上1000+提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\外貿(mào)網(wǎng)站建設(shè)要多少錢,請找那個(gè)售后服務(wù)好的湘東做網(wǎng)站的公司定做!
總結(jié)來說,自定義控件的實(shí)現(xiàn)有三種方式,分別是:組合控件、自繪控件和繼承控件。下面將分別對這三種方式進(jìn)行介紹。
(一)組合控件
組合控件,顧名思義就是將一些小的控件組合起來形成一個(gè)新的控件,這些小的控件多是系統(tǒng)自帶的控件。比如很多應(yīng)用中普遍使用的標(biāo)題欄控件,其實(shí)用的就是組合控件,那么下面將通過實(shí)現(xiàn)一個(gè)簡單的標(biāo)題欄自定義控件來說說組合控件的用法。
1、新建一個(gè)Android項(xiàng)目,創(chuàng)建自定義標(biāo)題欄的布局文件title_bar.xml:
<?xml version="1.0" encoding="utf-8"?>
可見這個(gè)標(biāo)題欄控件還是比較簡單的,其中在左邊有一個(gè)返回按鈕,背景是一張事先準(zhǔn)備好的圖片back1_64.png,標(biāo)題欄中間是標(biāo)題文字。
2、創(chuàng)建一個(gè)類TitleView,繼承自RelativeLayout:
public class TitleView extends RelativeLayout { // 返回按鈕控件 private Button mLeftBtn; // 標(biāo)題Tv private TextView mTitleTv; public TitleView(Context context, AttributeSet attrs) { super(context, attrs); // 加載布局 LayoutInflater.from(context).inflate(R.layout.title_bar, this); // 獲取控件 mLeftBtn = (Button) findViewById(R.id.left_btn); mTitleTv = (TextView) findViewById(R.id.title_tv); } // 為左側(cè)返回按鈕添加自定義點(diǎn)擊事件 public void setLeftButtonListener(OnClickListener listener) { mLeftBtn.setOnClickListener(listener); } // 設(shè)置標(biāo)題的方法 public void setTitleText(String title) { mTitleTv.setText(title); } }
在TitleView中主要是為自定義的標(biāo)題欄加載了布局,為返回按鈕添加事件監(jiān)聽方法,并提供了設(shè)置標(biāo)題文本的方法。
3、在activity_main.xml中引入自定義的標(biāo)題欄:
4、在MainActivity中獲取自定義的標(biāo)題欄,并且為返回按鈕添加自定義點(diǎn)擊事件:
private TitleView mTitleBar; mTitleBar = (TitleView) findViewById(R.id.title_bar); mTitleBar.setLeftButtonListener(new OnClickListener() { @Override public void onClick(View v) { Toast.makeText(MainActivity.this, "點(diǎn)擊了返回按鈕", Toast.LENGTH_SHORT) .show(); finish(); } });
5、運(yùn)行效果如下:
這樣就用組合的方式實(shí)現(xiàn)了自定義標(biāo)題欄,其實(shí)經(jīng)過更多的組合還可以創(chuàng)建出功能更為復(fù)雜的自定義控件,比如自定義搜索欄等。
(二)自繪控件
自繪控件的內(nèi)容都是自己繪制出來的,在View的onDraw方法中完成繪制。下面就實(shí)現(xiàn)一個(gè)簡單的計(jì)數(shù)器,每點(diǎn)擊它一次,計(jì)數(shù)值就加1并顯示出來。
1、創(chuàng)建CounterView類,繼承自View,實(shí)現(xiàn)OnClickListener接口:
public class CounterView extends View implements OnClickListener { // 定義畫筆 private Paint mPaint; // 用于獲取文字的寬和高 private Rect mBounds; // 計(jì)數(shù)值,每點(diǎn)擊一次本控件,其值增加1 private int mCount; public CounterView(Context context, AttributeSet attrs) { super(context, attrs); // 初始化畫筆、Rect mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mBounds = new Rect(); // 本控件的點(diǎn)擊事件 setOnClickListener(this); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); mPaint.setColor(Color.BLUE); // 繪制一個(gè)填充色為藍(lán)色的矩形 canvas.drawRect(0, 0, getWidth(), getHeight(), mPaint); mPaint.setColor(Color.YELLOW); mPaint.setTextSize(50); String text = String.valueOf(mCount); // 獲取文字的寬和高 mPaint.getTextBounds(text, 0, text.length(), mBounds); float textWidth = mBounds.width(); float textHeight = mBounds.height(); // 繪制字符串 canvas.drawText(text, getWidth() / 2 - textWidth / 2, getHeight() / 2 + textHeight / 2, mPaint); } @Override public void onClick(View v) { mCount ++; // 重繪 invalidate(); } }
2、在activity_main.xml中引入該自定義布局:
3、運(yùn)行效果如下:
(三)繼承控件
就是繼承已有的控件,創(chuàng)建新控件,保留繼承的父控件的特性,并且還可以引入新特性。下面就以支持橫向滑動(dòng)刪除列表項(xiàng)的自定義ListView的實(shí)現(xiàn)來介紹。
1、創(chuàng)建刪除按鈕布局delete_btn.xml,這個(gè)布局是在橫向滑動(dòng)列表項(xiàng)后顯示的:
<?xml version="1.0" encoding="utf-8"?>
2、創(chuàng)建CustomListView類,繼承自ListView,并實(shí)現(xiàn)了OnTouchListener和OnGestureListener接口:
public class CustomListView extends ListView implements OnTouchListener, OnGestureListener { // 手勢動(dòng)作探測器 private GestureDetector mGestureDetector; // 刪除事件監(jiān)聽器 public interface OnDeleteListener { void onDelete(int index); } private OnDeleteListener mOnDeleteListener; // 刪除按鈕 private View mDeleteBtn; // 列表項(xiàng)布局 private ViewGroup mItemLayout; // 選擇的列表項(xiàng) private int mSelectedItem; // 當(dāng)前刪除按鈕是否顯示出來了 private boolean isDeleteShown; public CustomListView(Context context, AttributeSet attrs) { super(context, attrs); // 創(chuàng)建手勢監(jiān)聽器對象 mGestureDetector = new GestureDetector(getContext(), this); // 監(jiān)聽onTouch事件 setOnTouchListener(this); } // 設(shè)置刪除監(jiān)聽事件 public void setOnDeleteListener(OnDeleteListener listener) { mOnDeleteListener = listener; } // 觸摸監(jiān)聽事件 @Override public boolean onTouch(View v, MotionEvent event) { if (isDeleteShown) { hideDelete(); return false; } else { return mGestureDetector.onTouchEvent(event); } } @Override public boolean onDown(MotionEvent e) { if (!isDeleteShown) { mSelectedItem = pointToPosition((int) e.getX(), (int) e.getY()); } return false; } @Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { // 如果當(dāng)前刪除按鈕沒有顯示出來,并且x方向滑動(dòng)的速度大于y方向的滑動(dòng)速度 if (!isDeleteShown && Math.abs(velocityX) > Math.abs(velocityY)) { mDeleteBtn = LayoutInflater.from(getContext()).inflate( R.layout.delete_btn, null); mDeleteBtn.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { mItemLayout.removeView(mDeleteBtn); mDeleteBtn = null; isDeleteShown = false; mOnDeleteListener.onDelete(mSelectedItem); } }); mItemLayout = (ViewGroup) getChildAt(mSelectedItem - getFirstVisiblePosition()); RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams( LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); params.addRule(RelativeLayout.ALIGN_PARENT_RIGHT); params.addRule(RelativeLayout.CENTER_VERTICAL); mItemLayout.addView(mDeleteBtn, params); isDeleteShown = true; } return false; } // 隱藏刪除按鈕 public void hideDelete() { mItemLayout.removeView(mDeleteBtn); mDeleteBtn = null; isDeleteShown = false; } public boolean isDeleteShown() { return isDeleteShown; } /** * 后面幾個(gè)方法本例中沒有用到 */ @Override public void onShowPress(MotionEvent e) { } @Override public boolean onSingleTapUp(MotionEvent e) { return false; } @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { return false; } @Override public void onLongPress(MotionEvent e) { } }
3、定義列表項(xiàng)布局custom_listview_item.xml,它的結(jié)構(gòu)很簡單,只包含了一個(gè)TextView:
<?xml version="1.0" encoding="utf-8"?>
4、定義適配器類CustomListViewAdapter,繼承自ArrayAdapter
public class CustomListViewAdapter extends ArrayAdapter{ public CustomListViewAdapter(Context context, int textViewResourceId, List objects) { super(context, textViewResourceId, objects); } @Override public View getView(int position, View convertView, ViewGroup parent) { View view; if (convertView == null) { view = LayoutInflater.from(getContext()).inflate( R.layout.custom_listview_item, null); } else { view = convertView; } TextView contentTv = (TextView) view.findViewById(R.id.content_tv); contentTv.setText(getItem(position)); return view; } }
5、在activity_main.xml中引入自定義的ListView:
6、在MainActivity中對列表做初始化、設(shè)置列表項(xiàng)刪除按鈕點(diǎn)擊事件等處理:
public class MainActivity extends Activity { // 自定義Lv private CustomListView mCustomLv; // 自定義適配器 private CustomListViewAdapter mAdapter; // 內(nèi)容列表 private ListcontentList = new ArrayList (); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); initContentList(); mCustomLv = (CustomListView) findViewById(R.id.custom_lv); mCustomLv.setOnDeleteListener(new OnDeleteListener() { @Override public void onDelete(int index) { contentList.remove(index); mAdapter.notifyDataSetChanged(); } }); mAdapter = new CustomListViewAdapter(this, 0, contentList); mCustomLv.setAdapter(mAdapter); } // 初始化內(nèi)容列表 private void initContentList() { for (int i = 0; i < 20; i++) { contentList.add("內(nèi)容項(xiàng)" + i); } } @Override public void onBackPressed() { if (mCustomLv.isDeleteShown()) { mCustomLv.hideDelete(); return; } super.onBackPressed(); } }
7、運(yùn)行效果如下:
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。