zoukankan      html  css  js  c++  java
  • Android应用开发实例篇(1)简易涂鸦板

    一、概述

          这次要做一个简单的涂鸦板应用,以前在Qt上实现过,突然想到要把它在Android上实现,呵呵,既简单又有趣。


    二、实现

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

     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
    9 <SurfaceView
    10 android:id="@+id/surfaceview"
    11 android:layout_width="fill_parent"
    12 android:layout_height="wrap_content"
    13 android:layout_above="@+id/line"
    14 android:layout_alignParentTop="true"
    15 />
    16
    17 <LinearLayout
    18 android:id="@+id/line"
    19 android:layout_width="fill_parent"
    20 android:layout_height="wrap_content"
    21 android:layout_alignParentBottom="true"
    22 >
    23
    24 <Button
    25 android:id="@+id/flushbutton"
    26 android:layout_width="fill_parent"
    27 android:layout_height="wrap_content"
    28 android:layout_weight="1"
    29 android:text="清屏"
    30 />
    31
    32 <Button
    33 android:id="@+id/colorbutton"
    34 android:layout_width="fill_parent"
    35 android:layout_height="wrap_content"
    36 android:layout_weight="1"
    37 android:text="颜色"
    38 />
    39 </LinearLayout>
    40 </RelativeLayout>

    接着,修改MyWallActivity.java文件,最主要是覆写了onTouchEvent()函数,在这个函数里过滤出触屏拖动事件,然后获取其相应的坐标和画线,关于SurfaceView的用法在基础篇里有讲到。完整的内容如下:

      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
    49 cleanButton = (Button)this.findViewById(R.id.flushbutton);
    50 //按钮监听
    51 cleanButton.setOnClickListener(new View.OnClickListener()
    52 {
    53
    54 @Override
    55 public void onClick(View v)
    56 {
    57 // TODO Auto-generated method stub
    58 //锁定整个SurfaceView
    59 Canvas mCanvas = mSurfaceHolder.lockCanvas();
    60 mCanvas.drawColor(Color.BLACK);
    61 //绘制完成,提交修改
    62 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
    63 //重新锁一次
    64 mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
    65 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
    66 }
    67 });
    68
    69 colorButton = (Button)this.findViewById(R.id.colorbutton);
    70 //按钮监听
    71 colorButton.setOnClickListener(new View.OnClickListener()
    72 {
    73
    74 @Override
    75 public void onClick(View v)
    76 {
    77 // TODO Auto-generated method stub
    78 Dialog mDialog = new AlertDialog.Builder(MyWallActivity.this)
    79 .setTitle("颜色设置")
    80 .setSingleChoiceItems(new String[]{"红色","绿色","蓝色"}, whichColor, new DialogInterface.OnClickListener()
    81 {
    82
    83 @Override
    84 public void onClick(DialogInterface dialog, int which)
    85 {
    86 // TODO Auto-generated method stub
    87 switch(which)
    88 {
    89 case 0:
    90 {
    91 //画笔的颜色
    92 mPaint.setColor(Color.RED);
    93 whichColor = 0;
    94 break;
    95 }
    96 case 1:
    97 {
    98 //画笔的颜色
    99 mPaint.setColor(Color.GREEN);
    100 whichColor = 1;
    101 break;
    102 }
    103 case 2:
    104 {
    105 //画笔的颜色
    106 mPaint.setColor(Color.BLUE);
    107 whichColor = 2;
    108 break;
    109 }
    110 }
    111 }
    112 })
    113 .setPositiveButton("确定", new DialogInterface.OnClickListener()
    114 {
    115
    116 @Override
    117 public void onClick(DialogInterface dialog, int which)
    118 {
    119 // TODO Auto-generated method stub
    120 dialog.dismiss();
    121 }
    122 })
    123 .create();
    124 mDialog.show();
    125 }
    126 });
    127
    128 }
    129
    130
    131 @Override
    132 public boolean onTouchEvent(MotionEvent event)
    133 {
    134 //获取x坐标
    135 float x = event.getX();
    136 //获取y坐标(不知道为什么要减去一个偏移值才对得准屏幕)
    137 float y = event.getY()-50;
    138
    139 //第一次进来先不管
    140 if(canDraw)
    141 {
    142 //获取触屏事件
    143 switch(event.getAction())
    144 {
    145 //如果是拖动事件
    146 case MotionEvent.ACTION_MOVE:
    147 {
    148
    149 //锁定整个SurfaceView
    150 Canvas mCanvas = mSurfaceHolder.lockCanvas();
    151 mCanvas.drawLine(x, y, oldX, oldY, mPaint);
    152 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
    153 //重新锁一次
    154 mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
    155 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
    156 break;
    157 }
    158 }
    159
    160 }
    161 //保存目前的x坐标值
    162 oldX = x;
    163 //保存目前的y坐标值
    164 oldY = y;
    165
    166 canDraw = true;
    167
    168 return true;
    169 }
    170
    171 }

    好了,在模拟器上运行效果如下:

    在真机上运行效果如下:

    呵呵,写得比较丑。


          在获取了Y坐标后减去一个偏移值50,这个值是我直接猜出来的,没想到在模拟器和真机上定位得还蛮准的,哈哈。当然这个应用的功能不多,不过有兴趣的话可以再完善它,希望能起到抛砖引玉的作用。




  • 相关阅读:
    win10 UWP button
    内网分享资源
    内网分享资源
    CF724F Uniformly Branched Trees
    win10 UWP FlipView
    win10 UWP FlipView
    win10 UWP FlipView
    搭建阿里云 centos mysql tomcat jdk
    搭建阿里云 centos mysql tomcat jdk
    win10 UWP 申请微软开发者
  • 原文地址:https://www.cnblogs.com/lknlfy/p/2378328.html
Copyright © 2011-2022 走看看