首页 > 其他分享 >ActionBar样式解析

ActionBar样式解析

时间:2023-08-09 16:35:32浏览次数:59  
标签:ActionBar style 样式 Widget android 解析 drawable


Android的装饰风格有多种,这些风格的不同之处主要体现在标题栏区域。比如最普通的标题栏仅有图标和标题。还有一些其他的风格,如带进度条的标题栏等。

       在Android4.0上,有了新的标题栏,名为ActionBar,它提供了能强大的功能,如支持TAB页,支持菜单等。下面将分析主要的ActionBar样式。

 

一,

Theme主题对ActionBar样式的定义如下:


[html]  
    view plain 
    copy 
    

        
    
 
  
1. <!-- Action bar styles -->  
2. <item name="actionDropDownStyle">@android:style/Widget.Spinner.DropDown</item>  
3. <item name="actionButtonStyle">@android:style/Widget.ActionButton</item>  
4. <item name="actionOverflowButtonStyle">@android:style/Widget.ActionButton.Overflow</item>  
5. <item name="actionModeBackground">@android:drawable/cab_background_top_holo_dark</item>  
6. <item name="actionModeSplitBackground">@null</item>  
7. <item name="actionModeCloseDrawable">@android:drawable/ic_menu_close_clear_cancel</item>  
8. <item name="actionModeCutDrawable">@android:drawable/ic_menu_cut_holo_dark</item>  
9. <item name="actionModeCopyDrawable">@android:drawable/ic_menu_copy_holo_dark</item>  
10. <item name="actionModePasteDrawable">@android:drawable/ic_menu_paste_holo_dark</item>  
11. <item name="actionModeSelectAllDrawable">@android:drawable/ic_menu_selectall_holo_dark</item>  
12. <item name="actionModeShareDrawable">@android:drawable/ic_menu_share_holo_dark</item>  
13. <item name="actionModeFindDrawable">@android:drawable/ic_menu_find_holo_dark</item>  
14. <item name="actionModeWebSearchDrawable">@android:drawable/ic_menu_search</item>  
15. <item name="actionBarTabStyle">@style/Widget.ActionBar.TabView</item>  
16. <item name="actionBarTabBarStyle">@style/Widget.ActionBar.TabBar</item>  
17. <item name="actionBarTabTextStyle">@style/Widget.ActionBar.TabText</item>  
18. <item name="actionModeStyle">@style/Widget.ActionMode</item>  
19. <item name="actionModeCloseButtonStyle">@style/Widget.ActionButton.CloseMode</item>  
20. <item name="actionBarStyle">@android:style/Widget.ActionBar</item>  
21. <item name="actionBarSplitStyle">?android:attr/actionBarStyle</item>  
22. <item name="actionBarSize">@dimen/action_bar_default_height</item>  
23. <item name="actionModePopupWindowStyle">?android:attr/popupWindowStyle</item>  
24. <item name="actionMenuTextAppearance">@android:style/TextAppearance.Holo.Widget.ActionBar.Menu</item>  
25. <item name="actionMenuTextColor">?android:attr/textColorPrimary</item>  
26. <item name="actionBarWidgetTheme">@null</item>  
27. <item name="actionBarDivider">?android:attr/dividerVertical</item>  
28. <item name="actionBarItemBackground">?android:attr/selectableItemBackground</item>  
29.   
30. <item name="dividerVertical">@drawable/divider_vertical_dark</item>  
31. <item name="dividerHorizontal">@drawable/divider_vertical_dark</item>  
32. <item name="buttonBarStyle">@android:style/ButtonBar</item>  
33. <item name="buttonBarButtonStyle">?android:attr/buttonStyle</item>  
34. <item name="segmentedButtonStyle">@android:style/SegmentedButton</item>

这里定义了所有与ActionBar相关的属性,下面是Holo主题对ActionBar样式的定义,该样式对Theme定义的大部分ActionBar样式进行了重写,如下:



[html]  
    view plain 
    copy 
    

        
    
 
  
