关闭

Android开源项目——设置图文居中的按钮 IconButton

标签: IconButton图文居中的按钮图文居中的Button
7877人阅读 评论(6) 收藏 举报
分类:

本文介绍一下一个小众的开源项目——IconButton。

本文原创,转载请注明出处:

http://blog.csdn.net/maosidiaoxian/article/details/43560209

简介

这是一个老外两年前写的项目,见:https://github.com/pnc/IconButton。它可以使一个Button的图片与文字一起居中,如下图:


以前要实现这种效果却是用一个Layout和一个ImageView一个TextView来实现它的同学,看到这个项目的这一刻,满满的感动有木有?

扩展

为方便在项目中使用,及实现项目里的其它需求,我fork了此项目,对它进行了修改和扩展,并发布到jCenter中。另外,表示老外真的很友好。

为实现设计师设计的界面,我对它的扩展如下:

1.扩展了居中策略。原来的IconButton中,是图片、图片与文字的间距和文字一起居中的。我扩展为默认是这三个一起居中,但也可以设置为仅文字居中或者文字与间距居中。

2.增加了IconCheckBox。这主要是为实现下图中的效果:

在上图中,文字是要居中的,而小箭头则在它旁边,并且小箭头与文字有一定的间距。
我的项目地址为:https://github.com/msdx/IconButton。扩展的内容见develop分支。

使用

对于使用Gradle 构建的Android Studio项目,使用方式很简单,先确定你在根项目的build.gradle中声明了JCenter中央仓:
repositories {
    jcenter()
}

然后在模块中的build.gradle中添加此依赖:
dependencies {
    compile 'com.githang:com-phillipcalvin-iconbutton:2.0.2'
}

对于Eclipse项目,且不是用Gradle构建的,那就乖乖地拷贝代码或导入项目吧。

接下来,只要在布局文件中用这个IconButton或IconCheckBox就可以了,代码如下:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"

<!-- ... -->

  <com.phillipcalvin.iconbutton.IconButton
      android:id="@+id/search"
      android:drawableLeft="@drawable/action_search"
      android:text="@string/search"
      app:iconPadding="10dp" />

其中的iconPadding是图片与文字的间距。
其它扩展使用见项目中的app模块的代码。
1
1
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

重写Button实现图片drawableTop和文字一起居中

很多情况下我们都希望使用android:drawableTop等相关标签就可以使得Button中的文字和图片居中,本篇博文来说一下居中的实现方法和原理
  • dreamInTheWorld
  • dreamInTheWorld
  • 2015-04-24 10:46
  • 4358

Android Button图片和文字都居左,且有一点间距

Android Button图片和文字都居左,且有一点间距              在做项目时需要button上面的文字和图片都居左,但网上一直找不到文字居左...
  • u010507199
  • u010507199
  • 2015-07-29 15:15
  • 5491

给Android按钮添加图标

Boss让我做一个APP的界面美化。我
  • levelmini
  • levelmini
  • 2014-06-26 15:10
  • 3865

android 给button 设置做图标注意

Drawable img_focus = mContext.getResources().getDrawable(R.drawable.ic_has_focus); // 调用setCom...
  • wwdlss
  • wwdlss
  • 2016-07-22 17:46
  • 916

Android : 自定义带箭头的Button

自定义带箭头的Button
  • doris_d
  • doris_d
  • 2015-05-07 23:32
  • 2295

Android:DropPopMenu — 显示位置跟随操作按钮显示的带箭头的弹出菜单

DropPopMenu 显示位置跟随操作按钮显示的带箭头的弹出菜单 一,介绍 本项目是对带箭头的下拉弹出菜单进行了封装,使用简单,同时有如下特点: 1、可以动态修改菜单的背景; ...
  • HMYANG314
  • HMYANG314
  • 2017-04-28 17:13
  • 1007

Android UI之ImageButton(带图标的按钮)

除了Android系统自带的Button按钮一万,还提供了带图标的按钮ImageButton   要制作带图标的按钮,首先要在布局文件中定义ImageButton,然后通过setImage...
  • cswhale
  • cswhale
  • 2014-08-16 14:50
  • 4618

实现Button按钮上放置icon或者其他的小图标!!怎么居中显示!!

有时候我们做开发时候,需要Button上显示小图标例如: 但是呢 button 呢 本身已经设置了 Background了,如果你想设置一个图标,需要这么做了 用:  android...
  • tenggangren
  • tenggangren
  • 2013-03-20 14:30
  • 2603

自定义控件让TextView、Button的drawableLeft和drawableRight与文本一起居中显示

TextView的drawableLeft、drawableRight和drawableTop是一个常用、好用的属性,可以在文本的上下左右放置一个图片,而不使用更加复杂布局就能达到,我也常常喜欢用Ra...
  • catoop
  • catoop
  • 2014-04-17 17:23
  • 18534

android 实现上面图标 下面文字,触摸时背景改变的按钮

android 实现上面图标 下面文字,触摸时背景改变的按钮
  • ifadai
  • ifadai
  • 2016-12-22 16:10
  • 1627
    个人资料
    • 访问:2127808次
    • 积分:14222
    • 等级:
    • 排名:第1011名
    • 原创:139篇
    • 转载:0篇
    • 译文:89篇
    • 评论:891条
    欢迎访问我的博客
    个人博客:http://githang.com
    QQ群
    博客专栏
    最新评论
    我的公众号
    微信关注我的公众号
    站长统计