android自定义控件系列教程----真正的圆角button来了

前沿:

现在网上随便输入一句圆角button就会出现很多博客和文章提示做这样的一个效果,但是那多半都是xml文件来做的,这样做有个很大的弊端,因为每一次都需要重写xml文件(就连简简单单的修改个按钮的颜色也需要修改)。~~为什么呢?因为不修改臣妾做不到啊!!!今天就带大家做一个真正的圆角button,我们还是来看效果吧。

正文干货开始:

很明显我们的按钮的背景就是我们要实现的圆角部分,那么我们情不自禁的想到了setBackground这个方法,看看里面的参数,需要的是一个Drawable,而我们的按钮还需要点击不可用的圆角效果,所以我们很自然的想到了StateListDrawable这个类 ,而且还要是圆角效果,那么就还需要RoundRectShape这个类和ShapeDrawable这个类,如果这些类不熟悉的,那么我就简单的介绍一下这些类的作用。

StateListDrawable

主要用来添加和管理背景每个状态应该使用那个Drawable的类,需要注意的是的它里面的每个状态的管理。其实可以可以理解为一个hashmap每个状态对应一个值而已。

RoundRectShape

还记得我们需要一个圆角矩形吗?对这个类就是我们主要的画圆角矩形的类。但是要注意它的构造方法,到时候代码里面再讲。

ShapeDrawable

状态管理和形状都有了,那么我们的猪脚就要登场了,对就是ShapeDrawble它就是我们setBackground里面需要的Drawble啊。

好了,每个类的作用都介绍了那么我们就直接上代码吧。

import android.content.Context;
import android.content.res.ColorStateList;
import android.graphics.Color;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.StateListDrawable;
import android.graphics.drawable.shapes.RoundRectShape;
import android.view.Gravity;
import android.widget.Button;

/*
 * @FileName:StyleButton.java
 * @Version:V1.0
 * @Date: 2014-5-7 Create
 * @author: edsheng
 */
public class StyleButton extends Button
{
	public static int[]	mNormalState		= new int[] {};
	public static int[]	mPressState			= new int[] { android.R.attr.state_pressed, android.R.attr.state_enabled };
	public static int[]	mDisableState		= new int[] { -android.R.attr.state_enabled };
	public static int[]	mSelectedState		= new int[] { android.R.attr.state_selected, android.R.attr.state_enabled };
	private int			mRadius				= 0;																			//默认的圆角半径

	//默认文字和背景颜色
	private int			mBgNormalColor		= Color.RED;
	private int			mBgPressedColor		= Color.GREEN;
	private int			mTextNormalColor	= Color.WHITE;
	private int			mTextPressedColor	= Color.GRAY;

	public StyleButton(Context context)
	{
		super(context);
		initUI();
	}

	private void initUI()
	{
		setGravity(Gravity.CENTER);
		buildDraweableState();
		buildColorDrawableState();
	}

	/**
	 * 构建图片drawble
	 */
	private void buildColorDrawableState()
	{
		ColorStateList colorStateList = new ColorStateList(new int[][] { mPressState, mNormalState },
				new int[] { mTextPressedColor, mTextNormalColor });
		setTextColor(colorStateList);
	}

	/**
	 * 构建背景Drawble
	 */
	private void buildDraweableState()
	{

		float outRectr[] = new float[] { mRadius, mRadius, mRadius, mRadius, mRadius, mRadius, mRadius, mRadius };
		//创建状态管理器
		StateListDrawable drawable = new StateListDrawable();
		/**
		 * 注意StateListDrawable的构造方法我们这里使用的
		 * 是第一参数它是一个float的数组保存的是圆角的半径,它是按照top-left顺时针保存的八个值
		 */
		//创建圆弧形状
		RoundRectShape rectShape = new RoundRectShape(outRectr, null, null);
		//创建drawable
		ShapeDrawable pressedDrawable = new ShapeDrawable(rectShape);
		//设置我们按钮背景的颜色
		pressedDrawable.getPaint().setColor(mBgPressedColor);
		//添加到状态管理里面
		drawable.addState(mPressState, pressedDrawable);

		//		ShapeDrawable disableDrawable = new ShapeDrawable(rectShape);
		//		disableDrawable.getPaint().setColor(prssedClor);
		//		disableDrawable.getPaint().setAlpha(125);
		//		drawable.addState(mDisableState, disableDrawable);

		ShapeDrawable normalDrawable = new ShapeDrawable(rectShape);
		normalDrawable.getPaint().setColor(mBgNormalColor);
		drawable.addState(mNormalState, normalDrawable);
		//设置我们的背景,就是xml里面的selector
		setBackgroundDrawable(drawable);
	}

