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

TabRadioButton for Android

APP开发中，底部菜单常用RadioButton来实现切换，但使用系统自带的RadioButton的话，你会发现图片和文字并无彻底居中，因而就有了TabRadioButton。

TabRadioButton只对 drawableLeft 和drawableTop方向上的图片作了居中处理（这两个方向通常用的比较多）

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

Preview

Download

Gradle:

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

or Maven:

<dependency>
  <groupId>com.zaaach</groupId>
  <artifactId>tabradiobutton</artifactId>
  <version>1.0.1</version>
  <type>pom</type>
</dependency>
复制代码

How to use

1. TabRadioButton 添加图片时要用drawableLeft 或 drawableTop 这两个属性~
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"/>
  	<!-- drawable大小 -->
        <attr name="trb_drawable_size" format="dimension"/>
</declare-styleable>
复制代码

@style/TabRadioButtonWithText 内容以下：

<style name="TabRadioButtonWithText"> <item name="android:layout_width">0dp</item> <item name="android:layout_height">match_parent</item> <item name="android:layout_weight">1</item> <item name="android:button">@null</item> <item name="android:background">@null</item> <item name="android:textSize">12sp</item> <item name="android:textColor">@drawable/tab_text_color_selector</item> <item name="android:drawablePadding">2dp</item> </style>
复制代码

Try it

:wink:

下载地址

github.com/zaaach/TabR… 若是你喜欢TabRadioButton，记得给个Star支持一下！