android項目 之 記事本（13） ----- 查看圖片及播放錄音

本文是自己學習所做筆記，歡迎轉載，但請注明出處：http://blog.csdn.net/jesson20121020

今天就來實現下查看圖片及錄音的功能，在編輯或者浏覽記事時，點擊圖片，打開一個自定義Activity（當然了，也可以調用系統的圖庫來查看）來查看所添加的圖片的原始圖片，而不是縮放後的圖片，同理，用自定義Activity來查看錄音文件，實現播放錄音的功能。上圖：

從圖中也可以看出，我們首先要創建兩個Activity，當然了，布局文件也是少不了的，如下：

activity_show_picture.xml

<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4KPHByZSBjbGFzcz0="brush:java;"> ShowPicture.java

public class ShowPicture extends Activity {
	private ImageView img;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
		setContentView(R.layout.activity_show_picture);
		getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.title_add);
		//設置標題
		TextView tv_title = (TextView)findViewById(R.id.tv_title);
		tv_title.setText("查看圖片");
		Button bt_back = (Button)findViewById(R.id.bt_back);
		bt_back.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View arg0) {
				ShowPicture.this.finish();
			}
		});
		Button bt_del = (Button)findViewById(R.id.bt_save);
		bt_del.setBackgroundResource(R.drawable.paint_icon_delete);
		
		img = (ImageView)findViewById(R.id.iv_showPic);
		
		Intent intent = this.getIntent();
		String imgPath = intent.getStringExtra("imgPath");
		Bitmap bm = BitmapFactory.decodeFile(imgPath);
		img.setImageBitmap(bm);
	}
}

主要思想就是用ImageView來顯示指定路徑的圖片，該路徑是從前一個Activity中傳入進來的。這裡的監聽事件，只實現了返回的功能，至於，放大縮小圖片，旋轉圖片，下節再實現吧。activity_show_record.xml

ShowRecord.java

public class ShowRecord extends Activity {
	
	private String audioPath;
	private int isPlaying = 0;
	private AnimationDrawable ad_left,ad_right;
	private Timer mTimer;
	//語音操作對象
	private MediaPlayer mPlayer = null;
	private ImageView iv_record_wave_left,iv_record_wave_right,iv_microphone;
	private TextView tv_recordTime;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
		setContentView(R.layout.activity_show_record);
		getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.title_add);
		//設置標題
		TextView tv_title = (TextView)findViewById(R.id.tv_title);
		tv_title.setText("查看錄音");
		Button bt_back = (Button)findViewById(R.id.bt_back);
		bt_back.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View arg0) {
				if(isPlaying == 1){
					mPlayer.stop();
					mPlayer.release();
				}
				ShowRecord.this.finish();
			}
		});
		Button bt_del = (Button)findViewById(R.id.bt_save);
		bt_del.setBackgroundResource(R.drawable.paint_icon_delete);
		
		Intent intent = this.getIntent();
		audioPath = intent.getStringExtra("audioPath");
		
		iv_microphone = (ImageView)findViewById(R.id.iv_microphone);
		iv_microphone.setOnClickListener(new ClickEvent());
		
		iv_record_wave_left = (ImageView)findViewById(R.id.iv_record_wave_left);
		iv_record_wave_right = (ImageView)findViewById(R.id.iv_record_wave_right);
		
		ad_left = (AnimationDrawable)iv_record_wave_left.getBackground();
		//ad_left = (AnimationDrawable)iv_record_wave_left.getDrawable();
		ad_right = (AnimationDrawable)iv_record_wave_right.getBackground();
		//ad_right = (AnimationDrawable)iv_record_wave_right.getDrawable();
		tv_recordTime = (TextView)findViewById(R.id.tv_recordTime);
	}
	
	final Handler handler = new Handler(){
		public void handleMessage(Message msg) {
			switch(msg.what){
			    case 1 :
			    	String time[] = tv_recordTime.getText().toString().split(":");
					int hour = Integer.parseInt(time[0]);
					int minute = Integer.parseInt(time[1]);
					int second = Integer.parseInt(time[2]);
					
					if(second < 59){
						second++;
						
					}
					else if(second == 59 && minute < 59){
						minute++;
						second = 0;
						
					}
					if(second == 59 && minute == 59 && hour < 98){
						hour++;
						minute = 0;
						second = 0;
					}
					
					time[0] = hour + "";
					time[1] = minute + "";
					time[2] = second + "";
					//調整格式顯示到屏幕上
					if(second < 10)
						time[2] = "0" + second;
					if(minute < 10)
						time[1] = "0" + minute;
					if(hour < 10)
						time[0] = "0" + hour;
					
					//顯示在TextView中
					tv_recordTime.setText(time[0]+":"+time[1]+":"+time[2]);
					
					break;
			
			}
			
		}
	};
	
	class ClickEvent implements OnClickListener{

		@Override
		public void onClick(View arg0) {
			// TODO Auto-generated method stub
				//試聽
				if(isPlaying == 0){
					isPlaying = 1;
					mPlayer = new MediaPlayer();
					tv_recordTime.setText("00:00:00");
					mTimer = new Timer();
					mPlayer.setOnCompletionListener(new MediaCompletion());
					try {
						mPlayer.setDataSource(audioPath);
						mPlayer.prepare();
						mPlayer.start();
					} catch (IllegalArgumentException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					} catch (SecurityException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					} catch (IllegalStateException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					} catch (IOException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					}
					mTimer.schedule(new TimerTask() {
						
						@Override
						public void run() {
							Message message = new Message();
							message.what = 1;
							handler.sendMessage(message);
						}
					}, 1000,1000);
					//播放動畫
					ad_left.start();
					ad_right.start();
				}
				//結束試聽
				else{
					isPlaying = 0;
					mPlayer.stop();
					mPlayer.release();
					mPlayer = null;
					mTimer.cancel();
					mTimer = null;
					//停止動畫
					ad_left.stop();
					ad_right.stop();
				}
		}
	}

	class MediaCompletion implements OnCompletionListener{

		@Override
		public void onCompletion(MediaPlayer mp) {
			mTimer.cancel();
			mTimer = null;
			isPlaying = 0;
			//停止動畫
			ad_left.stop();
			ad_right.stop();
			Toast.makeText(ShowRecord.this, "播放完畢", Toast.LENGTH_SHORT).show();
			tv_recordTime.setText("00:00:00");
		}
	}
}

