【TabRadioButton】图片文字会居中的RadioButton,自带缩放效果

TabRadioButton for Android

APP开发中,底部菜单经常使用RadioButton来实现切换,但使用系统自带的RadioButton的话,你会发现图片和文字并没有完全居中,于是就有了TabRadioButton。

TabRadioButton只对 drawableLeftdrawableTop方向上的图片做了居中处理(这两个方向一般用的比较多)

  • 图片和文字居中
  • 可指定drawable的大小
  • 自带缩放动画效果,手指按下和松开时触发(需要开启)

Preview

Download

Gradle:

compile 'com.zaaach:tabradiobutton:1.0.1'
复制代码

or Maven:

<dependency>
  <groupId>com.zaaachgroupId>
  <artifactId>tabradiobuttonartifactId>
  <version>1.0.1version>
  <type>pomtype>
dependency>
复制代码

How to use

  1. TabRadioButton 添加图片时要用drawableLeftdrawableTop 这两个属性~
  2. 若需要动画效果,添加一行属性 trb_enable_animation="true" 即可启用缩放动画效果
<RadioGroup
     style="@style/TabRadioGroup">
     <com.zaaach.tabradiobutton.TabRadioButton
      	style="@style/TabRadioButtonWithText"
      	android:drawableTop="@drawable/tab_contact_icon_selector"
      	app:trb_enable_animation="true"
      	app:trb_drawable_size="24dp"
      	app:trb_scale_rate="0.8"
      	app:trb_duration="200"/>
RadioGroup>
复制代码

attrs.xml 自定义的属性:

<declare-styleable name="TabRadioButton">
  	
        <attr name="trb_enable_animation" format="boolean"/>
  	
        <attr name="trb_duration" format="integer"/>
  	
        <attr name="trb_scale_rate" format="float"/>
  	
        <attr name="trb_drawable_size" format="dimension"/>
declare-styleable>
复制代码

@style/TabRadioButtonWithText 内容如下:

<style name="TabRadioButtonWithText">
        <item name="android:layout_width">0dpitem>
        <item name="android:layout_height">match_parentitem>
        <item name="android:layout_weight">1item>
        <item name="android:button">@nullitem>
        <item name="android:background">@nullitem>
        <item name="android:textSize">12spitem>
        <item name="android:textColor">@drawable/tab_text_color_selectoritem>
        <item name="android:drawablePadding">2dpitem>
style>
复制代码

Try it

:wink:

下载地址

github.com/zaaach/TabR… 如果你喜欢TabRadioButton,记得给个Star支持一下!

你可能感兴趣的:(【TabRadioButton】图片文字会居中的RadioButton,自带缩放效果)