天天看點

Android 自定義标簽 和 自定義元件 1    自定義标簽 2    自定義元件 3    使用方法 4    結果展示

這是我的模闆項目目錄

Android 自定義标簽 和 自定義元件 1    自定義标簽 2    自定義元件 3    使用方法 4    結果展示

既然想像 android:text  那樣使用自己的标簽,那麼首先得有标簽。

在 res/values/ 下我建立了個 mm_tag.xml (切記不可出現大寫,隻能是 小寫字母、數字、下劃線)

mm_tag.xml

<?xml version="1.0" encoding="utf-8"?>  

<resources>  

    <declare-styleable name="griditem">  

        <attr name="bkground" format="reference|color"/>  

        <attr name="text1"    format="string"/>  

        <attr name="text2"    format="string"/>  

        <attr name="image"    format="reference|integer"/>  

    </declare-styleable>      

</resources>  

format 參考:

1. reference:參考某一資源id

2. color:顔色值

3. boolean:布爾值

4. dimension:尺寸值

5. float:浮點值

6. integer:整型值

7. string:字元串

8. fraction:百分數

9. enum:枚舉值

//屬性定義:  

< declare -styleable name = "名稱" >  

    <attr name = "orientation" >  

        <enum name = "horizontal" value = "0" />  

        <enum name = "vertical" value = "1" />  

    </attr>                        

</ declare -styleable>  

//屬性使用:  

<linearlayout  

    xmlns:android = "http://schemas.android.com/apk/res/android"  

    android:orientation = "vertical"  

    android:layout_width = "fill_parent"  

    android:layout_height = "fill_parent"  

>  

</linearlayout>  

10. flag:位或運算

    <attr name = "windowsoftinputmode" >  

        <flag name = "stateunspecified" value = "0" />  

        <flag name = "stateunchanged" value = "1" />  

        <flag name = "statehidden" value = "2" />  

    </attr>                  

<activity  

    android: name = ".styleandthemeactivity"  

    android:label = "@string/app_name"  

    android:windowsoftinputmode = "stateunspecified | stateunchanged | statehidden" >  

    <intent-filter>  

        < action android: name = "android.intent.action.main" />  

        <category android: name = "android.intent.category.launcher" />  

    </intent-filter>  

</activity>  

<code></code>

11.注意:屬性定義時可以指定多種類型值。

    &lt;attr name = "background" format = "reference|color" /&gt;  

&lt;imageview  

    android:layout_width = "42dip"  

    android:layout_height = "42dip"  

    android: background = "@drawable/圖檔id|#00ff00" /&gt;  

比如我們在布局中使用自定義元件 griditem:

首先 聲明好 标簽的命名空間

xmlns:griditem = "http://schemas.android.com/apk/res/com.mm.template"  

//對比下 android 的命名空間:  

xmlns:android = "http://schemas.android.com/apk/res/android"  

發現隻有 res/後面的不同,com.mm.template 是我的應用程式包名,通過上文中的 項目目錄圖檔可以看出來,

griditem 是我随便想的一個命名空間的名字。

接下來就是使用自定義元件

&lt; com.mm.template.griditem  

     griditem:image = "@drawable/mm_1"  

     android:padding = "5dp"  

     android:layout_width = "wrap_content"  

     android:layout_height = "wrap_content"  

     android:layout_weight = "1"  

     griditem:bkground = "@color/orange"  

     griditem:text1 = "android"       griditem:text2 = "手機開發" /&gt;  

其中 用到了我們的自定義标簽:

griditem:image = "@drawable/mm_1"  

griditem:bkground = "@color/orange"  

griditem:text1 = "android"  

griditem:text2 = "手機開發"  

怎麼擷取标簽傳回的資料呢呢?

在自定義元件 griditem 的實作代碼中使用如下方法即可