在查看錄音時，用到了對播放時間的顯示處理，以及動畫的播放與停止，稍有點復雜，這些在之前“添加錄音”一節就就講述了。

有了這兩個Activity後，那麼剩下的工作就是在單擊圖片或者錄音的事件中啟動這兩個Activity即可。但這就有一個問題，如何在圖文混排的EditText中的判斷單擊的是圖片，錄音，還是文字呢？？這就需要從EditText中的識別那些是圖片，那些是文字，再進一步對圖片分析到底單擊的是那一個圖片，從而實現查看具體圖片及錄音的功能，具體如下：

1. 記錄EditText中每個圖片的位置及所在源路徑

為了實現在編輯和浏覽時可以隨時查看原圖片及錄音文件，所以在每次添加圖片或錄音後，用一個List記住新增加的每個圖片或錄音的位置及所在路徑，當然了，如果是浏覽已經存在於數據庫中的記事時，在加載數據的同時，同樣用ListView來記住所有的圖片及錄音的位置和路徑。主要代碼如下：

        //記錄editText中的圖片，用於單擊時判斷單擊的是那一個圖片
	private List> imgList = new ArrayList>();

每次單擊記事列表項，進入查看記事，在加載數據的同時將所有圖片及錄音的位置及路徑記錄下來，具體為在loadDate()方法中添加以下代碼：

         //用List記錄該錄音的位置及所在路徑，用於單擊事件
	 Map map = new HashMap();
	 map.put("location", m.start()+"-"+m.end());
	 map.put("path", path);
	 imgList.add(map);

同理，也要在每次添加圖片錄音後也要加入相應的代碼，在InsertBitmap()函數中添加如下代碼：

        //用List記錄該錄音的位置及所在路徑，用於單擊事件
        Map map = new HashMap();
        map.put("location", selectionIndex+"-"+(selectionIndex+spannableString.length()));
        map.put("path", imgPath);
        imgList.add(map);

2. 給EditText添加單擊事件

private LineEditText et_Notes;

... ...

et_Notes.setOnClickListener(new TextClickEvent());

3. 判斷單擊的是圖片還是普通文字

為了判斷單擊的是圖片還是普通文字，用到了Spanned，ImageSpan，主要思想，就是判斷當前單擊的位置是否在圖片的位置范圍內，主要代碼如下：

                        Spanned s = et_Notes.getText();
			ImageSpan[] imageSpans;
			imageSpans = s.getSpans(0, s.length(), ImageSpan.class);
			
			int selectionStart = et_Notes.getSelectionStart();
			for(ImageSpan span : imageSpans){
				
				int start = s.getSpanStart(span);
				int end = s.getSpanEnd(span);
				//找到圖片
				if(selectionStart >= start && selectionStart < end){
                                     ... ... 
                                }
				
			}

