FancyButtons一个漂亮的按钮库

按钮库"/>

FancyButtons一个漂亮的按钮库

 转自：.html

 

 

一个功能强大且全面的按钮控件，是目前我见过的最好使的按钮。

支持给按钮添加图标，并且可通过属性设置手指按钮的效果，不需要在写<selector>文件。

项目地址：

 

 

如何添加到工程中：

1. 导入控件源码

2.导入控件属性文件attrs.xml

01. <?xml version="1.0" encoding="utf-8"?> 02. <resources> 03. <declare-styleable name="FancyButtonsAttrs"> 04. <attr name="fb_defaultColor" format="color"  /> 05. <attr name="fb_text" format="string"  /> 06.   07. <attr name="fb_textColor" format="color"  /> 08. <attr name="fb_iconColor" format="color"  /> 09.   10. <attr name="fb_textFont" format="string"  /> 11. <attr name="fb_iconFont" format="string"  /> 12.   13. <attr name="fb_textSize" format="dimension"  /> 14. <attr name="fb_iconResource" format="integer"  /> 15. <attr name="fb_fontIconResource" format="string"  /> 16. <attr name="fb_fontIconSize" format="dimension"  /> 17. <attr name="fb_iconPosition" format="enum"> 18. <enum name="left" value="1" /> 19. <enum name="right" value="2" /> 20. <enum name="top" value="3" /> 21. <enum name="bottom" value="4" /> 22. </attr> 23.   24. <attr name="fb_textPosition" format="enum"> 25. <enum name="left" value="1" /> 26. <enum name="right" value="2" /> 27. <enum name="top" value="3" /> 28. <enum name="bottom" value="4" /> 29. </attr> 30.   31. <attr name="fb_textGravity" format="enum"> 32. <enum name="top" value="0x30" /> 33. <enum name="bottom" value="0x50" /> 34. <enum name="left" value="0x03" /> 35. <enum name="right" value="0x05" /> 36. <enum name="center_vertical" value="0x10" /> 37. <enum name="fill_vertical" value="0x70" /> 38. <enum name="center_horizontal" value="0x01" /> 39. <enum name="fill_horizontal" value="0x07" /> 40. <enum name="center" value="0x11" /> 41. <enum name="fill" value="0x77" /> 42. <enum name="clip_vertical" value="0x80" /> 43. <enum name="clip_horizontal" value="0x08" /> 44. <enum name="start" value="0x00800003" /> 45. <enum name="end" value="0x00800005" /> 46. </attr> 47.   48. <attr name="fb_iconPaddingLeft" format="dimension" /> 49. <attr name="fb_iconPaddingRight" format="dimension" /> 50. <attr name="fb_iconPaddingTop" format="dimension" /> 51. <attr name="fb_iconPaddingBottom" format="dimension" /> 52.   53. <attr name="fb_borderColor" format="color" /> 54. <attr name="fb_borderWidth" format="dimension"/> 55. <attr name="fb_focusColor" format="color" /> 56. <attr name="fb_radius" format="dimension" /> 57.   58. <attr name="fb_ghost" format="boolean"></attr> 59. </declare-styleable> 60.   61. </resources>

属性很强大呀！

3.导入assets资源文件，包含俩个文件夹：fonts、iconfonts。

ok，接下来就可以使用控件了。

 

如何使用：

1. 布局文件中添加命名空间，这是使用自定义控件必须要做的。

1. xmlns:fancy=""

如下图：

 

2. 创建控件

01. <mehdi.sakout.fancybuttons.FancyButton android:layout_width="wrap_content" android:layout_height="wrap_content" 02. fancy:fb_text="Create an account" 03. fancy:fb_textColor="#FFFFFF" 04. fancy:fb_radius="30dp" 05. fancy:fb_defaultColor="#ff5f69" 06. fancy:fb_focusColor="#ff838b" 07. fancy:fb_borderWidth="1dp" 08. fancy:fb_borderColor="#FFFFFF" 09. />

完整的实例可以点击上面的"下载源码"按钮，那是我做的demo。

 

接下来介绍下他的强大属性。

属性：

XML布局文件中使用	Java代码中使用	描述
fancy:fb_text	setText(String)	按钮上文字
fancy:fb_textColor	setTextColor(int)	按钮文字的颜色
fancy:fb_textSize	setTextSize(int)	文字的大小
fancy:fb_textFont	setCustomTextFont(String)	文字的字体
fancy:fb_textGravity	setTextGravity(Int)	文字的对其方式
fancy:fb_iconResource	setIconResource(Drawable)	设置按钮上的图标，引用的是个图片
fancy:fb_iconPosition	setsetIconPosition(int)	图标相对于文字的位置，有如下值 : Left, Right, Top, Bottom
fancy:fb_fontIconResource	setIconResource(String)	和fancy:fb_iconResource一样，也是设置按钮图标的，只是这里引用的是个图标的编码，如：""是下载图标，""是上传图标。实际的原理是将编码设置到TextView上了。
fancy:fb_fontIconSize	setFontIconSize(int)	设置以fancy:fb_fontIconResource方式设置的图标的图标大小。
fancy:fb_iconFont	setCustomIconFont(String)	设置以fancy:fb_fontIconResource方式设置的图标的图标字体
fancy:fb_borderWidth	setBorderWidth(int)	边框的宽度
fancy:fb_borderColor	setBorderColor(int)	边框的颜色
fancy:fb_defaultColor	setBackgroundColor(int)	手指未触碰时的背景颜色
fancy:fb_focusColor	setFocusBackgroundColor(int)	手指按下时的背景颜色
fancy:fb_radius	setRadius(int)	设置按钮为圆角的，该属性用于设置圆角的半径
fancy:fb_iconPaddingLeft	setIconPadding(int,int,int,int)	图标的左间距，一般用于设置图标与文字的距离
fancy:fb_iconPaddingRight	setIconPadding(int,int,int,int)	图标的右间距
fancy:fb_iconPaddingTop	setIconPadding(int,int,int,int)	图标的上间距
fancy:fb_iconPaddingBottom	setIconPadding(int,int,int,int)	图标的下间距
fancy:fb_ghost	setGhost(boolean)	是否为空洞效果，空洞效果时，按钮背景透明，触碰时只有边框会产生效果

 

 

FancyButtons一个漂亮按钮的库