Android platform has provided us with a number of standard components, such as: TextView, EditView, Button, ImageView, menu, and many other layout controls, common are: absolutelayout, Linerlayout, Relativelayout, Tablelayout and so on. But as people's need for vision, the basic components have been unable to meet the needs of people to seek novelty, so we often custom components, to achieve a more beautiful UI interface.
There are usually two ways to implement a custom control, one of which is to inherit the view class, override one of the important methods, and the other is to inherit the ViewGroup class by overriding some of the methods in the parent class to achieve the purpose of redrawing the component. Recently I've done a custom table control exercise to summarize some of the experience. In this exercise, I've redrawn the container component that is used to render the table style by inheriting the ViewGroup class, and first look at the parent class ViewGroup. There are three construction methods for this class: ViewGroup (Context context), ViewGroup (context Context,attributeset attrs), ViewGroup, AttributeSet attrs,int Defstyle), Our custom inherited ViewGroup class needs to implement at least one of its construction methods. Several methods in ViewGroup are very important, and these methods help us to achieve the layout and rendering of our own components better.
1, OnLayout method
This method is used to place the child control in the container, if the method is not overridden, the child control will not be able to be displayed in the layout control, which has five parameters that set the position of the child control's top and bottom four borders, as well as a flag bit, which the subclass must implement, because the method is an abstract method.
2, AddView method
This method is used to add child controls to the container component
3, Dispatchdraw method
In this way, we can get the canvas object, which allows us to draw any graphics we want on the component, and in this table control we can use the outer and form lines of the table on the canvas.
4, Getchildcount and Getchildat methods
These two methods are used to get the number and location of the neutron controls for the container control so that we can layout and lay out the child controls
5, Onmeasure method
This method is used to measure the size of the child control, which is invoked before the OnLayout method, measures the size of the child control, and then draws the child control's layout position in the container component
The code example is given below for reference only
First, the class of the Table control:
Copy Code code as follows:
public class TableView extends viewgroup{
private static final int startx = 0;//start x coordinate
private static final int starty = 0;//start y coordinate
private static final int BORDER = 2;//table Border Width
private int mrow;//Line count
private int mcol;//Number of columns
Public TableView (context context, AttributeSet Attrs) {
Super (context, attrs);
This.mrow = 3;//Default number of rows is 3
This.mcol = 3;//Default number of columns is 3
Adding child controls
This.addotherview (context);
}
Public TableView (context context, int row,int col) {
Super (context);
if (row>20 | | col>20) {
This.mrow = 20;//is greater than 20 rows, set row count to 20 rows
This.mcol = When 20;//is greater than 20 columns, set column number to 20 columns
}else if (row==0 | | col==0) {
This.mrow = 3;
This.mcol = 3;
}
else{
This.mrow = row;
This.mcol = col;
}
Adding child controls
This.addotherview (context);
}
public void Addotherview {
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);
Draw an outer border
Canvas.drawrect (StartX, Starty, GetWidth ()-startx, getheight ()-starty, paint);
Draw Column Split Line
for (int i=1;i<mcol;i++) {
Canvas.drawline ((getwidth ()/mcol) *i, Starty, (GetWidth ()/mcol) *i, GetHeight ()-starty, paint);
}
Draw Line Split Line
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;
}
}
Then we use our controls in the activity:
Copy Code code as follows:
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 ("Please enter an integer less than 20");
Col.seterror ("Please enter an integer less than 20");
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, "number of lines cannot be empty", Toast.length_short). Show ();
Return
}else if ("". Equals (Col.gettext (). toString ())) {
Toast.maketext (This, the number of columns cannot be empty, 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);
}
}
}
Copy Code code as follows:
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);
}
}
The effect chart is as follows:
