New book content serialization (1): Custom Android components with image TextView

This article is original. If you need to reprint it, please indicate the author and the source. Thank you!

This article is serialized in the new book Android/OPhone development handouts. The complete handout for Android/OPhone development has been published.

Purchase: Internet

Android/OPhone development Handouts

Source code download

In this example, You need to implement a TextView component that can add an image (which can be an image format supported by any Android system) in front of the text. Before writing the code, let's take a look at the configuration code of the Android component.

<TextView android: id = "@ + id/textview1" android: layout_width = "fill_parent"
Android: layout_height = "wrap_content" android: text = "textview1"/>

In the constructor, you can use the corresponding getter method of the AttributeSet interface to read the specified attribute value. If the namespace is specified during attribute configuration, you must specify this namespace when using the getter method to obtain the attribute value. If no namespace is specified, set the namespace to null.

IconTextView is the component class to be compiled in this example. This class inherits from TextView. In the onDraw method, the text in TextView is removed and an image is added to the front of the text, the resource ID of the image is specified through the mobile: iconSrc attribute. The IconTextView class code is as follows:

Package net. blogjava. mobile. widget;

Import android. content. Context;
Import android. graphics. Bitmap;
Import android. graphics. BitmapFactory;
Import android. graphics. Canvas;
Import android. graphics. Rect;
Import android. util. AttributeSet;
Import android. widget. TextView;

Public class IconTextView extends TextView
{
// Namespace Value
Private final String namespace = "http://net.blogjava.mobile ";
// Save the variable of the image resource ID
Private int resourceId = 0;
Private Bitmap bitmap;
Public IconTextView (Context context, AttributeSet attrs)
{
Super (context, attrs );
// The getAttributeResourceValue method is used to obtain the value of the Component Attribute. In this example, the 1st parameters of this method are
// Set the namespace value. The 2nd parameters of this method indicate the component property name (excluding the namespace name), and the 3rd parameters indicate
// Recognize the value, that is, if the attribute does not exist, the value specified by the 3rd parameters is returned.
ResourceId = attrs. getAttributeResourceValue (namespace, "iconSrc", 0 );
If (resourceId> 0)
// If the image resource ID is obtained successfully, load the image resource and create a Bitmap object
Bitmap = BitmapFactory. decodeResource (getResources (), resourceId );
}
@ Override
Protected void onDraw (Canvas canvas)
{
If (bitmap! = Null)
{
// Capture the image area from the source image. In this example, the entire image is
Rect src = new Rect ();
// Copy the captured image to the target region on the bitmap. In this example, it is the same as the copied region.
Rect target = new Rect ();
Src. left = 0;
Src. top = 0;
Src. right = bitmap. getWidth ();
Src. bottom = bitmap. getHeight ();
Int textHeight = (int) getTextSize ();
Target. left = 0;
// Calculate the ordinate value of the image copied to the target region. Because the text content of the TextView component is not
// Draw from the top. Therefore, you need to recalculate the ordinate of the drawn image.
Target. top = (int) (getMeasuredHeight ()-getTextSize ()/2) + 1;
Target. bottom = target. top + textHeight;
// To ensure that the image is not deformed, the width of the image needs to be recalculated based on the Image Height.
Target. right = (int) (textHeight * (bitmap. getWidth ()/(float) bitmap. getHeight ()));
// Start drawing the image
Canvas. drawBitmap (bitmap, src, target, getPaint ());
// Move the text in TextView to the right to a certain distance (in this example, the position of adding two pixel points to the image width)
Canvas. translate (target. right + 2, 0 );
}
Super. onDraw (canvas );
}
}

 

Note the following three points when writing the above Code:
1. You need to specify the namespace value. This value is defined in the xmlns: mobile attribute of the <LinearLayout> label.
2. if you specify a namespace When configuring the attributes of a component, you must specify the namespace value in the 1st parameters in the corresponding getter method of the AttributeSet interface, for the 2nd parameters, you only need to specify the attribute name without the namespace.
3. The onDraw method in the TextView class must be executed after the translate method. Otherwise, the system will not move the text in the TextView.

After running the instance, The result shown in 1 is displayed.

Note: although many people think that the attributes of a component must start with the android namespace, the value of this namespace must be http://schemas.android.com/apk/res/android. In fact, only the namespace value must be bytes:

<? Xml version = "1.0" encoding = "UTF-8"?>
<! -- Replace android with abcd -->
<LinearLayout xmlns: abcd = "http://schemas.android.com/apk/res/android"
Abcd: orientation = "vertical" abcd: layout_width = "fill_parent"
Abcd: layout_height = "fill_parent">

</LinearLayout>

 
Next article: new book content serialization (2): lifecycle of Android Activity