Android Custom table Controls meet people's visual needs _android

Source: Internet
Author: User
Tags gettext

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;
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 (;
if (i%2==0) {
View.setbackgroundcolor (Color.rgb (219, 238, 243));
View.setbackgroundcolor (Color.rgb (235, 241, 221));
This.addview (view);
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);
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;
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;
protected void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.main);
BTN = (Button) Findviewbyid (;
row = (edittext) Findviewbyid (;
Col = (edittext) Findviewbyid (;
Row.seterror ("Please enter an integer less than 20");
Col.seterror ("Please enter an integer less than 20");
Btn.setonclicklistener (this);
public boolean Oncreateoptionsmenu (Menu menu) {
Inflate the menu; This adds items to the action bar if it is present.
Getmenuinflater (). Inflate (, menu);
return true;
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 ();
}else if ("". Equals (Col.gettext (). toString ())) {
Toast.maketext (This, the number of columns cannot be empty, toast.length_short). Show ();
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{
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:

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.