可以看到QQ上的ToolBar其實就是一個自定義的view,可以看到不同的界面就是簡單地修改了文字而已,在第二張與第三張尤其的明顯,我們就仿QQ的這個Toolbar設置一個自定義控件
在開始之前,首先了解一下官方是如何實現一個控件的,比如說一個Linearlayout
它不是有layout_width和layout_height這兩個屬性嗎?其實,這兩個屬性就是官方定義的
官方的操作其實就是繼承了一個ViewGroup,Linearlayout相當於一個自定義View,其中的方法我們也不用深究,我們打開Path的那個路徑,可以找到一個atts.xml文件,打開我們可以在里面看到定義了Linearlayout關於layout的屬性,有layout_width和layout_height這幾個屬性,看到這里我們也就明白了我們在布局文件中引用要使用的屬性
正文開始,我們講解一個自定義控件的步驟:
1.設計需要使用的屬性
先將模式切換為project模式
新建一個moudle
修改相關包名,庫名
這里選擇第一個,也就是不創建activity界面,之后點擊finish就完成了
依次展開Topbar->res->values,在values創建一個atts.xml文件
xml文件代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="Topbar">
<attr name="title" format="string"/>
<attr name="titleTextSize" format="dimension"/>
<attr name="titleTextColor" format="color"/>
<attr name="leftTextColor" format="color"/>
<attr name="leftBackgroud" format="reference|color"/>
<attr name="leftText" format="string"/>
<attr name="rightTextColor" format="color"/>
<attr name="rightBackgroud" format="reference|color"/>
<attr name="rightText" format="string"/>
</declare-styleable>
</resources>
深入理解可以看看這一篇 http://blog.csdn.net/zjh_1110120/article/details/50976027
2.實現一個我們需要的控件
在topbar的java文件夾,新建一個Topbar類,使其繼承RelativeLayout
之后,重寫其中帶有兩個參數的構造方法,Attributeset這個類是用來存放之前定義在xml文件中的各種屬性
之后,創建一個TypedArray類的對象ta,調用context的obtainStyleAttribute方法,獲取剛才我們創建的atts.xml中的各類屬性,第二個參數Topbar就是上文atts.xml中定義<declare-styleable name="Topbar">
之后,便是可以使用TypedArray類中的getxx方法來取得xml中定義的相關屬性,Topbar與atts.xml中定義的屬性使用下划線連接
可以看到有些第二個參數為0,意思就是如果在布局文件沒有給控件的屬性沒有設置屬性值,就默認為0
還要記得最后需要回收
深入理解TypedArray及Attributeset相關方法,請看這篇http://blog.csdn.net/lmj623565791/article/details/45022631
之后獲得之前的屬性值,以此設置相關屬性
這里呢,當我們在布局文件中使用了這個自定義控件的屬性時候,這個類就會獲得我們所輸入的屬性值,之后調用上述方法進行設置
到這一步之后,我們還需要將左右button與標題textview放在一個View中,使用LayoutPram的addview方法添加到VIew中
首先聲明三個LayoutPram
進行寬高設置之后,使用addView添加到View當中
到這一步,布局就是完成了,但是還要實現左右button的點擊事件,直接設置一個點擊的監聽器就是完成了
但是,這不是我們想要的模板,模板的話,是應該直接在activity中設置監聽器不是更為快捷,而不應該是在控件這里寫相關的事件處理,所以,我們得使用接口回調機制
仿照button設置監聽器的方法,我們可以定義一個接口類topbarClickListener,在其中聲明兩個方法,對應左按鈕的點擊與右按鈕的點擊事件,之后,聲明一個接口類對象listener,創建一個setOnTopbarClickListener方法,在其中將參數傳給之前聲明的listener
之后,修改左右button的點擊事件,使其調用接口里的方法,這樣就是完成了
三、引用我們的控件
這里使用的話需要加入一個依賴,
選擇app,點擊+號,選擇module,之后選擇之前建立的module,確定即可
PS:上圖不是本篇的那個自定義控件
不過我發現添加依賴的時候失敗了,出現unspecified on project app resolves to an APK archive which is not supported的錯誤
查了資料,找到了解決方法,需要將庫中的build.gradle改一下
原來的庫的開頭是apply plugin: 'com.android.application'
將這個改為apply plugin: 'com.android.library' ,如果sync之后還有錯誤的話,將閉包defaultconfig的含有applicationId的那一行刪除就可以
。
引用就是像使用button那樣引用,進行屬性的相關賦值,就如同我們使用button,textview等控件的屬性一樣
這里可以看到,有個cus,類似我們使用的android,像系統定義的button等控件,我們設置它的屬性都是需要寫上android,之前有一句xmlns:android="http://schemas.android.com/apk/res/android"
這就是說明使用的android本身的控件屬性,android這個相當於一個名字,我們可以隨便寫,之后將后面的改為res-auto,之后使用我們的自定義屬性就是以我們之前寫的名字為前綴,就如我圖中那樣
其中cus可以任意指定,但不能與系統的命名空間相同,在android studio中如上 用res-auto,在eclipse中res后需要完整的包名
右邊的預覽圖大家也可以看到實際的效果