android 自定義控件 自定義屬性詳細介紹

自定義控件在android中無處不見,自定義控件給了我們很大的方便。比如說,一個視圖爲imageview ,imagebutton ,textview 等諸多控件的組合,用的地方有很多,我們不可能每次都來寫3個的組合,既浪費時間,效率又低。在這種情況下,我們就可以自定義一個view來替換他們,不僅提升了效率並且在xml中運用也是相當的美觀。 
一、控件自定義屬性介紹 
以下示例中代碼均在values/attrs.xml 中定義,屬性均可隨意命名。 
1. reference:參考某一資源ID。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "background" format = "reference" /> 
<attr name = "src" format = "reference" /> 
</declare-styleable> 

2. color:顏色值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "textColor" format = "color" /> 
</declare-styleable> 

3. boolean:布爾值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "focusable" format = "boolean" /> 
</declare-styleable> 

4. dimension:尺寸值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "layout_width" format = "dimension" /> 
</declare-styleable> 

5. float:浮點值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "fromAlpha" format = "float" /> 
<attr name = "toAlpha" format = "float" /> 
</declare-styleable> 

6. integer:整型值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "frameDuration" format="integer" /> 
<attr name = "framesCount" format="integer" /> 
</declare-styleable> 

7. string:字符串。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "text" format = "string" /> 
</declare-styleable> 

8. fraction:百分數。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name="名稱"> 
<attr name = "pivotX" format = "fraction" /> 
<attr name = "pivotY" format = "fraction" /> 
</declare-styleable> 

9. enum:枚舉值。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name="名稱"> 
<attr name="orientation"> 
<enum name="horizontal" value="0" /> 
<enum name="vertical" value="1" /> 
</attr> 
</declare-styleable> 

10. flag:位或運算。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name="名稱"> 
<attr name="windowSoftInputMode"> 
<flag name = "stateUnspecified" value = "0" /> 
<flag name = "stateUnchanged" value = "1" /> 
<flag name = "stateHidden" value = "2" /> 
<flag name = "stateAlwaysHidden" value = "3" /> 
</attr> 
</declare-styleable> 

11.多類型。 
示例: 
[java] 
複製代碼代碼如下:

<declare-styleable name = "名稱"> 
<attr name = "background" format = "reference|color" /> 
</declare-styleable> 

------------------------------------------------------------------------------------------- 
二、屬性的使用以及自定義控件的實現 
1、構思控件的組成元素,思考所需自定義的屬性。 
比如:我要做一個 <帶陰影的按鈕,按鈕正下方有文字說明>(類似9宮格按鈕) 
新建values/attrs.xml 
[java] 
複製代碼代碼如下:

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
<declare-styleable name="custom_view"> 
<attr name="custom_id" format="integer" /> 
<attr name="src" format="reference" /> 
<attr name="background" format="reference" /> 
<attr name="text" format="string" /> 
<attr name="textColor" format="color" /> 
<attr name="textSize" format="dimension" /> 
</declare-styleable> 
</resources> 

以上,所定義爲custom_view,custom_id爲按鈕id,src爲按鈕,background爲陰影背景,text爲按鈕說明,textColor爲字體顏色,textSize爲字體大小。 
2、怎麼自定義控件呢,怎麼使用這些屬性呢?話不多說請看代碼,CustomView : 
複製代碼代碼如下:

package com.nanlus.custom; 
import com.nanlus.custom.R; 
import android.content.Context; 
import android.content.res.TypedArray; 
import android.graphics.Color; 
import android.graphics.drawable.Drawable; 
import android.util.AttributeSet; 
import android.view.Gravity; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.widget.FrameLayout; 
import android.widget.ImageButton; 
import android.widget.ImageView; 
import android.widget.TextView; 
public class CustomView extends FrameLayout implements OnClickListener { 
private CustomListener customListener = null; 
private Drawable mSrc = null, mBackground = null; 
private String mText = ""; 
private int mTextColor = 0; 
private float mTextSize = 20; 
private int mCustomId = 0; 
private ImageView mBackgroundView = null; 
private ImageButton mButtonView = null; 
private TextView mTextView = null; 
private LayoutParams mParams = null; 
public CustomView(Context context) { 
super(context); 

public CustomView(Context context, AttributeSet attrs) { 
super(context, attrs); 
TypedArray a = context.obtainStyledAttributes(attrs, 
R.styleable.custom_view); 
mSrc = a.getDrawable(R.styleable.custom_view_src); 
mBackground = a.getDrawable(R.styleable.custom_view_background); 
mText = a.getString(R.styleable.custom_view_text); 
mTextColor = a.getColor(R.styleable.custom_view_textColor, 
Color.WHITE); 
mTextSize = a.getDimension(R.styleable.custom_view_textSize, 20); 
mCustomId = a.getInt(R.styleable.custom_view_custom_id, 0); 
mTextView = new TextView(context); 
mTextView.setTextSize(mTextSize); 
mTextView.setTextColor(mTextColor); 
mTextView.setText(mText); 
mTextView.setGravity(Gravity.CENTER); 
mTextView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, 
LayoutParams.WRAP_CONTENT)); 
mButtonView = new ImageButton(context); 
mButtonView.setImageDrawable(mSrc); 
mButtonView.setBackgroundDrawable(null); 
mButtonView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, 
LayoutParams.WRAP_CONTENT)); 
mButtonView.setOnClickListener(this); 
mBackgroundView = new ImageView(context); 
mBackgroundView.setImageDrawable(mBackground); 
mBackgroundView.setLayoutParams(new LayoutParams( 
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)); 
addView(mBackgroundView); 
addView(mButtonView); 
addView(mTextView); 
this.setOnClickListener(this); 
a.recycle(); 

@Override 
protected void onAttachedToWindow() { 
super.onAttachedToWindow(); 
mParams = (LayoutParams) mButtonView.getLayoutParams(); 
if (mParams != null) { 
mParams.gravity = Gravity.CENTER_HORIZONTAL | Gravity.TOP; 
mButtonView.setLayoutParams(mParams); 

mParams = (LayoutParams) mBackgroundView.getLayoutParams(); 
if (mParams != null) { 
mParams.gravity = Gravity.CENTER_HORIZONTAL | Gravity.TOP; 
mBackgroundView.setLayoutParams(mParams); 

mParams = (LayoutParams) mTextView.getLayoutParams(); 
if (mParams != null) { 
mParams.gravity = Gravity.CENTER_HORIZONTAL | Gravity.BOTTOM; 
mTextView.setLayoutParams(mParams); 


public void setCustomListener(CustomListener l) { 
customListener = l; 

@Override 
public void onClick(View v) { 
if (customListener != null) { 
customListener.onCuscomClick(v, mCustomId); 


public interface CustomListener { 
void onCuscomClick(View v, int custom_id); 



代碼很簡單,就不多說,下面來看看我們的CustomView是怎麼用的,請看: 
3、自定義控件的使用 
話不多說,請看代碼,main.xml: 
[java] 
複製代碼代碼如下:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:nanlus="http://schemas.android.com/apk/res/com.nanlus.custom" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" > 
<LinearLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_centerHorizontal="true" 
android:layout_centerVertical="true" 
android:orientation="horizontal" > 
<com.nanlus.custom.CustomView 
android:id="@+id/custom1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
nanlus:background="@drawable/background" 
nanlus:custom_id="1" 
nanlus:src="@drawable/style_button" 
nanlus:text="按鈕1" > 
</com.nanlus.custom.CustomView> 
</LinearLayout> 
</RelativeLayout> 

在這裏需要解釋一下, 
xmlns:nanlus="http://schemas.android.com/apk/res/com.nanlus.custom" 
nanlus爲在xml中的前綴,com.nanlus.custom爲包名 
4、在Activity中,直接上代碼 
[java] 
複製代碼代碼如下:

package com.nanlus.custom; 
import android.os.Bundle; 
import android.view.View; 
import android.widget.ImageButton; 
import android.widget.ImageView; 
import android.widget.TextView; 
import android.widget.Toast; 
import com.nanlus.BaseActivity; 
import com.nanlus.custom.R; 
import com.nanlus.custom.CustomView.CustomListener; 
public class CustomActivity extends BaseActivity implements CustomListener { 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 
setContentView(R.layout.main); 
((CustomView) this.findViewById(R.id.custom1)).setCustomListener(this); 

@Override 
public void onCuscomClick(View v, int custom_id) { 
switch (custom_id) { 
case 1: 
Toast.makeText(this, "hello !!!", Toast.LENGTH_LONG).show(); 
break; 
default: 
break; 


發佈了9 篇原創文章 · 獲贊 22 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章