Android更改画布背景颜色而不会丢失任何图纸

时间:2012-04-22 14:20:12

标签: android android-canvas

我正在尝试找到一种方法来设置画布的背景,使用从自定义颜色选择器中拾取的颜色,而不删除任何图纸。我正在尝试创建一个可以在画布上绘制的应用程序,而不是将其保存为png。但是当我为当前画布设置新背景时,所有绘图都消失了。我正在使用这样的东西:

mCanvas.drawColor(picker.getColor());

任何想法如何让事情发挥作用?

7 个答案:

答案 0 :(得分:7)

已经提到的问题的答案都指向了正确的方向:您需要在单独的图层中分离背景颜色块和前景图,然后合并它们,然后将其全部保存在.png文件中。这就是Adobe Photoshop工作流程的设计方式......如果我们考虑它,它确实有意义:例如像MsPaint这样的软件:因为它不使用图层,它必须依赖洪水填充算法之类的东西完成(尽管是以不完整的方式)远程类似于背景变化的东西...

实现此类操作的一种方法是实例化由2个不同位图支持的2个Canvas对象。第一个Canvas-Bitmap对将用于前景处的绘制,第二个Canvas-Bitmap对将用于合并图层绘制(即前景绘图+背景颜色块)。然后第二个位图将在您需要保存时保存到.png文件中。这样,我们的第一个Canvas-Bitmap对存储您的前景信息,如果需要进行背景颜色更改,则不会销毁该信息。每次进行操作时,图层都可以合并到第二个Canvas-Bitmap对中,这样总会有一个具有正确内容的Bitmap,可以随心所欲地保存。

这是我制作的自定义视图,以便清除此方法。它实现了一个简单的视图,用于使用手指在触摸屏上绘制蓝线,背景颜色根据所述手指的XY位置而变化,以便演示背景颜色变化,而没有完整实现固有的不必要的代码复杂性带色轮/菜单/ 除其他外

package com.epichorns.basicpaint;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Point;
import android.graphics.Paint.Style;
import android.view.View;

public class PaintView extends View{

    Bitmap mMergedLayersBitmap=null; //Note: this bitmap here contains the whole of the drawing (background+foreground) to be saved.
    Canvas mMergedLayersCanvas=null;

    Bitmap mBitmap = null; //bitmap onto which we draw our stuff
    Canvas mCanvas = null; //Main canvas. Will be linked to a .bmp file
    int mBackgroundColor = 0xFF000000; //default background color
    Paint mDefaultPaint = new Paint();

    Paint mDrawPaint = new Paint(); //used for painting example foreground stuff... We draw line segments.
    Point mDrawCoor = new Point(); //used to store last location on our PaintView that was finger-touched

    //Constructor: we instantiate 2 Canvas-Bitmap pairs
    public PaintView(Context context, int width, int height) {
        super(context);
        mMergedLayersBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); 
        mMergedLayersCanvas = new Canvas(mMergedLayersBitmap);

        mBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
        mCanvas = new Canvas(mBitmap);
    }

    //Change background color
    public void changeColor(int newColor){
        mBackgroundColor = newColor;
        invalidate(); //refresh view: this will indirectly invoke onDraw soon afterwards
    }

    //Called by user of PaintView in order to start a painting "stroke" (finger touching touch-screen): stores the 
    //location of the finger when it first touched the screen
    public void startDraw(int x, int y, int radius, int color){
        mDrawPaint.setColor(color);
        mDrawPaint.setStyle(Style.STROKE);
        mDrawPaint.setStrokeWidth(radius);
        mDrawCoor.x = x;
        mDrawCoor.y = y;        
    }

    //Called by user of PaintView when finger touching touch-screen is moving (must be called after a startDraw, 
    //as the latter initializes a couple of necessary things)
    public void continueDraw(int x, int y){
        mCanvas.drawLine(mDrawCoor.x, mDrawCoor.y, x, y, mDrawPaint);
        mDrawCoor.x = x;
        mDrawCoor.y = y;
        invalidate(); //refresh view: this will indirectly invoke onDraw soon afterwards
    }

    //Merge the foreground Canvas-Bitmap with a solid background color, then stores this in the 2nd Canvas-Bitmap pair.
    private void mergeLayers(){
        mMergedLayersCanvas.drawColor(mBackgroundColor);
        mMergedLayersCanvas.drawBitmap(mBitmap, 0, 0, mDefaultPaint);
    }

    @Override
    public void onDraw(Canvas canvas){
        mergeLayers();
        canvas.drawBitmap(mMergedLayersBitmap, 0, 0, mDefaultPaint);
    }

}

为了测试此视图,这是一个使用PaintView类的测试活动。这两个文件在Android项目中都是自给自足的,因此您可以在真实设备上进行测试而不会有麻烦:

package com.epichorns.basicpaint;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.Display;
import android.view.MotionEvent;
import android.view.View;
import android.widget.LinearLayout;


import com.epichorns.basicpaint.PaintView;
public class BasicPaintActivity extends Activity {
    PaintView mPaintView=null;
    LinearLayout mL = null;
    boolean mIsDrawing=false;
    int mBackgroundColor = 0xFF000000;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Display display = getWindowManager().getDefaultDisplay();       
        final float dispWidth = (float)display.getWidth();
        final float dispHeight = (float)display.getHeight();

