Advanced article-user interface: 5.android Drawing API Custom View (view)

1. Customize the view and add properties to it

We usually use the button Ah TextView AH is the system comes with Android control for developers to use, but these things are not enough, sometimes we need to customize the control.

(1) Create a new class MyView to inherit the view class

ImportAndroid.content.Context;ImportAndroid.content.res.TypedArray;ImportAndroid.util.AttributeSet;ImportAndroid.view.View;/*** Created by Lzc on 16/7/2.*/ Public classMyViewextendsView { PublicMyView (Context context, AttributeSet attrs) {Super(context, attrs);    }     PublicMyView (Context context) {Super(context); }}

These two construction methods are essential.

(2) At this point, we can add our custom control in Activity_main.xml.

< Com.example.lzc.myrect.MyView         Android:layout_width = "100DP"         android:layout_height= "100DP"        />

Its width and length are 100dp respectively, it is currently a square

(3) Add a resource file to the Res folder Arrts.xml

<?XML version= "1.0" encoding= "Utf-8"?><Resources>    <declare-styleablename= "MyView">        <attrname= "Rect_color"format= "Color"/>    </declare-styleable></Resources>

Declares a property named Rect_color, which is in the format of the color type.

(4) Return to the MyView class and add default properties for it

ImportAndroid.content.Context;ImportAndroid.content.res.TypedArray;ImportAndroid.util.AttributeSet;ImportAndroid.view.View;/*** Created by Lzc on 16/7/2.*/ Public classMyViewextendsView { PublicMyView (Context context, AttributeSet attrs) {Super(context, attrs); TypedArray Ta=context.obtainstyledattributes (Attrs,r.styleable.myview); intcolor = Ta.getcolor (r.styleable.myview_rect_color,0xffff0000);        SetBackgroundColor (color);    Ta.recycle (); }     PublicMyView (Context context) {Super(context); }}

(5) Directly using the attributes we just declared in XML (layout)

<?XML version= "1.0" encoding= "Utf-8"?><LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Xmlns:mns= "Http://schemas.android.com/apk/res-auto"Xmlns:tools= "Http://schemas.android.com/tools"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"android:orientation= "vertical"Tools:context= "Com.example.lzc.myrect.MainActivity">    <Com.example.lzc.myrect.MyViewAndroid:layout_width= "100DP"Android:layout_height= "100DP"Mns:rect_color= "#ff0000ff"        /></LinearLayout>

The name of this property is Rect_color, but we need to give him a namespace, and we see that there is an android in front of all the properties: This Android is the system's namespace.

We add a namespace named MNS (MyNamespace can be customized) and in eclipse we are going to

Xmlns:android= "Http://schemas.android.com/apk/res/android" in the Android directly to our package name, but in Android studio, only need to add:

Xmlns:mns= "Http://schemas.android.com/apk/res-auto"

He will automatically detect the name of the attribute you declared in the resource file.

2. Customizing button Skins

(1) Add an XML file of type drawable to the Res folder-button_skin.xml,root element is selector

<?XML version= "1.0" encoding= "Utf-8"?><selectorxmlns:android= "Http://schemas.android.com/apk/res/android">    <Itemandroid:state_pressed= "false"android:drawable= "@drawable/btn_normal"/>    <Itemandroid:state_pressed= "true"android:drawable= "@drawable/btn_pressed"/></selector>

That is, press and bounce to load two different background images separately.

(2) Add a background attribute to the button tag

android:background= "@drawable/button_skin"

Add the Button_skin.xml we just created to the background property.

4. Using the drawing API to customize the control

(1) Create a custom class first myview inherit the view class

 Public classMyViewextendsView { PublicMyView (Context context) {Super(context);    Init (); }     PublicMyView (Context context, AttributeSet attrs) {Super(context, attrs); }     PublicMyView (context context, AttributeSet attrs,intdefstyleattr) {        Super(context, attrs, defstyleattr); } @Override Public voidDraw (canvas canvas) {Super. Draw (canvas); }   }

We need three construction methods and a rewrite draw () method.

(2) using canvas to draw a square in the draw method, drawing requires a paint class as a tool, so you also need to define a paint class. and assign properties such as color to it.

 Public classMyViewextendsView { PublicMyView (Context context) {Super(context);    Init (); }     PublicMyView (Context context, AttributeSet attrs) {Super(context, attrs);    Init (); }     PublicMyView (context context, AttributeSet attrs,intdefstyleattr) {        Super(context, attrs, defstyleattr);    Init (); }    Private voidinit () {p=NewPaint ();    P.setcolor (color.red); } @Override Public voidDraw (canvas canvas) {Super. Draw (canvas);        Canvas.save (); Canvas.translate (200,200); Canvas.rotate (degrees,50,50); Canvas.drawrect (0, 0, 100, 100, p); Degrees++;        Canvas.restore (); Invalidate ();//Clear and Redraw    }    PrivatePaint p; Private floatDegrees=0;}

Note that the init () method needs to be added at the same time in three construction methods, ensuring that the method executes regardless of which constructor is executed.

In the draw method inside the operation for the thing this square rotation, so the rotation is very resource-intensive, so it is best to add a handle delay, so that its refresh frequency is not so fast.

(3) Add our own custom controls to the XML file

< Com.example.lzc.myapplication.MyView     Android:layout_width = "Fill_parent"     android:layout_height= "fill_parent"/>

So run the program and we'll see a rotating square!

Android's drawing API is very powerful and able to draw out any graphics and perform any animations.

Advanced article-user interface: 5.android Drawing API Custom View (view)