转载请注明出处：王亟亟的大牛之路
我们平时自定义的一些Button通常是改改颜色啊，文本啊，圆角啊之类的。如果要做到再高级点就需要用一个大布局还拼接了，如果一个页面有很多样式不同的这样的按钮，还真不怎么好操作。
今天给大家上一个FancyButton能很好的帮助我们简化这些操作
项目结构：
只有一个类外加一些assets包下的字体文件或资源文件的一些Icon就能呈现以下效果：
首先先介绍下FancyButton这个类的一些重要的方法和实现：
继承LinearLayout根据我们的实际场景需要再判断为水平还是垂直的LinearLayout
public class FancyButton extends LinearLayout一系列的初始化操作和参数申明
private Context mContext;
// 初始化背景参数
private int mDefaultBackgroundColor = Color.BLACK;
private int mFocusBackgroundColor = 0;
//初始化字体参数
private int mDefaultTextColor = Color.WHITE;
private int mDefaultIconColor = Color.WHITE;
private int mTextPosition = 1;
private int mDefaultTextSize = 15;
private int mDefaultTextGravity = 0x11; // Gravity.CENTER
private String mText = null;
// 初始化Icon参数
private Drawable mIconResource = null;
private int mFontIconSize = 15;
private String mFontIcon = null;
private int mIconPosition = 1;
private int mIconPaddingLeft = 10;
private int mIconPaddingRight = 10;
private int mIconPaddingTop = 0;
private int mIconPaddingBottom = 0;
private int mBorderColor = Color.TRANSPARENT;
private int mBorderWidth = 0;
private int mRadius = 0;
private Typeface mTextTypeFace = null;
private Typeface mIconTypeFace = null;
/**
* 标识图标位置的标记
*/
public static final int POSITION_LEFT = 1;
public static final int POSITION_RIGHT = 2;
public static final int POSITION_TOP = 3;
public static final int POSITION_BOTTOM = 4;
//默认字体
private String mDefaultIconFont = "fontawesome.ttf";
private String mDefaultTextFont = "robotoregular.ttf";
private ImageView mIconView;
private TextView mFontIconView;
private TextView mTextView;
构造函数
/**
* 默认构造函数
* @param context : Context
*/
public FancyButton(Context context){
super(context);
this.mContext = context;
mTextTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", mDefaultTextFont));
mIconTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", mDefaultIconFont));
initializeFancyButton();
}
/**
* 默认构造函数调用布局
* @param context : Context
* @param attrs : Attributes Array
*/
public FancyButton(Context context, AttributeSet attrs){
super(context,attrs);
this.mContext = context;
TypedArray attrsArray = context.obtainStyledAttributes(attrs,R.styleable.FancyButtonsAttrs, 0, 0);
initAttributsArray(attrsArray);
attrsArray.recycle();
initializeFancyButton();
}对一些控件所需的素材进行初始化操作
/**
* 各种初始化
*/
private void initializeFancyButton(){
initializeButtonContainer();
mTextView = setupTextView();
mIconView = setupIconView();
mFontIconView = setupFontIconView();
int iconIndex,textIndex;
View view1,view2;
if(mIconView == null && mFontIconView == null && mTextView == null){
Button tempTextView = new Button(mContext);
tempTextView.setText("Fancy Button");
this.addView(tempTextView);
}else{
this.removeAllViews();
setupBackground();
ArrayList<View> views = new ArrayList<>();
if(mIconPosition == POSITION_LEFT || mIconPosition == POSITION_TOP){
if(mIconView != null){
views.add(mIconView);
}
if(mFontIconView != null){
views.add(mFontIconView);
}
if(mTextView != null){
views.add(mTextView);
}
}else{
if(mTextView != null){
views.add(mTextView);
}
if(mIconView != null){
views.add(mIconView);
}
if(mFontIconView != null){
views.add(mFontIconView);
}
}
for(View view : views){
this.addView(view);
}
}
} /**
* 设置文本视图
* @return : TextView
*/
private TextView setupTextView(){
if (mText != null) {
TextView textView = new TextView(mContext);
textView.setText(mText);
textView.setGravity(mDefaultTextGravity);
textView.setTextColor(mDefaultTextColor);
textView.setTextSize(mDefaultTextSize);
textView.setLayoutParams(new TableLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT, 1f));
if (!isInEditMode() && mTextTypeFace!=null) {
textView.setTypeface(mTextTypeFace);
}
return textView;
}
return null;
}
/**
* 设置字体图标视图
* @return : TextView
*/
private TextView setupFontIconView(){
if(mFontIcon!=null){
TextView fontIconView = new TextView(mContext);
fontIconView.setTextColor(mDefaultIconColor);
LayoutParams iconTextViewParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT,1f);
iconTextViewParams.rightMargin = mIconPaddingRight;
iconTextViewParams.leftMargin = mIconPaddingLeft;
iconTextViewParams.topMargin = mIconPaddingTop;
iconTextViewParams.bottomMargin = mIconPaddingBottom;
if(mTextView != null){
if(mIconPosition==POSITION_TOP || mIconPosition==POSITION_BOTTOM){
iconTextViewParams.gravity = Gravity.CENTER;
fontIconView.setGravity(Gravity.CENTER);
}
else{
fontIconView.setGravity(Gravity.CENTER_VERTICAL);
iconTextViewParams.gravity = Gravity.CENTER_VERTICAL;
}
}else{
iconTextViewParams.gravity = Gravity.CENTER;
fontIconView.setGravity(Gravity.CENTER_VERTICAL);
}
fontIconView.setLayoutParams(iconTextViewParams);
if(!isInEditMode()){
fontIconView.setTextSize(mFontIconSize);
fontIconView.setText(mFontIcon);
fontIconView.setTypeface(mIconTypeFace);
}else{
fontIconView.setText("O");
}
return fontIconView;
}
return null;
}
/**
* 文本图标资源视图
* @return : ImageView
*/
private ImageView setupIconView(){
if (mIconResource != null){
ImageView iconView = new ImageView(mContext);
iconView.setImageDrawable(mIconResource);
iconView.setPadding(mIconPaddingLeft, mIconPaddingTop, mIconPaddingRight, mIconPaddingBottom);
LayoutParams iconViewParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
if(mTextView!=null){
if(mIconPosition==POSITION_TOP || mIconPosition==POSITION_BOTTOM)
iconViewParams.gravity = Gravity.CENTER;
else
iconViewParams.gravity = Gravity.START;
iconViewParams.rightMargin = 10;
iconViewParams.leftMargin = 10;
}else{
iconViewParams.gravity = Gravity.CENTER_VERTICAL;
}
iconView.setLayoutParams(iconViewParams);
return iconView;
}
return null;
}
/**
* 初始化属性数组
* @param attrsArray : Attributes array
*/
private void initAttributsArray(TypedArray attrsArray){
mDefaultBackgroundColor = attrsArray.getColor(R.styleable.FancyButtonsAttrs_defaultColor,mDefaultBackgroundColor);
mFocusBackgroundColor = attrsArray.getColor(R.styleable.FancyButtonsAttrs_focusColor,mFocusBackgroundColor);
mDefaultTextColor = attrsArray.getColor(R.styleable.FancyButtonsAttrs_textColor,mDefaultTextColor);
// if default color is set then the icon's color is the same (the default for icon's color)
mDefaultIconColor = attrsArray.getColor(R.styleable.FancyButtonsAttrs_iconColor,mDefaultTextColor);
mDefaultTextSize = (int) attrsArray.getDimension(R.styleable.FancyButtonsAttrs_textSize,mDefaultTextSize);
mDefaultTextGravity = attrsArray.getInt(R.styleable.FancyButtonsAttrs_textGravity, mDefaultTextGravity);
mBorderColor = attrsArray.getColor(R.styleable.FancyButtonsAttrs_borderColor,mBorderColor);
mBorderWidth = (int) attrsArray.getDimension(R.styleable.FancyButtonsAttrs_borderWidth,mBorderWidth);
mRadius = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_radius,mRadius);
mFontIconSize = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_fontIconSize,mFontIconSize);
mIconPaddingLeft = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_iconPaddingLeft,mIconPaddingLeft);
mIconPaddingRight = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_iconPaddingRight,mIconPaddingRight);
mIconPaddingTop = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_iconPaddingTop,mIconPaddingTop);
mIconPaddingBottom = (int)attrsArray.getDimension(R.styleable.FancyButtonsAttrs_iconPaddingBottom,mIconPaddingBottom);
String text = attrsArray.getString(R.styleable.FancyButtonsAttrs_text);
mIconPosition = attrsArray.getInt(R.styleable.FancyButtonsAttrs_iconPosition,mIconPosition);
String fontIcon = attrsArray.getString(R.styleable.FancyButtonsAttrs_fontIconResource);
String iconFontFamily = attrsArray.getString(R.styleable.FancyButtonsAttrs_iconFont);
String textFontFamily = attrsArray.getString(R.styleable.FancyButtonsAttrs_textFont);
Drawable icon = null;
try{
mIconResource = attrsArray.getDrawable(R.styleable.FancyButtonsAttrs_iconResource);
}catch(Exception e){
mIconResource = null;
}
if(fontIcon!=null)
mFontIcon = fontIcon;
if(text!=null)
mText = text;
if(!isInEditMode()){
if(iconFontFamily!=null){
try{
mIconTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", iconFontFamily));
}catch(Exception e){
Log.e("Fancy", e.getMessage());
mIconTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", mDefaultIconFont));
}
}else{
mIconTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", mDefaultIconFont));
}
if(textFontFamily!=null){
try{
mTextTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", textFontFamily));
}
catch(Exception e){
mTextTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", mDefaultTextFont));
}
}else{
mTextTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", mDefaultTextFont));
}
}
}
@SuppressLint("NewApi")
private void setupBackground(){
// 默认Drawable
GradientDrawable drawable = new GradientDrawable();
drawable.setCornerRadius(mRadius);
drawable.setColor(mDefaultBackgroundColor);
if (mBorderColor != 0) {
drawable.setStroke(mBorderWidth, mBorderColor);
}
// 焦点/按下 Drawable
GradientDrawable drawable2 = new GradientDrawable();
drawable2.setCornerRadius(mRadius);
drawable2.setColor(mFocusBackgroundColor);
if (mBorderColor != 0) {
drawable2.setStroke(mBorderWidth, mBorderColor);
}
StateListDrawable states = new StateListDrawable();
if(mFocusBackgroundColor!=0){
states.addState(new int[] { android.R.attr.state_pressed }, drawable2);
states.addState(new int[] { android.R.attr.state_focused }, drawable2);
}
states.addState(new int[] {}, drawable);
if(android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.JELLY_BEAN) {
this.setBackgroundDrawable(states);
} else {
this.setBackground(states);
}
}
/**
* 初始化按钮的容器
*/
private void initializeButtonContainer(){
if(mIconPosition == POSITION_TOP || mIconPosition == POSITION_BOTTOM){
this.setOrientation(LinearLayout.VERTICAL);
}else{
this.setOrientation(LinearLayout.HORIZONTAL);
}
LayoutParams containerParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
this.setLayoutParams(containerParams);
this.setGravity(Gravity.CENTER_VERTICAL);
this.setClickable(true);
this.setFocusable(true);
if(mIconResource==null && mFontIcon==null && getPaddingLeft()==0 && getPaddingRight()==0 && getPaddingTop()==0 && getPaddingBottom()==0){
this.setPadding(20, 20, 20, 20);
}
}
/**
* 设置文字内容
* @param text : Text
*/
public void setText(String text){
this.mText = text;
if(mTextView == null)
initializeFancyButton();
else
mTextView.setText(text);
}
/**
* 设置文字颜色
* @param color : Color
* use Color.parse('#code')
*/
public void setTextColor(int color){
this.mDefaultTextColor = color;
if(mTextView == null)
initializeFancyButton();
else
mTextView.setTextColor(color);
}
/**
* 设置图标的颜色独立于文本颜色
* @param color : Color
*/
public void setIconColor(int color){
if(mFontIconView != null) {
mFontIconView.setTextColor(color);
}
}
/**
* 设置背景颜色
* @param color : use Color.parse('#code')
*/
public void setBackgroundColor(int color){
this.mDefaultBackgroundColor = color;
if(mIconView != null || mFontIconView != null || mTextView != null){
this.setupBackground();
}
}
/**
* 设置焦点时按钮的颜色
* @param color : use Color.parse('#code')
*/
public void setFocusBackgroundColor(int color){
this.mFocusBackgroundColor = color;
if(mIconView != null || mFontIconView != null || mTextView != null)
this.setupBackground();
}
/**
* 设置文字的大小
* @param textSize : Text Size
*/
public void setTextSize(int textSize){
this.mDefaultTextSize = textSize;
if(mTextView != null)
mTextView.setTextSize(textSize);
}
/**
* 设置文本重力位置
* @param gravity : Text Gravity
*/
public void setTextGravity(int gravity) {
this.mDefaultTextGravity = gravity;
if (mTextView != null) {
mTextView.setGravity(gravity);
}
}
/**
* 设置间距
* @param paddingLeft : Padding Left
* @param paddingTop : Padding Top
* @param paddingRight : Padding Right
* @param paddingBottom : Padding Bottom
*/
public void setIconPadding(int paddingLeft, int paddingTop, int paddingRight, int paddingBottom){
this.mIconPaddingLeft = paddingLeft;
this.mIconPaddingTop = paddingTop;
this.mIconPaddingRight = paddingRight;
this.mIconPaddingBottom = paddingBottom;
if(mIconView != null){
mIconView.setPadding(this.mIconPaddingLeft, this.mIconPaddingTop, this.mIconPaddingRight, this.mIconPaddingBottom);
}
if(mFontIconView != null){
mFontIconView.setPadding(this.mIconPaddingLeft, this.mIconPaddingTop, this.mIconPaddingRight, this.mIconPaddingBottom);
}
}
/**
* 设置icon来自于资源文件
* @param drawable : Drawable resource
*/
public void setIconResource(int drawable){
this.mIconResource = mContext.getResources().getDrawable(drawable);
if(mIconView == null || mFontIconView != null) {
mFontIconView= null;
initializeFancyButton();
}
else
mIconView.setImageDrawable(mIconResource);
}
/**
* 设置一种字符作为Icon图
* @param icon : Icon value eg : \uf082
*/
public void setIconResource(String icon){
this.mFontIcon = icon;
if(mFontIconView == null) {
mIconView=null;
initializeFancyButton();
}
else
mFontIconView.setText(icon);
}
/**
* 设置Icon尺寸(仅限字符Icon)
* @param iconSize : Icon Size
*/
public void setFontIconSize(int iconSize){
this.mFontIconSize = iconSize;
if(mFontIconView!=null)
mFontIconView.setTextSize(iconSize);
}
/**
* 设置图标位置
* 使用全局变量 (FancyButton.POSITION_LEFT, FancyButton.POSITION_RIGHT, FancyButton.POSITION_TOP, FancyButton.POSITION_BOTTOM)
* @param position : Position
*/
public void setIconPosition(int position){
if(position>0 && position<5)
mIconPosition = position;
else
mIconPosition = POSITION_LEFT;
initializeFancyButton();
}
/**
* 设置按钮边框的颜色
* @param color : Color
* use Color.parse('#code')
*/
public void setBorderColor(int color){
this.mBorderColor = color;
if(mIconView!=null || mFontIconView!=null || mTextView!=null){
this.setupBackground();
}
}
/**
* 设置按钮的宽度
* @param width : Width
*/
public void setBorderWidth(int width){
this.mBorderWidth = width;
if(mIconView != null || mFontIconView != null || mTextView != null){
this.setupBackground();
}
}
/**
* 设置按钮的边框半径
* @param radius : Radius
*/
public void setRadius(int radius){
this.mRadius = radius;
if(mIconView != null || mFontIconView != null || mTextView != null){
this.setupBackground();
}
}
/**
* 设置按钮文本的自定义字体
* @param fontName : Font Name
* Place your text fonts in assets/fonts/
*/
public void setCustomTextFont(String fontName){
try{
mTextTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", fontName));
}catch(Exception e){
Log.e("FancyButtons", e.getMessage());
mTextTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("fonts/%s", mDefaultTextFont));
}
if(mTextView==null)
initializeFancyButton();
else
mTextView.setTypeface(mTextTypeFace);
}
/**
* 设置按钮图标的自定义字体
* @param fontName : Font Name
* Place your icon fonts in assets/iconfonts/
*/
public void setCustomIconFont(String fontName){
try{
mIconTypeFace = Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", fontName));
}catch(Exception e){
Log.e("FancyButtons", e.getMessage());
mIconTypeFace= Typeface.createFromAsset(mContext.getAssets(), String.format("iconfonts/%s", mDefaultIconFont));
}
if(mFontIconView == null)
initializeFancyButton();
else
mFontIconView.setTypeface(mIconTypeFace);
}
}
布局文件
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fancy="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
<LinearLayout
android:id="@+id/section1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/section_facebook"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3b5998"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="20dp" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_facebook_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="1dp"
fancy:defaultColor="#3b5998"
fancy:focusColor="#5577bd"
fancy:fontIconResource="@string/icon_like"
fancy:fontIconSize="10sp"
fancy:iconPosition="right"
fancy:radius="30dp"
fancy:text="Like my facebook page"
fancy:textColor="#FFFFFF"/>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_facebook_share"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="1dp"
fancy:defaultColor="#3b5998"
fancy:focusColor="#5577bd"
fancy:fontIconResource="@string/icon_share"
fancy:fontIconSize="10sp"
fancy:iconPosition="right"
fancy:iconPaddingLeft="20dp"
fancy:iconPaddingRight= "0dp"
fancy:radius="30dp"
fancy:text="Share the link"
fancy:textColor="#FFFFFF"/>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_facebook_follow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="1dp"
fancy:defaultColor="#3b5998"
fancy:focusColor="#5577bd"
fancy:fontIconResource="@string/icon_follow"
fancy:fontIconSize="10sp"
fancy:iconPosition="right"
fancy:radius="30dp"
fancy:text="Follow Mehdi Sakout"
fancy:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:id="@+id/section_socialnetworks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:gravity="center_horizontal"
android:minHeight="200dp"
android:orientation="vertical"
android:padding="20dp" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="15dp"
android:gravity="center" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#55acee"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/twitter"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:radius="30dp"
fancy:textColor="#FFFFFF" />
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_dropbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#007ee5"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/dropbox"
fancy:radius="30dp">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
</LinearLayout>
<LinearLayout
android:id="@+id/sn_pos2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="15dp"
android:gravity="center"
android:orientation="horizontal" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_instagram"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#3f729b"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/instagram"
fancy:radius="30dp">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_sound"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#ff8800"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/soundcloud"
fancy:radius="30dp">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
</LinearLayout>
<LinearLayout
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="horizontal" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_gplus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#dd4b39"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/gplus"
fancy:radius="30dp">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_facebook"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:padding="10dp"
fancy:defaultColor="#000000"
fancy:iconPaddingLeft="0dp"
fancy:iconPaddingRight="0dp"
fancy:focusColor="#313131"
fancy:iconResource="@drawable/github"
fancy:radius="30dp" >
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/section_spotify"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#222326"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="20dp" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_spotify"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:defaultColor="#7ab800"
fancy:focusColor="#9bd823"
fancy:fontIconResource=""
fancy:iconPosition="left"
fancy:radius="30dp"
fancy:text="SHUFFLE PLAY"
fancy:textColor="#FFFFFF" />
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_spotify_pause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:defaultColor="#7ab800"
fancy:focusColor="#9bd823"
fancy:fontIconResource=""
fancy:iconPosition="left"
fancy:radius="30dp"
fancy:text="PAUSE"
fancy:textColor="#FFFFFF" />
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_spotify_follow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:defaultColor="#222326"
fancy:focusColor="#424243"
fancy:radius="30dp"
fancy:text="FOLOW"
fancy:borderColor="#88898c"
fancy:borderWidth="1dp"
fancy:textColor="#dfe0d9" />
</LinearLayout>
<LinearLayout
android:id="@+id/section_twitter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#55acee"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="20dp" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_twitter_follow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:padding="5dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="2dp"
fancy:defaultColor="#55acee"
fancy:focusColor="#8cc9f8"
fancy:iconPaddingLeft="40dp"
fancy:iconResource="@drawable/twitter"
fancy:text="Follow me on Twitter"
fancy:textColor="#FFFFFF"/>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_twitter_followers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="2dp"
fancy:defaultColor="#55acee"
fancy:focusColor="#8cc9f8"
fancy:fontIconResource="@string/icon_user"
fancy:fontIconSize="10sp"
fancy:iconPosition="top"
fancy:text="2145 followers"
fancy:textColor="#FFFFFF"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff5f69"
android:gravity="center"
android:paddingBottom="30dp"
android:paddingTop="30dp" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_create_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="1dp"
fancy:defaultColor="#ff5f69"
fancy:focusColor="#ff838b"
fancy:radius="30dp"
fancy:text="Create an account"
fancy:textColor="#FFFFFF" >
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="1dp"
fancy:defaultColor="#ff5f69"
fancy:focusColor="#ff838b"
fancy:fontIconResource="@string/icon_user"
fancy:iconPosition="left"
fancy:radius="30dp"
fancy:text="Login"
fancy:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:padding="20dp"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="2dp"
fancy:defaultColor="#3b414f"
fancy:focusColor="#8cc9f8"
fancy:fontIconResource="@string/icon_download"
fancy:fontIconSize="10sp"
fancy:iconPosition="top"
fancy:radius="10dp"
fancy:text="Download the file"
fancy:textColor="#FFFFFF">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_upload"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="2dp"
fancy:defaultColor="#3b414f"
fancy:focusColor="#8cc9f8"
fancy:fontIconResource="@string/icon_upload"
fancy:fontIconSize="10sp"
fancy:radius="10dp"
fancy:iconPosition="bottom"
fancy:text="Upload"
fancy:textColor="#FFFFFF">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_twitter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="2dp"
fancy:defaultColor="#40a75a"
fancy:focusColor="#8cc9f8"
fancy:fontIconResource="@string/icon_user"
fancy:fontIconSize="15sp"
fancy:iconPosition="left"
fancy:text="Send"
fancy:radius="10dp"
fancy:textColor="#FFFFFF">
</fancybuttons.wjj.com.fancybuttonsdemo.FancyButton>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_decline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:padding="10dp"
fancy:borderColor="#FFFFFF"
fancy:borderWidth="0dp"
fancy:defaultColor="#d86262"
fancy:focusColor="#2e5071"
fancy:fontIconResource="@string/icon_mute"
fancy:fontIconSize="10dp"
fancy:iconPosition="right"
fancy:radius="30dp"
fancy:text="Mute"
fancy:textColor="#ffffff" />
<fancybuttons.wjj.com.fancybuttonsdemo.FancyButton
android:id="@+id/btn_answer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:gravity="right"
android:padding="10dp"
fancy:defaultColor="#7ed862"
fancy:focusColor="#2e5071"
fancy:fontIconResource="@string/icon_answer"
fancy:fontIconSize="10dp"
fancy:iconPosition="right"
fancy:radius="30dp"
fancy:text="Answer the call"
fancy:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
MainActivity补贴了，什么代码都没写，自动生成的一个Activity.
所有的一系列你所需的一些格式要求都可以在XML文件内预设，如果需要用代码编写就只需要调用上面的一些列Set方法就可以了。
源码地址：http://yunpan.cn/cmy8gXMhNr8Zj 访问密码 a74d