打到了圖片，接下來就要判斷單擊的到底是那一圖片呢？

4. 決斷單擊的具體是那一張圖片

這就用到了第一步記錄的圖片的位置和路徑了，顯然，就是用位置來判斷到底是單擊的那一個圖片，主要代碼如下:

        //查找當前單擊的圖片是哪一個圖片
	//System.out.println(start+"-----------"+end);
	String path = null;
	for(int i = 0;i < imgList.size();i++){
		Map map = imgList.get(i);
		//找到了
		if(map.get("location").equals(start+"-"+end)){
			path = imgList.get(i).get("path");
			break;
		}
	}

5. 判斷是錄音還是圖片，啟動對應的Activity，並傳遞路徑

查看圖片，有兩種方法，一種是調用系統的圖庫打開圖片，另一種就是自定義，這裡，我都實現了，打開錄音用的是自定義的Activity，如下：

        //接著判斷當前圖片是否是錄音，如果為錄音，則跳轉到試聽錄音的Activity，如果不是，則跳轉到查看圖片的界面
	//錄音，則跳轉到試聽錄音的Activity
	if(path.substring(path.length()-3, path.length()).equals("amr")){
		Intent intent = new Intent(AddActivity.this,ShowRecord.class);
		intent.putExtra("audioPath", path);
		startActivity(intent);
	}
	//圖片，則跳轉到查看圖片的界面
	else{
		//有兩種方法，查看圖片，第一種就是直接調用系統的圖庫查看圖片，第二種是自定義Activity
		//調用系統圖庫查看圖片
		/*Intent intent = new Intent(Intent.ACTION_VIEW);
		File file = new File(path);
		Uri uri = Uri.fromFile(file);
		intent.setDataAndType(uri, "image/*");*/
		//使用自定義Activity
		Intent intent = new Intent(AddActivity.this,ShowPicture.class);
		intent.putExtra("imgPath", path);
		startActivity(intent);
	}

以上，3，4，5步其實都是在單擊的監聽器中實現的，完整代碼如下：

        //為EidtText設置監聽器
	class TextClickEvent implements OnClickListener{

		@Override
		public void onClick(View v) {
			Spanned s = et_Notes.getText();
			ImageSpan[] imageSpans;
			imageSpans = s.getSpans(0, s.length(), ImageSpan.class);
			
			int selectionStart = et_Notes.getSelectionStart();
			for(ImageSpan span : imageSpans){
				
				int start = s.getSpanStart(span);
				int end = s.getSpanEnd(span);
				//找到圖片
				if(selectionStart >= start && selectionStart < end){
					//Bitmap bitmap = ((BitmapDrawable)span.getDrawable()).getBitmap();
					//查找當前單擊的圖片是哪一個圖片
					//System.out.println(start+"-----------"+end);
					String path = null;
					for(int i = 0;i < imgList.size();i++){
						Map map = imgList.get(i);
						//找到了
						if(map.get("location").equals(start+"-"+end)){
							path = imgList.get(i).get("path");
							break;
						}
					}
					//接著判斷當前圖片是否是錄音，如果為錄音，則跳轉到試聽錄音的Activity，如果不是，則跳轉到查看圖片的界面
					//錄音，則跳轉到試聽錄音的Activity
					if(path.substring(path.length()-3, path.length()).equals("amr")){
						Intent intent = new Intent(AddActivity.this,ShowRecord.class);
						intent.putExtra("audioPath", path);
						startActivity(intent);
					}
					//圖片，則跳轉到查看圖片的界面
					else{
						//有兩種方法，查看圖片，第一種就是直接調用系統的圖庫查看圖片，第二種是自定義Activity
						//調用系統圖庫查看圖片
						/*Intent intent = new Intent(Intent.ACTION_VIEW);
						File file = new File(path);
						Uri uri = Uri.fromFile(file);
						intent.setDataAndType(uri, "image/*");*/
						//使用自定義Activity
						Intent intent = new Intent(AddActivity.this,ShowPicture.class);
						intent.putExtra("imgPath", path);
						startActivity(intent);
					}
				}
				else
					//如果單擊的是空白出或文字，則獲得焦點，即打開軟鍵盤 
					imm.showSoftInput(et_Notes, 0);
			}
		}
	}

至此，就實現了查看圖片以及播放錄音的功能。