1. <!-- Action bar styles -->  
2. <item name="actionDropDownStyle">@android:style/Widget.Holo.Spinner.DropDown.ActionBar</item>  
3. <item name="actionButtonStyle">@android:style/Widget.Holo.ActionButton</item>  
4. <item name="actionOverflowButtonStyle">@android:style/Widget.Holo.ActionButton.Overflow</item>  
5. <item name="actionModeBackground">@android:drawable/cab_background_top_holo_dark</item>  
6. <item name="actionModeSplitBackground">@android:drawable/cab_background_bottom_holo_dark</item>  
7. <item name="actionModeCloseDrawable">@android:drawable/ic_cab_done_holo_dark</item>  
8. <item name="actionBarTabStyle">@style/Widget.Holo.ActionBar.TabView</item>  
9. <item name="actionBarTabBarStyle">@style/Widget.Holo.ActionBar.TabBar</item>  
10. <item name="actionBarTabTextStyle">@style/Widget.Holo.ActionBar.TabText</item>  
11. <item name="actionModeStyle">@style/Widget.Holo.ActionMode</item>  
12. <item name="actionModeCloseButtonStyle">@style/Widget.Holo.ActionButton.CloseMode</item>  
13. <item name="actionBarStyle">@android:style/Widget.Holo.ActionBar</item>  
14. <item name="actionBarSize">@dimen/action_bar_default_height</item>  
15. <item name="actionModePopupWindowStyle">@android:style/Widget.Holo.PopupWindow.ActionMode</item>  
16. <item name="actionBarWidgetTheme">@null</item>  
17.   
18. <item name="actionModeCutDrawable">@android:drawable/ic_menu_cut_holo_dark</item>  
19. <item name="actionModeCopyDrawable">@android:drawable/ic_menu_copy_holo_dark</item>  
20. <item name="actionModePasteDrawable">@android:drawable/ic_menu_paste_holo_dark</item>  
21. <item name="actionModeSelectAllDrawable">@android:drawable/ic_menu_selectall_holo_dark</item>  
22. <item name="actionModeShareDrawable">@android:drawable/ic_menu_share_holo_dark</item>  
23. <item name="actionModeFindDrawable">@android:drawable/ic_menu_find_holo_dark</item>  
24. <item name="actionModeWebSearchDrawable">@android:drawable/ic_menu_search_holo_dark</item>  
25.   
26. <item name="dividerVertical">?android:attr/listDivider</item>  
27. <item name="dividerHorizontal">?android:attr/listDivider</item>  
28. <item name="buttonBarStyle">@android:style/Holo.ButtonBar</item>  
29. <item name="buttonBarButtonStyle">?android:attr/borderlessButtonStyle</item>  
30. <item name="segmentedButtonStyle">@android:style/Holo.SegmentedButton</item>

这是系统HOLO主题对ActionBar样式的定义。从中可以看到有一些重要的样式属性定义,如actionBarStye、actionButtonStyle、actionModeStyle等。

 

二,              样式属性actionBarStyle

样式属性actionBarStyle定义了ActionBar的基本样式。


[html]  
    view plain 
    copy 
    

        
    
 
  
1. <style name="Widget.Holo.ActionBar.TabView" parent="Widget.ActionBar.TabView">  
2. <item name="android:background">@drawable/tab_indicator_holo</item>  
3. <item name="android:paddingLeft">16dip</item>  
4. <item name="android:paddingRight">16dip</item>  
5. </style>


 

其父样式如下:


[html]  
    view plain 
    copy 
    

        
    
 
  
1. <style name="Widget.ActionBar">  
2. <item name="android:background">@android:drawable/action_bar_background</item>  
3. <item name="android:displayOptions">useLogo|showHome|showTitle</item>  
4. <item name="android:divider">@android:drawable/action_bar_divider</item>  
5. <item name="android:height">?android:attr/actionBarSize</item>  
6. <item name="android:paddingLeft">0dip</item>  
7. <item name="android:paddingTop">0dip</item>  
8. <item name="android:paddingRight">0dip</item>  
9. <item name="android:paddingBottom">0dip</item>  
10. <item name="android:titleTextStyle">@android:style/TextAppearance.Widget.ActionBar.Title</item>  
11. <item name="android:subtitleTextStyle">@android:style/TextAppearance.Widget.ActionBar.Subtitle</item>  
12. <item name="android:progressBarStyle">@android:style/Widget.ProgressBar.Horizontal</item>  
13. <item name="android:indeterminateProgressStyle">@android:style/Widget.ProgressBar.Small</item>  
14. <item name="android:homeLayout">@android:layout/action_bar_home</item>  
15. </style>

其中,background定义了ActionBar的背景;

displayOptions定义了显示选项,这里声明了使用LOGO、显示Home以及Title。

homeLayout定义了ActionBar左边Home的布局,包括向左返回上一层那个箭头。

 

三,              样式属性actionButtonStyle

样式属性actionButtonStyle 定义了ActionBar上按钮的样式,比如ActionBar上的菜单按钮等。actionButtonStyle所引用的样式定义如下:


[html]  
    view plain 
    copy 
    

        
    
 
  