	/**
	 * 设置圆角矩形
	 *
	 * @param radius
	 */
	public void setRadius(int radius)
	{
		this.mRadius = radius;
		buildDraweableState();
	}

	/**
	 * 设置按钮背景颜色
	 *
	 * @param normalColor
	 * @param prssedClor
	 */
	public void setBgNormalPressedcolor(int normalColor, int prssedClor)
	{

		mBgNormalColor = normalColor;
		mBgPressedColor = prssedClor;
		buildDraweableState();

	}

	/**
	 * 设置按钮文字颜色
	 *
	 * @param normalColor
	 * @param pressedColor
	 */
	public void setTextNormalPressedcolor(int normalColor, int pressedColor)
	{
		mTextPressedColor = pressedColor;
		mTextNormalColor = normalColor;
		buildColorDrawableState();

	}
}

这样我们的圆角按钮就创建起来了。

看看我们怎么使用它吧。直接贴出oncrate函数。

requestWindowFeature(Window.FEATURE_NO_TITLE);
		LinearLayout linearLayout = new LinearLayout(this);
		linearLayout.setOrientation(LinearLayout.VERTICAL);

		LinearLayout.LayoutParams layoutParams = new LayoutParams(200, 200);
		layoutParams.bottomMargin = 20;

		LayoutParams commomlayoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
		commomlayoutParams.bottomMargin = 20;

		StyleButton button = new StyleButton(this);
		button.setText("按钮");
		linearLayout.addView(button, layoutParams);

		StyleButton button2 = new StyleButton(this);
		button2.setText("按钮");
		button2.setRadius(16);
		linearLayout.addView(button2, commomlayoutParams);

		StyleButton button3 = new StyleButton(this);
		button3.setText("按钮");
		button3.setRadius(32);
		button3.setTextNormalPressedcolor(Color.CYAN, Color.WHITE);
		button3.setBgNormalPressedcolor(Color.BLUE, Color.CYAN);
		linearLayout.addView(button3, commomlayoutParams);

		StyleButton button4 = new StyleButton(this);
		button4.setText("按钮");
		button4.setRadius(80);
		button4.setBgNormalPressedcolor(Color.GRAY, Color.CYAN);
		button4.setTextNormalPressedcolor(Color.RED, Color.WHITE);
		linearLayout.addView(button4, commomlayoutParams);

		StyleButton button5 = new StyleButton(this);
		button5 = new StyleButton(this);
		button5.setText("按钮");
		button5.setRadius(50);
		button5.setTextNormalPressedcolor(Color.BLACK, Color.BLUE);
		button5.setBgNormalPressedcolor(Color.WHITE, Color.CYAN);
		linearLayout.addView(button5, commomlayoutParams);

		StyleButton button6 = new StyleButton(this);
		button6.setText("按钮");
		button6.setRadius(50);
		button6.setTextNormalPressedcolor(Color.BLACK, Color.CYAN);
		button6.setBgNormalPressedcolor(Color.CYAN, Color.BLUE);
		LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
		params.leftMargin = 80;
		params.rightMargin = 80;
		linearLayout.addView(button6, params);

		StyleButton button7 = new StyleButton(this);
		button7.setText("按钮");
		button7.setRadius(80);
		linearLayout.addView(button7, layoutParams);

		setContentView(linearLayout);

是不是使用起来方便快捷呢?不管是换颜色还是换圆角半径这样我们就自定义好了,自己的一个圆角按钮。好了。拿去愉快的使用吧。

时间: 2025-01-09 07:27:48

android自定义控件系列教程----真正的圆角button来了的相关文章

android自定义控件系列教程----视图的测量和布局

前面说点什么 当我们的一个视图界面绘制在android屏幕上面的时候其实都必须经过这几步measure. layout.draw这几个阶段,我们可以在view类里面看到这几个函数,然后里面有几个函数是onmeasure.onlayout.ondraw这几个函数是我们重写控件需要注意的这几个函数,下面我们就来讲讲这几个函数的功能和作用. onMeasure 正如这个函数的名子一样就是测量,所有的图示其实系统在绘制之前都不知道它到底有多大的,所以在很多时候我们在初始化界面oncreate的时候直接去