public griditem(context context, attributeset attrs) {  

    super(context, attrs);  

    typedarray typedarray=context.obtainstyledattributes(attrs, r.styleable.griditem);  

    bk_color =typedarray.getresourceid(r.styleable.griditem_bkground, r.color.burlywood);  

    text1 =typedarray.getstring(r.styleable.griditem_text1);  

    text2 =typedarray.getstring(r.styleable.griditem_text2);  

    image=typedarray.getdrawable(r.styleable.griditem_image);  

    typedarray.recycle();  

    view=layoutinflater.from(context).inflate(r.layout.mm_grid_item, this,true);  

    layout=(linearlayout)view.findviewbyid(r.id.item_layout);  

    textview1=(textview)view.findviewbyid(r.id.text1);  

    textview2=(textview)view.findviewbyid(r.id.text2);  

    imageview=(imageview)view.findviewbyid(r.id.imageview);  

    layout.setbackgroundresource(bk_color); //設定背景色  

    textview1.settext(text1);               //設定第一行文字  

    textview2.settext(text2);               //設定第二行文字  

    imageview.setimagedrawable(image);      //設定圖示  

}  

即可獲得 我們自定義标簽傳過來的資料,并且正确的在界面中顯示出來。

下面我将結合自定義 元件 griditem 來一起講。

我想實作一個元件,類似于這樣的

Android 自定義标簽 和 自定義元件 1    自定義标簽 2    自定義元件 3    使用方法 4    結果展示

方法有很多種,自定義布局即可,現在我想讓它以元件的形式在 布局中直接 像 textview 一樣使用,

Android 自定義标簽 和 自定義元件 1    自定義标簽 2    自定義元件 3    使用方法 4    結果展示

那麼就用到自定義元件。

下面我将實作一個自定義元件 griditem 實作。

一般都是繼承于 layout(我用繼承于view時出現問題 ~~!)

griditem.java

package com.mm.template;  

import android.content.context;  

import android.content.res.typedarray;  

import android.graphics.drawable.drawable;  

import android.util.attributeset;  

import android.view.layoutinflater;  

import android.view.view;  

import android.widget.imageview;  

import android.widget.linearlayout;  

import android.widget.textview;  

public class griditem extends linearlayout {  

    private int bk_color;   //背景色  

    private string text1;   //第一行文字  

    private string text2;   //第二行文字  

    private drawable image; //圖示  

    private linearlayout layout;  

    private textview textview1;  

    private textview textview2;  

    private imageview imageview;  

    private view view;  

    public griditem(context context, attributeset attrs) {  

        super(context, attrs);  

        typedarray typedarray=context.obtainstyledattributes(attrs, r.styleable.griditem);  

        bk_color =typedarray.getresourceid(r.styleable.griditem_bkground, r.color.burlywood);  

        text1 =typedarray.getstring(r.styleable.griditem_text1);  

        text2 =typedarray.getstring(r.styleable.griditem_text2);  

        image=typedarray.getdrawable(r.styleable.griditem_image);  

        typedarray.recycle();  

        view=layoutinflater.from(context).inflate(r.layout.mm_grid_item, this,true);  

        layout=(linearlayout)view.findviewbyid(r.id.item_layout);  

        textview1=(textview)view.findviewbyid(r.id.text1);  

        textview2=(textview)view.findviewbyid(r.id.text2);  

        imageview=(imageview)view.findviewbyid(r.id.imageview);  

        layout.setbackgroundresource(bk_color); //設定背景色  

        textview1.settext(text1);               //設定第一行文字  

        textview2.settext(text2);               //設定第二行文字  

        imageview.setimagedrawable(image);      //設定圖示  

    }  

這個自定義元件 griditem 用到的布局檔案

mm_grid_item.xml

&lt;? xml   version = "1.0"    encoding = "utf-8" ?&gt;  

&lt; linearlayout   xmlns:android = "http://schemas.android.com/apk/res/android"  

     xmlns:tools = "http://schemas.android.com/tools"  

     android: id = "@+id/item_layout"  

     android:layout_width = "match_parent"  

     android:layout_height = "match_parent"  

     android:orientation = "vertical"  

     android: background = "@color/black"  

     android:padding = "3dp"  

     android:paddingleft = "6dp"  