1. <style name="Widget.Holo.ActionButton" parent="Widget.ActionButton">  
2. <item name="android:minWidth">56dip</item>  
3. <item name="android:gravity">center</item>  
4. <item name="android:paddingLeft">12dip</item>  
5. <item name="android:paddingRight">12dip</item>  
6. <item name="android:scaleType">center</item>  
7. </style>  
 
 
从上面的定义看

出,它定义了Button的最小宽度、居中样式、左右padding以及图片的放缩方式。再看看该样式的父样式,如下:



[html]  
    view plain 
    copy 
    

        
    
 
  
1. <style name="Widget.ActionButton">  
2. <item name="android:background">?android:attr/actionBarItemBackground</item>  
3. <item name="android:paddingLeft">12dip</item>  
4. <item name="android:paddingRight">12dip</item>  
5. <item name="android:minWidth">56dip</item>  
6. <item name="android:minHeight">?android:attr/actionBarSize</item>  
7. </style>


 

从这里看出,子样式重写了父样式中的一些属性,但保留了背景和最小高度。这个背景background属性经过两次引用,引用了HOLO的如下属性:



[html]  
    view plain 
    copy 
    

        
    
 
  
1. <item name="selectableItemBackground">@android:drawable/item_background_holo_dark</item>

 

很明显的就能看出,该背景引用的是一个selector类型的drawable。下面是这个drawable的定义:



[html]  
    view plain 
    copy 
    

        
    
 
  
1. <selector xmlns:android="http://schemas.android.com/apk/res/android"  
2. android:exitFadeDuration="@android:integer/config_mediumAnimTime">  
3. <item android:state_focused="true"  android:state_enabled="false" android:state_pressed="true" android:drawable="@drawable/list_selector_disabled_holo_dark" />  
4. <item android:state_focused="true"  android:state_enabled="false"                              android:drawable="@drawable/list_selector_disabled_holo_dark" />  
5. <item android:state_focused="true"                                android:state_pressed="true" android:drawable="@drawable/list_selector_background_transition_holo_dark" />  
6. <item android:state_focused="false"                               android:state_pressed="true" android:drawable="@drawable/list_selector_background_transition_holo_dark" />  
7. <item android:state_focused="true"                                                             android:drawable="@drawable/list_focused_holo" />  
8. <item                                                                                          android:drawable="@color/transparent" />  
9. </selector>

这里就能看出各个状态下引用的是哪些背景图片了。

 

四,              样式属性actionBarDivider

样式属性actionBarDivider定义了ActionBar操作项之间的分隔条。可以看出,它直接引用了另一个ActionBar相关属性dividerVertical,其定义如下:



[html]  view plain copy

 



  1. <item name="dividerVertical">@drawable/divider_vertical_dark</item>  



 

通过分析,这里引用的drawable直接对应一张图片,而不是selector类型。

 

五,

样式属性actionMenuTextAppearance 和actionMenuTextColor定义了菜单的文本样式与颜色。



[html]  view plain copy

 


1. <style name="TextAppearance.Holo.Widget.ActionBar.Menu"  
2. parent="TextAppearance.Holo.Small">  
3. <item name="android:textSize">12sp</item>  
4. <item name="android:textStyle">bold</item>  
5. <item name="android:textColor">?android:attr/actionMenuTextColor</item>  
6. <item name="android:textAllCaps">true</item>  
7. </style>


 

六,

样式属性actionBarWidgetTheme 为被添加到ActionBar的操作栏中的Widget定义主题资源。

 

七,              样式属性actionBarStyle

样式属性actionBarStyle定义了ActionBar的基本样式。



[html]  view plain copy

 

1. <style name="Widget.Holo.ActionBar" parent="Widget.ActionBar">  
2. <item name="android:titleTextStyle">@android:style/TextAppearance.Holo.Widget.ActionBar.Title</item>  
3. <item name="android:subtitleTextStyle">@android:style/TextAppearance.Holo.Widget.ActionBar.Subtitle</item>  
4. <item name="android:background">@android:drawable/ab_transparent_dark_holo</item>  
5. <item name="android:backgroundStacked">@android:drawable/ab_stacked_transparent_dark_holo</item>  
6. <item name="android:backgroundSplit">@android:drawable/ab_bottom_transparent_dark_holo</item>  
7. <item name="android:divider">?android:attr/dividerVertical</item>  
8. <item name="android:progressBarStyle">@android:style/Widget.Holo.ProgressBar.Horizontal</item>  
9. <item name="android:indeterminateProgressStyle">@android:style/Widget.Holo.ProgressBar</item>  
10. <item name="android:progressBarPadding">32dip</item>  
11. <item name="android:itemPadding">8dip</item>  
12. </style>

 

