ActionBar中OptionMenu弹出菜单的位置和overflow右边距的调整

ActionBar中OptionMenu的显示以前是显示在overflow的下面,5.0以后显示的位置直接覆盖了overflow图标

在这里是通过修改样式的方式来解决显示问题

解决方案

1. 在values-v21 styles.xml文件中添加

    <style name="OverflowMenuStyle" parent="Widget.AppCompat.PopupMenu.Overflow">
        <!-- Api 21 -->
        <item name="overlapAnchor">false</item>
        <!-- 弹出层背景颜色 -->
        <item name="android:popupBackground">@color/action_bar_title_text_color</item>
        <!-- 设置弹出菜单文字颜色 -->
        <item name="android:textColor">@color/message_text</item>
    </style>

2. 在主题中添加

<item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>

效果图

针对overflow的icon距离右边框太近的问题

解决方案

1. 在values-v21 styles.xml文件中添加

    <style name="OverflowButtonStyle">
        <item name="android:src">@drawable/zui_navbar_more</item> <-- 修改overflow的icon -->
        <item name="android:paddingRight">@dimen/overflow_icon_padding_right</item>
    </style>

2. 在主题中添加

<item name="actionOverflowButtonStyle">@style/OverflowButtonStyle</item>


Button自定义样式


 1.通过XML文件设置属性

       定义后和未定义的对比

     

         给button添加自定义的显示也非常简单,在button属性里加上android:background="@drawable/bt_style_bg" 其中最主要的是在drawable文件夹下的bt_style_bg.xml文件

[html] view plain copy
 
