Android平臺(tái)已經(jīng)給我們提供了很多標(biāo)準(zhǔn)的組件，如：TextView、EditView、Button、ImageView、Menu等，還有許多布局控件，常見(jiàn)的有：AbsoluteLayout、LinerLayout、RelativeLayout、TableLayout等。但隨著人們對(duì)視覺(jué)的需求，基本組件已無(wú)法滿足人們求新求異的要求，于是我們常常會(huì)自定義組件，用來(lái)實(shí)現(xiàn)更美觀的UI界面。
實(shí)現(xiàn)自定義控件通常有兩種途徑，一種是繼承View類，重寫其中的重要方法，另一種是繼承ViewGroup類，通過(guò)重寫父類中的有些方法，達(dá)到重新繪制組件的目的。最近做了一個(gè)自定義表格控件的練習(xí)，從中總結(jié)到一些經(jīng)驗(yàn)。在這個(gè)練習(xí)中，我通過(guò)繼承ViewGroup類，重新繪制了用于呈現(xiàn)表格樣式的容器組件，首先來(lái)看一下父類ViewGroup。該類有三個(gè)構(gòu)造方法：ViewGroup(Context context)、ViewGroup(Context context,AttributeSet attrs)、ViewGroup(Context context,AttributeSet attrs,int defStyle)，我們自定義的繼承ViewGroup的類需要實(shí)現(xiàn)它的至少一個(gè)構(gòu)造方法。ViewGroup中有幾個(gè)方法非常重要，這幾個(gè)方法更好的幫助我們實(shí)現(xiàn)自己的組件的布局與繪制。
1、onLayout方法
該方法用于在容器中如何擺放子控件，如果不重寫該方法，子控件將無(wú)法在布局控件中得以展示，該方法有五個(gè)參數(shù)，用于設(shè)置子控件的上下左右四個(gè)邊框的位置，還有一個(gè)標(biāo)志位，這個(gè)方法也是子類必須實(shí)現(xiàn)的，因?yàn)樵摲椒ㄊ莻€(gè)抽象方法。
2、addView方法
該方法用于在容器組件中添加子控件
3、dispatchDraw方法
通過(guò)該方法，我們可以獲取canvas對(duì)象，該對(duì)象允許我們?cè)诮M件上畫任意我們想要的圖形，在這個(gè)表格控件中，我們可以在畫布上上表格的外邊框及表格線
4、getChildCount和getChildAt方法
這兩個(gè)方法用于獲取該容器控件中子控件的數(shù)目和位置，便于我們對(duì)子控件的排版和布局
5、onMeasure方法
這個(gè)方法是用來(lái)測(cè)量子控件大小的，它在onLayout方法之前被調(diào)用，測(cè)量了子控件的大小尺寸，然后可以繪制子控件在容器組件中的布局位置
下面直接給出代碼示例，僅供參考
首先是表格控件的類：
public class TableView extends ViewGroup{
private static final int STARTX = 0;// 起始X坐標(biāo)
private static final int STARTY = 0;// 起始Y坐標(biāo)
private static final int BORDER = 2;// 表格邊框?qū)挾?
private int mRow;// 行數(shù)
private int mCol;// 列數(shù)
public TableView(Context context, AttributeSet attrs) {
super(context, attrs);
this.mRow = 3;// 默認(rèn)行數(shù)為3
this.mCol = 3;// 默認(rèn)列數(shù)為3
// 添加子控件
this.addOtherView(context);
}
public TableView(Context context, int row,int col) {
super(context);
if(row>20 || col>20){
this.mRow = 20;// 大于20行時(shí)，設(shè)置行數(shù)為20行
this.mCol = 20;// 大于20列時(shí)，設(shè)置列數(shù)為20列
}else if(row==0 || col==0){
this.mRow = 3;
this.mCol = 3;
}
else{
this.mRow = row;
this.mCol = col;
}
// 添加子控件
this.addOtherView(context);
}
public void addOtherView(Context context){
int value = 1;
for(int i=1;i<=mRow;i++){
for(int j=1;j<=mCol;j++){
TextView view = new TextView(context);
view.setText(String.valueOf(value++));
view.setTextColor(Color.rgb(79, 129, 189));
view.setGravity(Gravity.CENTER);
if(i%2==0){
view.setBackgroundColor(Color.rgb(219, 238, 243));
}else{
view.setBackgroundColor(Color.rgb(235, 241, 221));
}
this.addView(view);
}
}
}
@Override
protected void dispatchDraw(Canvas canvas) {
Paint paint = new Paint();
paint.setStrokeWidth(BORDER);
paint.setColor(Color.rgb(79, 129, 189));
paint.setStyle(Style.STROKE);
// 繪制外部邊框
canvas.drawRect(STARTX, STARTY, getWidth()-STARTX, getHeight()-STARTY, paint);
// 畫列分割線
for(int i=1;i<mCol;i++){
canvas.drawLine((getWidth()/mCol)*i, STARTY, (getWidth()/mCol)*i, getHeight()-STARTY, paint);
}
// 畫行分割線
for(int j=1;j<mRow;j++){
canvas.drawLine(STARTX, (getHeight()/mRow)*j, getWidth()-STARTX, (getHeight()/mRow)*j, paint);
}
super.dispatchDraw(canvas);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
int x = STARTX+BORDER;
int y = STARTY+BORDER;
int i = 0;
int count = getChildCount();
for(int j=0; j<count; j++){
View child = getChildAt(j);
child.layout(x, y, x+getWidth()/mCol-BORDER*2, y+getHeight()/mRow-BORDER*2);
if(i >=(mCol-1)){
i = 0;
x = STARTX+BORDER;
y += getHeight()/mRow;
}else{
i++;
x += getWidth()/mCol;
}
}
}
public void setRow(int row){
this.mRow = row;
}
public void setCol(int col){
this.mCol = col;
}
}
然后我們?cè)贏ctivity中使用我們的控件：
public class MainActivity extends Activity implements OnClickListener{
private Button btn;
private EditText row;
private EditText col;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
btn = (Button)findViewById(R.id.button1);
row = (EditText)findViewById(R.id.editRow);
col = (EditText)findViewById(R.id.editCol);
row.setError("請(qǐng)輸入小于20的整數(shù)");
col.setError("請(qǐng)輸入小于20的整數(shù)");
btn.setOnClickListener(this);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public void onClick(View v) {
Intent intent = new Intent();
Bundle bun = new Bundle();
if("".equals(row.getText().toString())){
Toast.makeText(this, "行數(shù)不能為空", Toast.LENGTH_SHORT).show();
return;
}else if("".equals(col.getText().toString())){
Toast.makeText(this, "列數(shù)不能為空", Toast.LENGTH_SHORT).show();
return;
}else{
int rowNum = Integer.parseInt(row.getText().toString());
int colNum = Integer.parseInt(col.getText().toString());
bun.putInt("row", rowNum);
bun.putInt("col", colNum);
intent.setClass(MainActivity.this, TableActivity.class);
intent.putExtras(bun);
startActivity(intent);
}
}
}
public class TableActivity extends Activity{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent intent = this.getIntent();
Bundle bun = intent.getExtras();
int row = bun.getInt("row");
int col = bun.getInt("col");
TableView table = new TableView(this, row, col);
setContentView(table);
}
}
效果圖如下：