其父样式如下:



[html]  view plain copy

 


1. <style name="Widget.ActionBar">  
2. <item name="android:background">@android:drawable/action_bar_background</item>  
3. <item name="android:displayOptions">useLogo|showHome|showTitle</item>  
4. <item name="android:divider">@android:drawable/action_bar_divider</item>  
5. <item name="android:height">?android:attr/actionBarSize</item>  
6. <item name="android:paddingLeft">0dip</item>  
7. <item name="android:paddingTop">0dip</item>  
8. <item name="android:paddingRight">0dip</item>  
9. <item name="android:paddingBottom">0dip</item>  
10. <item name="android:titleTextStyle">@android:style/TextAppearance.Widget.ActionBar.Title</item>  
11. <item name="android:subtitleTextStyle">@android:style/TextAppearance.Widget.ActionBar.Subtitle</item>  
12. <item name="android:progressBarStyle">@android:style/Widget.ProgressBar.Horizontal</item>  
13. <item name="android:indeterminateProgressStyle">@android:style/Widget.ProgressBar.Small</item>  
14. <item name="android:homeLayout">@android:layout/action_bar_home</item>  
15. </style>


 

 

八,样式属性actionBarTabStyle

样式属性 actionBarTabStyle 为Tab页的标签定义样式,其引用样式如下:



[html]  view plain copy

 


1. <style name="Widget.Holo.ActionBar.TabView" parent="Widget.ActionBar.TabView">  
2. <item name="android:background">@drawable/tab_indicator_holo</item>  
3. <item name="android:paddingLeft">16dip</item>  
4. <item name="android:paddingRight">16dip</item>  
5. </style>

其background属性定义了tab标签的背景,其也是selector类型的drawable。下面是该drawable的具体定义:



[html]  view plain copy

 

1. <selector xmlns:android="http://schemas.android.com/apk/res/android">  
2. <!-- Non focused states -->  
3. <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_holo" />  
4. <item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_holo" />  
5.   
6. <!-- Focused states -->  
7. <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_focused_holo" />  
8. <item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_focused_holo" />  
9.   
10. <!-- Pressed -->  
11. <!--    Non focused states -->  
12. <item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />  
13. <item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />  
14.   
15. <!--    Focused states -->  
16. <item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed_holo" />  
17. <item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed_holo" />  
18. </selector>


 

九,

样式属性actionBarTabBarStyle 定义了Tab标签之间分隔条。



[html]  view plain copy

 

1. <style name="Widget.Holo.ActionBar.TabBar" parent="Widget.ActionBar.TabBar">  
2. <item name="android:divider">?android:attr/actionBarDivider</item>  
3. <item name="android:showDividers">middle</item>  
4. <item name="android:dividerPadding">12dip</item>  
5. </style>


 

可以看出,divider引用的资源与前面菜单分隔条引用的资源是相同的。

 

十,样式属性actionBarTabTextStyle

样式属性 actionBarTabTextStyle 定义了Tab的文本样式,如下:



[html]  view plain copy

 

1. <style name="Widget.Holo.ActionBar.TabText" parent="Widget.ActionBar.TabText">  
2. <item name="android:textAppearance">@style/TextAppearance.Holo.Medium</item>  
3. <item name="android:textColor">?android:attr/textColorPrimary</item>  
4. <item name="android:textSize">12sp</item>  
5. <item name="android:textStyle">bold</item>  
6. <item name="android:textAllCaps">true</item>  
7. <item name="android:ellipsize">marquee</item>  
8. <item name="android:maxLines">2</item>  
9. </style>


 

十一,

样式属性 actionDropDownStyle 定义了下拉导航列表的样式,如下:



[html]  view plain copy

 


1. <style name="Widget.Holo.Spinner.DropDown.ActionBar">  
2. <item name="android:background">@android:drawable/spinner_ab_holo_dark</item>  
3. </style>

 

其祖先样式:



[html]  view plain copy

 

1. <style name="Widget.Holo.Spinner" parent="Widget.Spinner.DropDown">  
2. <item name="android:background">@android:drawable/spinner_background_holo_dark</item>  
3. <item name="android:dropDownSelector">@android:drawable/list_selector_holo_dark</item>  
4. <item name="android:popupBackground">@android:drawable/menu_dropdown_panel_holo_dark</item>  
5. <item name="android:dropDownVerticalOffset">0dip</item>  
6. <item name="android:dropDownHorizontalOffset">0dip</item>  
7. <item name="android:dropDownWidth">wrap_content</item>  
8. <item name="android:popupPromptView">@android:layout/simple_dropdown_hint</item>  
9. <item name="android:gravity">left|center_vertical</item>  
10. </style>

 

