OneActionBar 使用說明
簡介
自定義ActionBar,支持屬性,java代碼方式配置,可實現(xiàn)標題,標題帶返回鍵,搜索,搜索帶返回鍵的ActionBar;配置簡單,方便使用,可適應(yīng)大多數(shù)場景。
效果圖

效果圖
- 標準標題頭,背景透明
style="@style/OneActionBar.Normal" - 標準標題頭,藍色背景
style="@style/OneActionBar.Normal.Blue" - 帶返回鍵標題頭,透明背景
style="@style/OneActionBar.Back" - 帶返回鍵標題頭,藍色背景
style="@style/OneActionBar.Back.Blue" - 帶搜索框標題頭,透明背景
style="@style/OneActionBar.Search" - 帶搜索框標題頭,藍色背景
style="@style/OneActionBar.Search.Blue" - 搜索框帶返回鍵標題頭,透明背景
style="@style/OneActionBar.Back.Search" - 搜索框帶返回鍵標題頭,藍色背景
style="@style/OneActionBar.Back.Search.Blue"
引入方式
TAG: [圖片上傳失敗...(image-244d2a-1573358407076)]
gradle
- 在項目中的根目錄下的 build.gradle (與model同級的) 中增加如下配置
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
- 在model 中的build.gradle 中增加依賴
dependencies {
implementation 'com.github.onestravel:OneActionBar:TAG'
}
屬性說明
| 屬性名 | 字段說明 | 示例 |
|---|---|---|
| app:barBackColor | ActionBar 返回鍵顏色,圖標和字體的顏色 | app:barBackColor="#000000" |
| app:barBackIconWidth | ActionBar 返回鍵圖標的寬度 | app:barBackIconWidth="25dp" |
| app:barBackIconHeight | ActionBar 返回鍵圖標的高度 | app:barBackIconHeight="25dp" |
| app:barBackText | ActionBar 返回鍵文字 | app:barBackText="返回" |
| app:barBackTextSize | ActionBar 返回鍵文字大小 | app:barBackTextSize="13sp" |
| app:barTitle | ActionBar 標題文字 | app:barTitle="首頁" |
| app:barTitleColor | ActionBar 標題文字顏色 | app:barTitleColor="#000000" |
| app:barTitleSize | ActionBar 標題文字大小 | app:barTitleSize="22sp" |
| app:barType | ActionBar 樣式,總共有四種樣式:TYPE_NORMAL(普通樣式)、TYPE_BACK(普通帶返回鍵樣式)、TYPE_SEARCH(搜索樣式)、TYPE_BACK_SEARCH(帶返回鍵搜索樣式)、 | app:barType="TYPE_NORMAL" |
| app:barActionBtnColor | ActionBar 標題右側(cè)操作按鈕圖標/文字顏色 | app:barActionBtnColor="#FF0000" |
| app:barActionBtnText | ActionBar 標題右側(cè)操作按鈕文字 | app:barActionBtnText="下一步" |
| app:barActionBtnTextSize | ActionBar 標題右側(cè)操作按鈕文字大小 | app:barActionBtnTextSize="15sp" |
| app:barBottomLineWidth | ActionBar 底部分割線的寬度 | app:barBottomLineWidth="1dp" |
| app:barBottomLineColor | ActionBar 底部分割線的顏色 | app:barBottomLineColor="#1a1a1a" |
| app:barActionBtnIcon | ActionBar 標題右側(cè)操作按鈕icon | app:barActionBtnIcon="@drawable/icon_next" |
| app:barActionBtnIconWidth | ActionBar 標題右側(cè)操作按鈕寬度 | app:barActionBtnIconWidth="25dp" |
| app:barActionBtnIconHeight | ActionBar 標題右側(cè)操作按鈕高度 | app:barActionBtnIconHeight="25dp" |
| app:barSearchBackground | ActionBar 搜索樣式背景 | app:barSearchBackground="#FFFFFF" |
| app:barSearchHint | ActionBar 搜索樣式搜索框提示文字 | app:barSearchHint="請輸入搜索內(nèi)容" |
| app:barSearchText | ActionBar 搜索樣式搜索框文字 | app:barSearchText="今日新聞" |
| app:barSearchHintColor | ActionBar 搜索樣式搜索框提示文字顏色 | app:barSearchHintColor="#E1E1E1" |
| app:barSearchTextColor | ActionBar 搜索樣式搜索框文字顏色 | app:barSearchTextColor="#000000" |
| app:barSearchTextSize | ActionBar 搜索樣式搜索框文字大小 | app:barSearchTextSize="20sp" |
| android:background | ActionBar 背景顏色 | android:background="#FFFFFF" |
樣式說明
根據(jù)圖片效果,先自定義樣式說明如下
注:標號對應(yīng)圖片效果數(shù)字號碼
- 標準標題頭,背景透明
style="@style/OneActionBar.Normal" - 標準標題頭,藍色背景
style="@style/OneActionBar.Normal.Blue" - 帶返回鍵標題頭,透明背景
style="@style/OneActionBar.Back" - 帶返回鍵標題頭,藍色背景
style="@style/OneActionBar.Back.Blue" - 帶搜索框標題頭,透明背景
style="@style/OneActionBar.Search" - 帶搜索框標題頭,藍色背景 ``style="@style/OneActionBar.Search.Blue"
- 搜索框帶返回鍵標題頭,透明背景
style="@style/OneActionBar.Back.Search" - 搜索框帶返回鍵標題頭,藍色背景
style="@style/OneActionBar.Back.Search.Blue"
示例
1、布局xml
<cn.onestravel.one.actionbar.OneActionBar
style="@style/OneActionBar.Back.Blue"
android:layout_width="match_parent"
android:layout_height="50dp"
app:barActionBtnText="下一步"
app:barTitle="調(diào)查問卷" />
2、樣式
<style name="OneActionBar.Back">
<item name="barTitleSize">22sp</item>
<item name="barActionBtnTextSize">16sp</item>
<item name="barType">TYPE_BACK</item>
<item name="barBackTextSize">14sp</item>
<item name="barBackText">返回</item>
</style>
<style name="OneActionBar.Back.Blue" parent="OneActionBar.Back">
<item name="android:background">#0080ff</item>
<item name="barBackColor">@android:color/white</item>
<item name="barTitleColor">@android:color/white</item>
<item name="barActionBtnColor">@android:color/white</item>
</style>