     tools:ignore = "hardcodedtext,contentdescription"    &gt;  

     &lt; textview  

         android: id = "@+id/text1"  

         android:layout_weight = "1"  

          style = "@style/mm_textview" /&gt;  

         android: id = "@+id/text2"  

         android:textsize = "12sp"  

     &lt; imageview  

         android: id = "@+id/imageview"  

         android:layout_width = "wrap_content"  

         android:layout_height = "0dp"  

         android:layout_gravity = "right"  

         android: src = "@drawable/mm_title_1"     

         android:layout_weight = "2"  

         android:layout_margintop = "10dp"  

         android:scaletype = "fitcenter" /&gt;  

      &lt;!--圖檔縮放  

        android:scalex="0.8"  

        android:scaley="0.8" --&gt; &lt;/ linearlayout &gt;  

在 main_layout.xml (我的主布局檔案)中使用

     xmlns:griditem = "http://schemas.android.com/apk/res/com.mm.template"  

     android: background = "@color/white"  

     tools:ignore = "hardcodedtext,contentdescription,nestedweights"    &gt;  

      &lt;!-- head start --&gt;  

     &lt; linearlayout  

         android:layout_width = "match_parent"  

         android:layout_height = "44dp"  

         android:orientation = "horizontal"  

         android:padding = "10dp"  

         android: background = "@color/red" &gt;  

         &lt; imageview  

             android:layout_width = "wrap_content"  

             android:layout_height = "match_parent"  

             android: src = "@drawable/mm_title_1"    /&gt;  

         &lt; textview  

             android:layout_width = "0dp"  

             android:layout_weight = "1"  

             android:gravity = "center"  

             android: text = "測試案例"  

             android:textstyle = "bold"  

             android:textsize = "16sp"  

             android:textcolor = "@android:color/white" /&gt;  

             android: src = "@drawable/mm_title_2"    /&gt;  

     &lt;/ linearlayout &gt;  

      &lt;!-- head end   --&gt;  

      &lt;!-- search start--&gt;  

         android:layout_height = "36dp"  

         android:orientation = "vertical"  

         android:paddingtop = "3dp"     

         android:layout_margin = "8dp" &gt;  

         &lt; edittext  

             android: id = "@+id/search_edit"  

             android:layout_width = "match_parent"  

             android:drawableleft = "@drawable/mm_search"  

               android: background = "@drawable/mm_shape_editview"  

               android:hint = "請輸入關鍵字"  

             android:textcolorhint = "@color/darkgray"  

             android:padding = "6dp" /&gt;  

      &lt;!-- search end  --&gt;  

      &lt;!-- griditem start  --&gt;  

     &lt; linearlayout    

           android:layout_width = "match_parent"  

           android:layout_height = "0dp"  

           android:layout_weight = "1"  

           android:orientation = "horizontal"  

         android:layout_margin = "10dp" &gt;  

         &lt; com.mm.template.griditem  

             griditem:image = "@drawable/mm_1"  

             android:padding = "5dp"  

               android:layout_width = "wrap_content"  

               android:layout_height = "wrap_content"  

               android:layout_weight = "1"  

               griditem:bkground = "@color/orange"  

               griditem:text1 = "android"  

               griditem:text2 = "手機開發" /&gt;  

             griditem:image = "@drawable/mm_2"  

               griditem:bkground = "@color/blueviolet"  

               griditem:text1 = "c++"  

               griditem:text2 = "程式設計語言" /&gt;  

             griditem:image = "@drawable/mm_3"  

               griditem:bkground = "@color/blue"  

               griditem:text1 = "服務端"  

               griditem:text2 = "背景開發" /&gt;  

      &lt;!-- griditem end  --&gt; &lt;/ linearlayout &gt;  

也就是 &lt;com /&gt; 标簽為我們自定義的 griditem 元件。

Android 自定義标簽 和 自定義元件 1    自定義标簽 2    自定義元件 3    使用方法 4    結果展示

參考來源: &lt;http://blog.sina.com.cn/s/blog_62ef2f14010105vi.html&gt;

繼續閱讀