FancyButtons一个漂亮的按钮库

 转自：http://www.mamicode.com/info-detail-1022375.html

 

 

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

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

项目地址：https://github.com/medyo/fancybuttons

 

 

如何添加到工程中：

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="http://schemas.android.com/apk/res-auto"

如下图：

 

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一个漂亮按钮的库