十二,

在与ActionBar相关的样式中还定义了ActionMode的样式,但ActionMode与ActionBar是属于两个不同类型的控件,这里就不对ActionMode进行介绍了。

 

通过上面对ActionBar样式的分析,我们就可能很容易在项目中根据实际需求对ActionBar的样式进行修改,特别是在主题切换功能中,要求对ActinBar的样式有比较全面深入的了解。除了ActionBar的样式之外,了解Android系统时何时创建ActionBar、以及根据不同feature创建不同的ActionBar也是非常重要的。

标签:ActionBar,style,样式,Widget,android,解析,drawable
From: https://blog.51cto.com/u_16120380/7022118

相关文章

  • 新东方在线:2014年6月四级作文真题范文及解析
    新东方在线:2014年6月四级作文真题范文及解析 题:Supposeaforeignfriendofyoursisgoingtovisityourhometown/yourcampus/China(多题多卷的三个不同),whatisthemostinterestingplaceyouwouldliketotakehim/hertoseeandwhy?范文:Themostinteresting......
  • 6. 对象解析
    6.对象解析章节目录1.解析总体流程2.类型分辨3.数值解析4.字符串解析5.数组解析6.对象解析‍6.1JSON对象结构JSON对象和数组类似,是一个复合类型,使用{}​包括,数组中每个元素都是一个JSON的value​,而对象中的每一个成员是一个键值对,以冒号':'分隔,......
  • 博客园样式配置更新
    主题配置CSS样式配置#home{margin:0auto;width:80%;/*原始65*/min-width:980px;/*页面顶部的宽度*/background-color:rgba(245,245,245,0.7);padding:30px;margin-top:50px;margin-bottom:50px;box-shadow:02px6pxrgb......
  • 缓存面试解析:穿透、击穿、雪崩,一致性、分布式锁、Redis过期,海量数据查找
    为什么使用缓存在程序内部使用缓存,比如使用map等数据结构作为内部缓存,可以快速获取对象。通过将经常使用的数据存储在缓存中,可以减少对数据库的频繁访问,从而提高系统的响应速度和性能。缓存可以将数据保存在内存中,读取速度更快,能够大大缩短数据访问的时间,提升用户体验。在业......
  • 使用python解析nginx日志
    性能测试时,需使用生产环境各接口请求比例分配接口请求比,nginx统计脚本如下:importreimportpandasaspdimportxlwtobj=re.compile(r'(?P<ip>.*?)--\[(?P<time>.*?)\]"(?P<request>.*?)"(?P<request_time>.*?)(?P<status>.*?)(?P<by......
  • 云监控---grafana使用mysql数据源创建dashboard--全面解析
    grafana的dashboard简介经常被用作基础设施的时间序列数据和应用程序分析的可视化。Grafana主要特性:灵活丰富的图形化选项;可以混合多种风格;支持多个数据源;拥有丰富的插件扩展;支持用户权限管理。Grafana有着非常漂亮的图表和布局展示,功能齐全的度量仪表盘dashboard和图形编辑......
  • soso地图api接口地理解析geocoder检索示例----并在信息框显示经纬度
    api官网:http://api.map.soso.com/doc_v2/example.html?sample-geocoding-simple#8map示例代码如下(保存为html打开可见效果):<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>......
  • java解析json
    {"status":0,"message":"ok","total":2,"results":[{"name":"蓝光COCO金沙","location":{"lat":30.68754......
  • Unity 编辑器资源导入处理函数 OnPostprocessAudio :深入解析与实用案例
    Unity编辑器资源导入处理函数OnPostprocessAudio用法点击封面跳转下载页面简介在Unity中,我们可以使用编辑器资源导入处理函数(OnPostprocessAudio)来自定义处理音频资源的导入过程。这个函数是继承自AssetPostprocessor类的,通过重写这个函数,我们可以在音频资源导入完成后执......
  • Unity 编辑器资源导入处理函数 OnPostprocessAudio :深入解析与实用案例
    Unity编辑器资源导入处理函数OnPostprocessAudio用法点击封面跳转下载页面简介在Unity中,我们可以使用编辑器资源导入处理函数(OnPostprocessAudio)来自定义处理音频资源的导入过程。这个函数是继承自AssetPostprocessor类的,通过重写这个函数,我们可以在音频资源导入完成后执......