Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> Android開發實例 >> 一個簡單塗鴉板的Android開發實例

一個簡單塗鴉板的Android開發實例

編輯:Android開發實例

       在Android上開發一些小應用既可以積累知識又可以增加樂趣,與任務式開發不同,所以想到在Android系統上實現一個簡單的塗鴉板,這是我們練手的一種好的方法。

       塗鴉板應用的代碼實現

       新建工程MyWall,修改/res/layout/main.xml文件,在裡面添加一個SurfaceView和兩個Button,用到了RelativeLayout布局,完整的main.xml文件如下:

XML/HTML代碼
  1. <?xml version="1.0" encoding="utf-8"?> 
  2.  
  3. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  4. android:layout_width="fill_parent" 
  5. android:layout_height="fill_parent" 
  6. android:orientation="vertical" 
  7.  
  8. <SurfaceView 
  9. android:id="@+id/surfaceview"
  10. android:layout_width="fill_parent"
  11. android:layout_height="wrap_content"
  12. android:layout_above="@+id/line"
  13. android:layout_alignParentTop="true"
  14. />
  15.  
  16. <LinearLayout
  17. android:id="@+id/line"
  18. android:layout_width="fill_parent"
  19. android:layout_height="wrap_content"
  20. android:layout_alignParentBottom="true"
  21. >
  22.  
  23. <Button
  24. android:id="@+id/flushbutton"
  25. android:layout_width="fill_parent"
  26. android:layout_height="wrap_content"
  27. android:layout_weight="1"
  28. android:text="清屏"
  29. />
  30.  
  31. <Button
  32. android:id="@+id/colorbutton"
  33. android:layout_width="fill_parent"
  34. android:layout_height="wrap_content"
  35. android:layout_weight="1" 
  36. android:text="顏色"
  37. />
  38. </LinearLayout>
  39. </RelativeLayout>  

       接著,修改MyWallActivity.java文件,最主要是重寫了onTouchEvent()函數,在這個函數裡過濾出觸屏拖動事件,然後獲取其相應的坐標和畫線。完整的內容如下:

