Fundamentals of Android Custom Controls (i) _android

Objective:

In the day-to-day development of Android will often deal with the control, and sometimes the controls provided by Android may not meet the needs of the business, this time we need to implement some custom controls, today we have a general understanding of the requirements of the custom control and implementation of the rationale.

Custom Control Requirements:

1. The specification of the Android standard (naming, configurable, event handling, etc.) should be adhered to.

2. In the XML Layout section configures the properties of the control.

3. The interaction should have appropriate feedback, such as press, click And so on.

4. With compatibility, there are many versions of Android, which should have wide applicability.

Custom Control Learning steps:

1. The working principle of view

2. Write View class

3. Add attributes to the view class

4. Draw Screen

5. Responding to user messages

6. Custom callback function

There are two ways to customize a control:

　　1. Inheriting ViewGroup

For example: ViewGroup, LinearLayout, Framelayout, Relativelayout and so on.

　　2. Inherit view

For example: View, TextView, ImageView, button and so on.

Custom control Basic Drawing principle:

View drawing is basically done by measure (), layout (), Draw () three functions

1.) Measuring-measure process is to calculate the view size, the view measure process related methods are mainly three:

Public final void measure (int widthmeasurespec, int heightmeasurespec) 
protected final void setmeasureddimension ( int measuredwidth, int measuredheight) 
protected void onmeasure (int widthmeasurespec, int heightmeasurespec)

Measure call onmeasure,onmeasure measure width, height and then invoke setmeasuredimension to save measurement results, Measure,setmeasuredimension is final type, The subclass of view does not need to be overridden, and onmeasure is overridden in the view's subclass.

About Measurespec:

(1) Upspecified: The parent container has no restrictions on the child container, and how big the child container wants.

(2) The exactly parent container has set dimensions for the child container, and the child container should obey these boundaries, regardless of how much space the child container wants.

(3) The At_most child container can be any size within the declared size.

2. The layout-layout process is used to set the location where the view is displayed on the screen, and the view layout process has three main methods:

public void layout (int l, int t, int r, int b)
protected Boolean setframe (int. left, int. top, int right, int bottom) 
   protected void OnLayout (Boolean changed, int left, int. top, int right, int bottom)

Layout by calling Setframe (L,t,r,b), l,t,r,b the specific location of the child view in the parent view, OnLayout is typically used only in custom ViewGroup

3. The drawing-draw process is mainly used to take advantage of the parameters obtained in the first two steps, display the view on the screen, and complete the whole view drawing work here.

public void Draw (Canvas Canvas)
protected void OnDraw (Canvas Canvas)

By calling the draw function for view drawing, the OnDraw function in the view class is an empty function, and the final rendering requirements need to be implemented in a custom OnDraw function, such as ImageView to complete the drawing of the picture, and if the custom viewgroup this function does not need to be overloaded.

Custom Control Examples:

Here first to introduce the way to inherit view for example, in fact, viewgroup the final inheritance is also view. This simulates a requirement scenario and requires a circular display percentage.

public class Percentview extends View {private final static String TAG = PercentView.class.getSimpleName (); private Pain
T Mpaint; Public Percentview {Super (context);} public Percentview (context context, AttributeSet Attrs) {Super (CO
ntext, attrs); Public Percentview (context, AttributeSet attrs, int defstyleattr) {Super (context, attrs, defstyleattr); @Over Ride protected void onmeasure (int widthmeasurespec, int heightmeasurespec) {super.onmeasure (Widthmeasurespec,
HEIGHTMEASURESPEC);
int widthmode = Measurespec.getmode (Widthmeasurespec);
int widthsize = measurespec.getsize (Widthmeasurespec);
int heightmode = Measurespec.getmode (Heightmeasurespec);
int heightsize = measurespec.getsize (Heightmeasurespec);
LOG.E (TAG, "onmeasure--widthmode-->" + Widthmode); Switch (widthmode) {case MeasureSpec.EXACTLY:break, case MeasureSpec.AT_MOST:break, Case MeasureSpec.UNSPECIFIED:brea
K
LOG.E (TAG, "onmeasure--widthsize-->" + widthsize); LOG.E (TAG, "OnmeasurE--heightmode--> "+ heightmode);
LOG.E (TAG, "onmeasure--heightsize-->" + heightsize); @Override protected void OnLayout (Boolean changed, int left, int. top, int right, int bottom) {super.onlayout (changed, l
EFT, top, right, bottom);
LOG.E (TAG, "onlayout");
@Override protected void OnDraw (Canvas Canvas) {Super.ondraw (Canvas); mpaint = new Paint (); Mpaint.setantialias (true);
Mpaint.setcolor (Color.gray);
Fill fill, STROKE stroke, fill_and_stroke fill and Stroke Mpaint.setstyle (Paint.Style.FILL_AND_STROKE);
int with = GetWidth ();
int height = getheight ();
LOG.E (TAG, "onDraw---->" + with + "*" + height);
float radius = WITH/4;
Canvas.drawcircle (WITH/2, WITH/2, radius, mpaint);
Mpaint.setcolor (Color.Blue); RECTF Oval = new RECTF (WITH/2-radius, WITH/2-radius, WITH/2 + radius, WITH/2 + radius); The bounds of the shape and size of the arc used to define CANVAS.DRAWARC (Oval, 270, mpaint); Draw Arc} According to progress

How to use in Layout

<linearlayout xmlns:android= "http://schemas.android.com/apk/res/android"
xmlns:tools= "http:// Schemas.android.com/tools "
android:layout_width=" match_parent "
android:layout_height=" Match_parent "
android:orientation= "vertical" >
<com.whoislcj.views.percentview
android:layout_width= "Wrap_ Content "
android:layout_height=" wrap_content "
android:layout_margin=" 10DP "/>
</linearlayout >

Display effect:

If the layout file is changed to

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android=
"http://schemas.android.com/apk/" Res/android "
xmlns:tools=" Http://schemas.android.com/tools "
android:layout_width=" Match_parent
" android:layout_height= "Match_parent"
android:orientation= "vertical" >
< Com.whoislcj.views.PercentView
android:layout_width= "150DP"
android:layout_height= "150DP"
android: layout_margin= "10DP"/>
</LinearLayout>

The display effect becomes

Summarize:

This article mainly introduces the basic drawing principle of the Android custom control, and will describe how to customize the attributes in the next article. Hope to help everyone, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!