        mPaintView = new PaintView(this, display.getWidth(), display.getHeight());    
        mPaintView.changeColor(mBackgroundColor);
        mPaintView.setOnTouchListener(new View.OnTouchListener(){

            public boolean onTouch(View v, MotionEvent event) {

            if(event.getAction()==MotionEvent.ACTION_DOWN){
                    mPaintView.startDraw((int)event.getX(), (int)event.getY(), 6, 0x806060FF);              
                    mIsDrawing=true;
                    return true;
                }
                else if(event.getAction()==MotionEvent.ACTION_UP){
                    mIsDrawing=false;
                    return true;
                }
                else if(event.getAction()==MotionEvent.ACTION_MOVE){
                    if(mIsDrawing){

                        //To demonstrate background change, change background color depending on X-Y position
                        int r = (int)(255f*event.getX()/dispWidth);
                        int g = (int)(255f*event.getY()/dispHeight);
                        mBackgroundColor = Color.argb(0xFF, r,g, 0x00);
                        Log.d("DEBUG1", "Color channels: (r, g) = ("+String.valueOf(r)+", "+String.valueOf(g)+")");
                        mPaintView.changeColor(mBackgroundColor);

                        //now, draw stuff where finger was dragging...
                        mPaintView.continueDraw((int)event.getX(), (int)event.getY());
                        return true;
                    }
                    else{
                        return false;
                    }

                }

                return false;
            }

        });

        setContentView(mPaintView);
    }




}

答案 1 :(得分:4)

绘制颜色时,会在绘图上绘制。你需要绘制颜色,然后再绘制其他所有东西。

答案 2 :(得分:1)

看看你是否想在画布上进行更改,然后你必须调用invalidate来对屏幕应用这些更改。如果你调用invalidate,那么你的onDraw()方法将会调用。

如果你想从颜色选择器中更改画布的背景颜色,然后在变量中保存颜色值,并在保存变量后调用invalidate.Now你的onDraw()将调用。现在通过调用{{1来更改画布的背景在setBackgroundColor(color variable)中填写您想要的其他内容

答案 3 :(得分:1)

使用canvas.drawARGB(a,r,g,b) 它将适用于明确的

答案 4 :(得分:0)

只要您的背景是并且将使用其他颜色,您就可以:

for (x...)
  for (y...)
    if (bitmap.getPixel(x,y) == oldBackgroundColor)
      bitmap.setPixel(x,y,newBackgroundColor)

或者,您可以在屏幕外的位图上绘制内容,然后绘制背景,然后在屏幕外绘制实际的位图。这样,您可以更改将在下一个两步绘图发生时使用的背景颜色。

答案 5 :(得分:0)

@Android-Droid

这两行代码对我来说就像魅力一样。当用户点击任何颜色(例如:红色)时,将该颜色设置为mPaint,如

      mPaint.setColor(Color.RED);

什么时候你想改变画布颜色

    dv.setBackgroundColor(mPaint.getColor());

其中dv是扩展视图的类的对象(自定义视图)。 尝试一下,如果您遇到任何问题,请告诉我。

答案 6 :(得分:0)

也许这是一个古老的问题,但我想为这个解决方案做出贡献,如果你从一个来源获取位图,然后用画布做一个drawable,也许这可以适合你:

@Override
public Bitmap transform(final Bitmap source) {
    //Background for transparent images
    Bitmap backg = Bitmap.createBitmap(source.getWidth(), source.getHeight(), Bitmap.Config.ARGB_8888);
    backg.eraseColor(Color.WHITE); // Any color you want...
    Paint back = new Paint();
    BitmapShader backshader = new BitmapShader(backg,
    BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
    back.setShader(backshader);
    back.setAntiAlias(true);

    // Image for the draw
    final Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setShader(new BitmapShader(source, Shader.TileMode.CLAMP,
            Shader.TileMode.CLAMP));
    Bitmap output = Bitmap.createBitmap(source.getWidth(), source.getHeight(), source.getConfig());
    Canvas canvas = new Canvas(output);

    // IMPORTANT THING
    canvas.drawRoundRect(new RectF(margin, margin, source.getWidth()
            - margin, source.getHeight() - margin), radius, radius, back); // Draw the background first...
    canvas.drawRoundRect(new RectF(margin, margin, source.getWidth()
            - margin, source.getHeight() - margin), radius, radius, paint); // And then Draw the image, so it draws on top of the background

    if (source != output) {
        source.recycle();
    }

    // This is for if i want to put a border in the drawable, its optional
    Paint paint1 = new Paint();      
    paint1.setColor(Color.parseColor("#CC6C7B8B"));
    paint1.setStyle(Style.STROKE);
    paint1.setAntiAlias(true);
    paint1.setStrokeWidth(2);
    canvas.drawRoundRect(new RectF(margin, margin, source.getWidth()
            - margin, source.getHeight() - margin), radius, radius, paint1);

    // and then, return the final drawable...
    return output;
}

希望它有所帮助...