android自定义控件系列教程----继承ViewGroup实现带阻力效果的可回弹的SrollView

前沿分析: 我为什么要想实现一个这样的回弹呢?因为android都没有支持回弹效果,只有个oversroll的回弹效果,其他的时候都是edgeeffect效果,当我们在哪个地方需要这样的回弹效果我们就直接把我们的控件往这个SrollVIew里面一扔就可以了.其他的都不用管. 主要用到的类讲解: Scroller,主要来辅助我们记录动画和滑动的类,VelocityTracker用来计算滑动阀值就是快速滑动的辅助类,用到的辅助类就这两个,其他的就是测量和布局还有事件的编写了. 效果图 里面的按钮是我

android自定义控件系列教程----视图

理解android视图 对于android设备我们所看到的区域其实和它在底层的绘制有着很大的关系,很多时候我们都只关心我们所看到的,那么在底层一点它到底是怎么样的一个东西呢?让我们先来看看这个图. 对于整个设备的可见区域而言其实就是我们中间的那个屏幕,从上面的拿个图可以清晰的看到,除了我们的可见区域在它的上下左右都应该有内容,那么在android系统中是怎么控制显示它的位置呢?下面我们来解答这个问题. android如何控制视图的显示位置 我们可以打开view类的源码找到这两个函数 /** *

android自定义控件系列教程-----touch事件的传递

前沿: 很久没有写过博客了,因为工作的原因很少有时间写东西了,最近想写一个UI系列的博客,因为我发现这一系列的都很少,而且没有那么系统,这里我想以我自己的观点来阐述一下如何自定义android 控件系列. 自定义控件阐述: 在我的理解里面自定义控件,需要了解到touch事件的传递.分发.拦截机制,Scroller类的运用,andorid 视图的理解,ViewGroup的熟悉,因为我们绝大多的控件都是继承自ViewGroup,还有就是要学会布局测量等. Touch事件的传递 首先我们要了解在and

android自定义控件系列教程-----仿新版优酷评论剧集卡片滑动控件

我们先来看看优酷的控件是怎么回事? 只响应最后也就是最顶部的卡片的点击事件,如果点击的不是最顶部的卡片那么就先把它放到最顶部,然后在移动到最前面来,反复如次. 知道了这几条那么我们就很好做了. 里面的技术细节可能就是child的放置到前面来的动画问题把. 先看看我们实现得效果: 然后仔细分析一下我们要实现怎么样的效果: 我也是放置了一个按钮和两个view在控件上面,只有当控件在最前面也就是最里面的时候才会响应事件. 然后我们就动手来实现这个控件. 我们继承一个ViewGroup并且命名为Exch

Android基础入门教程——2.3.3 Button(按钮)与ImageButton(图像按钮)

Android基础入门教程--2.3.3 Button(按钮)与ImageButton(图像按钮) 标签(空格分隔): Android基础入门教程 本节引言: 今天给大家介绍的Android基本控件中的两个按钮控件,Button普通按钮和ImageButton图像按钮: 其实ImageButton和Button的用法基本类似,至于与图片相关的则和后面ImageView相同,所以本节 只对Button进行讲解,另外Button是TextView的子类,所以TextView上很多属性也可以应用到Bu

Android自定义控件系列二:如何自定义属性

上一篇Android自定义控件系列一:如何测量控件尺寸 我们讲了如何确定控件的属性,这篇接着也是讲个必要的知识-如何自定义属性.对于一个完整的或者说真正有实用价值的控件,自定义属性是必不可少的. 如何为控件定义属性 在res/values/attrs.xml(attrs.xml如果不存在,可以创建个)中使用<declare-styleable>标签定义属性,比如我想定义个显示头像的圆形的图片控件(AvatarImageView): 01.<?xml version="1.0&q

史上最详细的Android Studio系列教程一--下载和安装

链接地址:http://segmentfault.com/a/1190000002401964#articleHeader4 原文链接:http://stormzhang.com/devtools/2014/11/25/android-studio-tutorial1/ 背景 相信大家对Android Studio已经不陌生了,Android Studio是Google于2013 I/O大会针对Android开发推出的新的开发工具,目前很多开源项目都已经在采用,Google的更新速度也很快,明显

史上最详细的Android Studio系列教程四--Gradle基础

史上最详细的Android Studio系列教程四--Gradle基础