<?xml version="1.0" encoding="utf-8"?>  
<selector xmlns:android="http://schemas.android.com/apk/res/android">  
  
    <!-- 被按下 -->  
    <item android:state_pressed="true"><shape>  
  
            <!-- 颜色渐变 startColor开始颜色,endColor结束颜色,angle开始渐变的角度(值只能为90的倍数,0时为左到右渐变,90时为下到上渐变,依次逆时针类推-->  
            <gradient android:angle="270" android:endColor="#ADFF2F" android:startColor="#ADFF2F"/>  
            <!-- 按钮边缘框 -->  
            <stroke android:width="1dip" android:color="#f403c9" />  
            <!-- 按钮圆角度 -->  
            <corners android:radius="2dp" />  
            <!-- 按钮文字和边缘距离(内边距) -->  
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />  
        </shape></item>  
  
    <!-- 获取焦点 -->  
    <item android:state_focused="true"><shape>  
            <gradient android:angle="270" android:endColor="#00ff00" android:startColor="#00ffff" />  
  
            <stroke android:width="1dip" android:color="#f403c9" />  
  
            <corners android:radius="2dp" />  
  
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />  
        </shape></item>  
  
    <!-- 默认 -->  
    <item><shape>  
            <gradient android:angle="180" android:endColor="#ffffff" android:startColor="#000000" />  
  
            <stroke android:width="1dip" android:color="#f403c9" />  
  
            <corners android:radius="5dip" />  
  
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />  
        </shape></item>  
  
</selector>  


       shape属性的使用
圆角背景

[html] view plain copy
 
<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:android="http://schemas.android.com/apk/res/android"  
    android:shape="rectangle">  
  
    <!-- 实心 即填充颜色-->  
    <solid android:color="#E2F5F9"/>  
    <!-- 描边 即边框颜色-->  
    <stroke  
        android:width="2dp"  
        android:color="#125579" />  
    <!-- 圆角 -->  
    <corners  
        android:topLeftRadius="180dp"  
        android:bottomLeftRadius="180dp"  
        android:topRightRadius="180dp"  
        android:bottomRightRadius="180dp"/>  
    <padding  
        android:left="10dp"  
         android:bottom="5dp"  
        android:top="5dp"  
        android:right="10dp"  
        />  
</shape>  

圆形背景

[html] view plain copy
 
<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:android="http://schemas.android.com/apk/res/android"  
    android:shape="oval">  
    <padding  
        android:bottom="2dp"  
        android:left="2dp"  
        android:right="2dp"  
        android:top="2dp"></padding>  
    <size android:height="15dp"  
        android:width="15dp"></size>  
    <solid android:color="#DD0000"></solid>  
</shape>  

    2. 自定义形状、颜色、图样的按钮的实现

    步骤如下。

    (a) 设计一张自定义形状风格背景的图片,如下图。

        

   (b) 未点击和按下后的状态各做一张,形成一套图片,如下图。

        like_normal.png      like_pressed.png

   (c) 创建和编写按钮不同状态的图片使用描述文件drawable/bt_like.xml

[html] view plain copy
 
<?xml version="1.0" encoding="UTF-8"?>    
<selector xmlns:android="http://schemas.android.com/apk/res/android">    
    <item android:state_pressed="true"    
        android:drawable="@drawable/like_normal" />    
    <item android:state_focused="true"    
        android:drawable="@drawable/like_pressed" />    
    <item android:drawable="@drawable/like_normal" />    
</selector>  


     3.9-patch图片背景方式(注意前面有个.)

  9-patch格式,是在Android中特有的一种PNG图片格式,以"***.9.png"结尾。此种格式的图片定义了可以伸缩拉伸的区域和文字显示区域,这样,就可以在Android开发中对非矢量图进行拉伸而仍然保持美观。如果使用位图而没有经过9-patch处理的话,效果就会将图片任意的拉伸,影响效果。Android中大量用了这种技术,默认的按钮的背景就是用了类似的方法实现的。我们看一下google官方的描述:

    

    在Android sdk目录下有一个tools文件夹,在这个文件夹中找到draw9patch.bat文件,我们就是使用它来制作Nine-Patch图片的。双击打开之后,在导航栏点击File→Open 9-patch将xxx.png加载进来。
          我们可以在图片的四个边框绘制一个个的小黑点,在上边框和左边框绘制的部分就表示当图片需要拉伸时就拉伸黑点标记的区域,在下边框和右边框绘制的部分则表示内容会被放置的区域。

         如下图所示:

          完成后,最后保存为"xxx.9.png",这样就完成了,然后将其放入到button的background中或者xml自定义的属性中。

注意:.9图只能通过背景设置拉伸,如果用src方式设置只会当作普通图片处理


在android5.0新增了ripple(水波纹)的效果,他可以运用到Button,ImageButton,TextView,以及一些布局容器。


首先,我们看Android:Theme.Material.Light主题中设置的各种ripple效果属性的默认值:
1. <item name="selectableItemBackground">@drawable/item_background_material</item>  
2. <item name="selectableItemBackgroundBorderless">@drawable/item_background_borderless_material</item>  
3. <item name="borderlessButtonStyle">@style/Widget.Material.Light.Button.Borderless</item>  
4. <item name="buttonBarButtonStyle">@style/Widget.Material.Light.Button.ButtonBar.AlertDialog</item>  

1. selectableItemBackground在drawable文件中文件内容为:有边界的效果
<ripple xmlns:android="http://schemas.android.com/apk/res/android"  
    android:color="?attr/colorControlHighlight">  
    <item android:id="@id/mask">  
        <color android:color="@color/white" />  
    </item>  
</ripple>  


2. selectableItemBackgroundBorderless在drawable文件中文件内容为:无边界的效果(需要api21以上)
<ripple xmlns:android="http://schemas.android.com/apk/res/android"  
    android:color="?attr/colorControlHighlight" />  


3. borderlessButtonStyle最后引用的style就是如下:
<!-- Borderless ink button -->  
    <style name="Widget.Material.Button.Borderless">  
        <item name="background">@drawable/btn_borderless_material</item>  
        <item name="stateListAnimator">@null</item>  
    </style>  
他实际上就是设置了background的属性:
<ripple xmlns:android="http://schemas.android.com/apk/res/android"  
        android:color="?attr/colorControlHighlight">  
    <item android:id="@id/mask"  
          android:drawable="@drawable/btn_default_mtrl_shape" />  
</ripple>  
4. buttonBarButtonStyle实际上也是调用了borderlessButtonStyle的style,就是也是调用了相同的background:
<!-- Borderless ink button -->  
   <style name="Widget.Material.Button.Borderless">  
       <item name="background">@drawable/btn_borderless_material</item>  
       <item name="stateListAnimator">@null</item>  
   </style>  
  
   <!-- Colored borderless ink button -->  
   <style name="Widget.Material.Button.Borderless.Colored">  
       <item name="textColor">?attr/colorAccent</item>  
       <item name="stateListAnimator">@anim/disabled_anim_material</item>  
   </style>  


前两种在xml中设置background即可,如:
android:background="?android:selectableItemBackground"  


后两种在xml中设置style即可,如:
style="?android:buttonBarButtonStyle"  

<item name="buttonBarButtonStyle">@style/Widget.Material.Light.Button.ButtonBar.AlertDialog</item>  
 ———————————————— 
版权声明:本文为CSDN博主「_ext」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/hard_working1/article/details/77333893

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值