Java代碼
  1. package com.nan.wall;      
  2.      
  3. import android.app.Activity;      
  4. import android.app.AlertDialog;      
  5. import android.app.Dialog;      
  6. import android.content.DialogInterface;      
  7. import android.graphics.Canvas;      
  8. import android.graphics.Color;      
  9. import android.graphics.Paint;      
  10. import android.graphics.Rect;      
  11. import android.os.Bundle;      
  12. import android.view.MotionEvent;      
  13. import android.view.SurfaceHolder;       
  14. import android.view.SurfaceView;      
  15. import android.view.View;       
  16. import android.widget.Button;       
  17.      
  18. public class MyWallActivity extends Activity        
  19. {       
  20. private SurfaceView mSurfaceView = null;       
  21. private SurfaceHolder mSurfaceHolder = null;       
  22. private Button cleanButton = null;       
  23. private Button colorButton = null;       
  24.      
  25. private float oldX = 0f;       
  26. private float oldY = 0f;       
  27.      
  28. private boolean canDraw = false;      
  29. private Paint mPaint = null;      
  30. //用來記錄當前是哪一種顏色       
  31. private int whichColor = 0;       
  32.      
  33. /** Called when the activity is first created. */      
  34.     @Override       
  35. public void onCreate(Bundle savedInstanceState)        
  36. {       
  37. super.onCreate(savedInstanceState);      
  38. setContentView(R.layout.main);      
  39.             
  40. mSurfaceView = (SurfaceView)this.findViewById(R.id.surfaceview);      
  41. mSurfaceHolder = mSurfaceView.getHolder();      
  42.      
  43. mPaint = new Paint();       
  44. //畫筆的顏色       
  45. mPaint.setColor(Color.RED);       
  46. //畫筆的粗細       
  47. mPaint.setStrokeWidth(2.0f);      
  48. cleanButton = (Button)this.findViewById(R.id.flushbutton);       
  49. //按鈕監聽       
  50. cleanButton.setOnClickListener(new View.OnClickListener()        
  51. {       
  52.      
  53. @Override       
  54. public void onClick(View v)        
  55. {       
  56. // TODO Auto-generated method stub       
  57. //鎖定整個SurfaceView       
  58. Canvas mCanvas = mSurfaceHolder.lockCanvas();       
  59. mCanvas.drawColor(Color.BLACK);       
  60. //繪制完成,提交修改      
  61. mSurfaceHolder.unlockCanvasAndPost(mCanvas);       
  62. //重新鎖一次       
  63. mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));       
  64. mSurfaceHolder.unlockCanvasAndPost(mCanvas);       
  65. }      
  66. });          
  67.      
  68. colorButton = (Button)this.findViewById(R.id.colorbutton);      
  69. //按鈕監聽       
  70. colorButton.setOnClickListener(new View.OnClickListener()        
  71. {       
  72.      
  73. @Override       
  74. public void onClick(View v)       
  75. {       
  76.  // TODO Auto-generated method stub      
  77.      
  78. Dialog mDialog = new AlertDialog.Builder(MyWallActivity.this)       
  79. .setTitle("顏色設置")       
  80. .setSingleChoiceItems(new String[]{"紅色","綠色","藍色"}, whichColor, new DialogInterface.OnClickListener()        
  81. {       
  82. @Override      
  83. public void onClick(DialogInterface dialog, int which)        
  84. {       
  85.  // TODO Auto-generated method stub       
  86. switch(which)       
  87. {       
  88. case 0:       
  89. {       
  90. //畫筆的顏色       
  91. mPaint.setColor(Color.RED);       
  92. whichColor = 0;       
  93. break;       
  94. }       
  95. case 1:       
  96. {       
  97. //畫筆的顏色      
  98. mPaint.setColor(Color.GREEN);      
  99. whichColor = 1;      
  100. break;      
  101. }      
  102. case 2:      
  103. {      
  104. //畫筆的顏色106                                 
  105. mPaint.setColor(Color.BLUE);      
  106. whichColor = 2;                                 
  107. break;                                  
  108. }      
  109. }      
  110. }      
  111. })      
  112. .setPositiveButton("確定", new DialogInterface.OnClickListener()      
  113. {      
  114. @Override      
  115. public void onClick(DialogInterface dialog, int which)       
  116. {      
  117. // TODO Auto-generated method stub      
  118. dialog.dismiss();      
  119. }      
  120. })      
  121. .create();      
  122. mDialog.show();      
  123. }      
  124. });      
  125.      
  126.      
  127. @Override      
  128. public boolean onTouchEvent(MotionEvent event)      
  129. {            
  130. //獲取x坐標      
  131. float x = event.getX();      
  132. //獲取y坐標(不知道為什麼要減去一個偏移值才對得准屏幕)      
  133. float y = event.getY()-50;      
  134. //第一次進來先不管      
  135. if(canDraw)      
  136. {           
  137. //獲取觸屏事件      
  138. switch(event.getAction())      
  139. {      
  140. //如果是拖動事件      
  141. case MotionEvent.ACTION_MOVE:      
  142. {      
  143. //鎖定整個SurfaceView      
  144. Canvas mCanvas = mSurfaceHolder.lockCanvas();          
  145. mCanvas.drawLine(x, y, oldX, oldY, mPaint);      
  146. mSurfaceHolder.unlockCanvasAndPost(mCanvas);      
  147. //重新鎖一次      
  148. mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));      
  149. mSurfaceHolder.unlockCanvasAndPost(mCanvas);      
  150. break;      
  151. }      
  152. }      
  153. }      
  154. //保存目前的x坐標值      
  155. oldX = x;      
  156. //保存目前的y坐標值      
  157. oldY = y;      
  158.      
  159. canDraw = true;      
  160.      
  161. return true;      
  162. }      
  163.      
  164. }     

       應用測試

       在模擬器上運行此應用是如下效果:

       在Android手機上運行效果則是這樣的:

 

       字寫的有點丑,但是功能實現了。在獲取了Y坐標後減去一個偏移值50,這個值是猜出來的,沒想到在模擬器和真機上定位得都還蠻准的。

       應用比較簡易,但是大家可以在此基礎上豐富它的功能,使其成為一個像樣的Android應用。

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved