码迷,mamicode.com
首页 > 移动开发 > 详细

如此随意的android涂鸦工具

时间:2015-04-07 10:00:27      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:bitmap   自定义view   bitmapshader   canvas   painter   

要实现涂鸦这个功能,首先需要以下几步:

1、要实现一个DrawingView类,这个类继承View;

2、重写其父类的构造方法,并初始化涂鸦的画笔、画布的画笔和路径;

3、重写onDraw方法,在这个方法中主要进行涂鸦的绘制工作;

4、重写onTouchEvent事件,在这个方法计算当前的画笔的左边,规划画笔的路径,调用invalidate()方法不断调用onDraw方法进行绘制;

5、自定义setPattern方法设置画笔的描边效果;

6、在MainActivity以及其布局文件中引入自定义的DrawdingView对象;

代码如下:

public class DrawingView extends View {

    private Path drawPath;
    private Paint drawPaint;
    private Paint canvasPaint;
    private int paintColor = 0xFF000000;
    private Bitmap canvasBitmap;
    private Canvas drawCanvas;

    public DrawingView(Context context) {
        super(context,null);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        canvasBitmap = Bitmap.createBitmap(w,h, Bitmap.Config.ARGB_8888);
        drawCanvas = new Canvas(canvasBitmap);
    }

    public DrawingView(Context context, AttributeSet attrs) {
        super(context, attrs);
        setupDrawing();
    }

    private void setupDrawing() {
        drawPaint = new Paint();
        drawPath = new Path();
        drawPaint.setColor(paintColor);
        drawPaint.setAntiAlias(true);
        drawPaint.setStrokeWidth(50);
        drawPaint.setStyle(Paint.Style.STROKE);
        drawPaint.setStrokeJoin(Paint.Join.ROUND);
        drawPaint.setStrokeCap(Paint.Cap.ROUND);
        canvasPaint = new Paint(Paint.DITHER_FLAG);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawBitmap(canvasBitmap,0,0,canvasPaint);
        canvas.drawPath(drawPath,drawPaint);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        float touchX = event.getX();
        float touchY = event.getY();
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:drawPath.moveTo(touchX,touchY);break;
            case MotionEvent.ACTION_MOVE:drawPath.lineTo(touchX,touchY);break;
            case MotionEvent.ACTION_UP:drawPath.lineTo(touchX, touchY);
                drawCanvas.drawPath(drawPath, drawPaint);
                drawPath.reset();break;
            default:return false;
        }
        invalidate();
        return true;
    }

    public void setPattern(String newPattern){
        invalidate();
        int patternId = getResources().getIdentifier(newPattern,"drawable","com.example.lucky.drawapp");
        Bitmap patternBMP = BitmapFactory.decodeResource(getResources(),patternId);
        BitmapShader patternBMPshader = new BitmapShader(patternBMP, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);
        drawPaint.setColor(0xFFFFFFFF);
        drawPaint.setShader(patternBMPshader);
    }
}
布局文件:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#FFCCCCCC"
        android:orientation="vertical"
        tools:context=".MainActivity">
    
        <com.example.lucky.drawapp.DrawingView
            android:id="@+id/draw_view"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_marginBottom="3dp"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:layout_marginTop="3dp"
            android:layout_weight="1"
            android:background="#FFFFFFFF"/>
    
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="vertical" >
            <!-- top row -->
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal" >
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern1"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern1" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern2"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern2" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern3"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern3" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern4"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern4" />
            </LinearLayout>
            <!-- bottom row -->
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal" >
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern5"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern5" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern6"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern6" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern7"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern7" />
                <ImageButton
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_margin="2dp"
                    android:background="@drawable/pattern8"
                    android:contentDescription="pattern"
                    android:onClick="paintClicked"
                    android:tag="pattern8" />
            </LinearLayout>
        </LinearLayout>
    
    </LinearLayout>
Activity中的代码:

public class MainActivity extends Activity {

    private DrawingView drawView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        drawView = (DrawingView) findViewById(R.id.draw_view);
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    public void paintClicked(View view) {
        String pattern = view.getTag().toString();
        drawView.setPattern(pattern);
    }
}
效果图如下:

技术分享



如此随意的android涂鸦工具

标签:bitmap   自定义view   bitmapshader   canvas   painter   

原文地址:http://blog.csdn.net/tianyiii/article/details/44905281

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!