& & &上一篇文章里，我们介绍了整个项目以及实现了按钮功能。没有读的可以点击一下链接：
& & &在本篇文章里，我们做第二步，也就是实现几种状态的对话框：录音状态的对话框，取消录音状态下的对话框，录音时间太短下的对话框。然后将对话框集成到我们点击时的按钮操作中。
& & &首先我们需要自定义一个对话框的布局。不难想出，布局中的上方需要并排放置两张图片，下方是一个用来提示状态的文本。如果对话框切换到录音时的状态，我们就让其中的一张图片显示，另外一张不显示即可。所以整体的布局是这样的，名称为dialog.xml：
1 &LinearLayout xmlns:android="/apk/res/android"
xmlns:tools="/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="@drawable/dialog_loading_bg"&
&LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"&
&ImageView
android:id="@+id/img_recoder"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/recorder"
android:visibility="visible"/&
&ImageView
android:id="@+id/img_voice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/v1"
android:visibility="visible"/&
&/LinearLayout&
android:id="@+id/tv_dialog_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/dialog_recoding"
android:textColor="@color/red"
android:layout_gravity="center"
android:textSize="20dip"/&
38 &/LinearLayout&
& & & & 接下来我们定义一下对话框的样式，在这里关键是要求对话框弹出时，不要屏幕掉屏幕，也就是屏幕的其他部分仍然是点击有效的。在res的values下的styles下，加入一下代码：
&style name = "dialogStyle"&
&item name = "android:windowBackground"&@android:color/transparent&/item&
&item name = "android:windowFrame"&@null&/item&&!-- 设为无边框 --&
&item name = "android:windowIsFloating"&true&/item&&!-- 设定为浮动的 --&
&item name = "android:windowIsTranslucent"&true&/item&
&item name = "android:backgroundDimEnabled"&false&/item&&!--不屏幕屏幕
& & & 然后我们实现对话框这个类，代码如下：
1 package com.fuly.
3 import com.fuly.irecoder.R;
5 import android.app.D
6 import android.content.C
7 import android.view.LayoutI
8 import android.view.V
9 import android.widget.ImageV
10 import android.widget.TextV
12 //对话框管理类
14 public class DialogManager {
private ImageView imgDialogR
private ImageView imgV
private TextView tvD
private Context mC
public DialogManager(Context context){
mContext =
public void dialogShow(){
//此时我们选择我们自己的对话框样式
dialog = new Dialog(mContext, R.style.dialogStyle);
View view = LayoutInflater.from(mContext).inflate(R.layout.dialog, null);
dialog.setContentView(view);
dialog.show();
//获取控件，用来在下面的代码中改变他们的状态
imgDialogRecoder = (ImageView) dialog.findViewById(R.id.img_recoder);
imgVoice = (ImageView) dialog.findViewById(R.id.img_voice);
tvDialog = (TextView) dialog.findViewById(R.id.tv_dialog_txt);
//录音时的对话框状态
public void dialogRecoding(){
imgDialogRecoder.setVisibility(View.VISIBLE);
imgVoice.setVisibility(View.VISIBLE);
imgDialogRecoder.setImageResource(R.drawable.recorder);
imgVoice.setImageResource(R.drawable.v1);
tvDialog.setText(R.string.dialog_recoding);
//录音时，要更新声音等级，即让imgVoice动起来
public void updateVoiceLevel(int level){
//根据字符串和包名来获得所对应的资源文件，在这里获取的R.drawable下的文件
int resId = mContext.getResources().getIdentifier("v"+level,"drawable",mContext.getPackageName());
imgVoice.setImageResource(resId);
//录音取消时的对话框状态
public void dialogRecoderCancel(){
imgDialogRecoder.setVisibility(View.VISIBLE);
imgVoice.setVisibility(View.GONE);
imgDialogRecoder.setImageResource(R.drawable.cancel);
tvDialog.setText(R.string.dialog_cacel);
public void tooShort(){
imgDialogRecoder.setVisibility(View.VISIBLE);
imgVoice.setVisibility(View.GONE);
imgDialogRecoder.setImageResource(R.drawable.voice_to_short);
tvDialog.setText(R.string.too_short);
//取消对话框
public void dialogDismiss(){
if(dialog != null){
dialog.dismiss();
& & & 然后修改strings.xml文件。为什么所有的文字我们非得这么麻烦的放在这个文件里引用的。答案是：这样子做可以有效的防止你的app的内存占用。所以要养成良好的编程习惯。不多说了，代码如下：
1 &?xml version="1.0" encoding="utf-8"?&
2 &resources&
&string name="app_name"&irecoder&/string&
&string name="action_settings"&Settings&/string&
&string name="btn_normal"&按住 录音&/string&
&string name="btn_recoding"&松开 结束&/string&
&string name="btn_cancel"&手指上滑，取消录音 &/string&
&string name="dialog_recoding"&手指上滑，取消录音 &/string&
&string name="dialog_cacel"&松开手指 取消发送&/string&
13 &/resources&
& & & & 然后我们要配置颜色了，在res下的values文件夹下的color.xml（如果没有你就新建一个）里面写上下面的代码：
1 &?xml version="1.0" encoding="utf-8"?&
2 &resources&
&color name="black"&#000000&/color&
&color name="red"&#CC0000&/color&
&color name="white"&#ffffff&/color&
8 &/resources&
& & & 好了，关于对话框的工作我们基本上算是完成了。下面将其集成到按钮中，我们打开RecoderButton类，修改其中的代码如下：
1 package com.fuly.
4 import com.fuly.irecoder.R;
6 import android.content.C
7 import android.util.AttributeS
8 import android.view.MotionE
9 import android.widget.B
12 //定义我们自己的录音按钮
13 public class RecoderButton extends Button{
//按钮的三个状态
private static final int STATE_NORMAL = 1;//正常
private static final int STATE_RECODING = 2;//录音状态
private static final int STATE_CACLE = 3;//取消状态
private int mCurState = STATE_NORMAL;//记录当前按钮状态
private int Y = 50;//限定手指移动的上下宽度
private DialogManager mDialogM//对话框管理类
public RecoderButton(Context context, AttributeSet attrs) {
super(context, attrs);
mDialogManager = new DialogManager(context);//实例化对话框管理类
//捕捉按钮点击事件
public boolean onTouchEvent(MotionEvent event) {
int x = (int) event.getX();
int y =(int)event.getY();
switch(event.getAction()){
case MotionEvent.ACTION_DOWN:
mDialogManager.dialogShow();//按下按钮的同时将对话框显示出来
changeState(STATE_RECODING);//按下按钮，改变按钮状态
case MotionEvent.ACTION_MOVE:
if(wantCancel(x,y)){ //如果检测到取消，则改变按钮状态为取消
changeState(STATE_CACLE);
changeState(STATE_RECODING);
case MotionEvent.ACTION_UP:
mDialogManager.dialogDismiss();
reset();//各种设置复位
return super.onTouchEvent(event);
private void reset() {
mCurState = STATE_NORMAL;
changeState(STATE_NORMAL);
//检查手指移动范围，从而确定用户是否想取消录音
private boolean wantCancel(int x, int y) {
if(x&0||x&getWidth()){
return true;
if(y&0||y&getHeight()+Y){
return true;
return false;
//改变状态，包括按钮等操作
private void changeState(int state) {
if(mCurState != state){
mCurState =
switch(mCurState){
case STATE_NORMAL:
setText(R.string.btn_normal);
case STATE_RECODING:
setText(R.string.btn_recoding);
mDialogManager.dialogRecoding();
case STATE_CACLE:
setText(R.string.btn_cancel);
mDialogManager.dialogRecoderCancel();//此时也要将对话框的状态显示出来
& & & &行了，至此，我们这一阶段的工作算是完成了。下面赶紧运行以下android程序，看看有什么新的效果呢？
阅读(...) 评论()