關於android自定義控件Topbar的學習

【前言】
剛剛看完幕課網老師關於自定義VIEW topbar的課程,特此總結一下學習收穫。

【開發環境】
Eclipse +Android Developer Tools+bluestack調試

**

一.在res/values下創建atts.xml

**

添加左右中三個控件的屬性。

<resources>
    <declare-styleable name="TopBar">
        <attr name = "title" format = "string"/>
        <attr name = "titleTextSize" format = "dimension"/>
        <attr name = "titleTextColor" format = "color"/>
        <attr name = "leftText" format = "string"/>        
        <attr name = "leftTextColor" format = "color"/>
        <attr name = "leftBackground" format = "reference|color"/>
        <attr name = "rightText" format = "string"/>
        <attr name = "rightTextColor" format = "color"/>
        <attr name = "rightBackground" format = "reference|color"/>
    </declare-styleable>
</resources>

二.新建一個類繼承自RelativeLayout

(1).聲明屬性。

    private int leftTextColor;
    private Drawable leftBackbound;
    private String leftText;
    //.....其餘省略

(2)利用TypeArray的方法將attrs中的屬性綁定。

TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
leftTextColor = ta.getColor(R.styleable.TopBar_leftTextColor, 0);
        leftBackbound = ta.getDrawable(R.styleable.TopBar_leftBackground);
        leftText = ta.getString(R.styleable.TopBar_leftText);

(3)綁定完後調用方法ta.recycle();目的一是爲了避免浪費資源,二是爲了避免由於緩存引起的一些錯誤。

三.處理我們所需要的控件

        leftButton  = new Button(context);
        rightButton = new Button(context);
        title = new TextView(context);

        leftButton.setText(leftText);
        leftButton.setBackground(leftBackbound);
        leftButton.setTextColor(leftTextColor);

四.將控件放到layout裏面

(1)聲明LayoutParams變量

private LayoutParams leftParams,rightParams,titleParams;

(2) 添加控件及其規則

leftParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
        leftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT,TRUE);
        addView(leftButton,leftParams);
        ....//餘下省略

五.引用自定義view

修改activity_main.xml中的代碼

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:cwh= "http://schemas.android.com/apk/res/com.example.topbar"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.topbar.MainActivity"
    tools:ignore="MergeRootFrame" >

    <com.example.topbar.Topbar 
        android:id="@+id/topbar"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        cwh:leftBackground = "@drawable/Square"
        cwh:leftText = "Back"
        cwh:leftTextColor = "#FFFFFF"
        cwh:rightBackground = "@drawable/Square"
        cwh:rightText = "More"
        cwh:rightTextColor = "#FFFFFF"
        cwh:title = "自定義標題"
        cwh:titleTextColor = "#123412"
        cwh:titleTextSize = "10sp">
        </com.example.topbar.Topbar>
 </RelativeLayout>

六.動態控制topbar

回調機制動態調用

private topbarClickListener listener;

    public interface topbarClickListener{
        public void leftClick();
        public void rightClick();
    }

    public void setOnTopbarClickListener(topbarClickListener listener){
        this.listener = listener;
    }

設置按鈕的監聽事件

leftButton.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                listener.leftClick();
            }
        });
        rightButton.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                listener.rightClick();
            }
        });

最後在MainAcitivity引用就可以動態控制了

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Topbar topbar = (Topbar) findViewById(R.id.topbar);
        topbar.setOnTopbarClickListener(new topbarClickListener() {

            @Override
            public void rightClick() {
                // TODO Auto-generated method stub

            }

            @Override
            public void leftClick() {
                // TODO Auto-generated method stub

            }
        });
    }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章