Android weird drawing canvas bug? - android

let's get straight to the point, I was making an android game and I decided to try and use some more android methods like Rect and Path so I can experiment and learn how they work. (in the past I used only bitmaps to draw graphics)
As I was making the game I noticed some weird coloring on my rects, so I tried a lot of things, I made sure my rects are initialized properly and I also tried to simplify my code to make sure the problem was caused there.
For debug purposes my code draws a white square on the top left side of the screen, a black on the top right, and a gray one on the bottom, this is the code:
Paint pGray, pWhite, pBlack;
public myClass()
{
paintGray = new Paint();
paintGray.setARGB(255, 125, 125, 125);
paintWhite = new Paint();
paintWhite.setARGB(255, 255, 255, 255);
paintBlack = new Paint();
paintBlack.setARGB(255, 0, 0, 0);
}
public void draw(Canvas canvas)
{
canvas.drawRect(0, screenHeight/2, screenWidth, screenHeight, paintGray);
canvas.drawRect(0, 0, screenWidth/2, screenHeight/2, paintWhite);
canvas.drawRect(screenWidth/2, 0, screenWidth, screenHeight/2, paintBlack);
}
(I don't know if it matters but it runs on another Thread)
When I run it on my phone and save a screenshot using Android Studio the screenshot looks like this:
which is t he desired result, the problem is that my phone doesn't display the graphics properly and here is a photo:
As you can see the gray square has 2 colors inside it, a darker and a lighter one. It happens on both phones that I have and I have no idea what it is, even weirder is that saving the screenshot doesn't show this problem!!
I also noticed the colorization changes based on the white square, if I make it bigger or smaller the gray square changes its color where the white box ends.
Another thing I noticed is that these lines of "decolorization" (with multiple white boxes, multiple lines appear) on the gray square is vertical on landscape mode, but on portrait it becomes horizontal.
I've been torturing my self for so much time with this, I have commented out my whole application to try and see why it happens, if I'm missing something or anyone knows anything please let me know!

I don't think it's a software bug. My guess would be that that's the way the display is rendering colors.

Related

Android drawing position on view

As I am a beginner of Android developement, I need someone to give me an answer or any comments on my question.
When I draw a simple rectangle on a view with the following code, the rectangle doesn't show in the way in which I would expect.
canvas.drawLine(0, 0, getWidth(), getHeight(), framePaint);
wrong
But when I changed it like this, it shows properly.
canvas.drawRect(1, 0, getWidth(), getHeight()-1, framePaint);
Correct
That looks like the left and the bottom lines are clipped out of the view.
I was expecting that the position of view starts zero-indexed such as 0 ~ (size of view)-1. Do I understand wrong or did i do something wrong?
The framePaint is configured like this;
framePaint = new Paint();
framePaint.setColor(Color.rgb(255,0,0));
framePaint.setStrokeWidth(1);
framePaint.setStyle(Paint.Style.STROKE);
Here's what happens:
When you subtract one from the total pixels, it draws the line(s) in the image, not outside of it.
Also the "1" at the start also helps the code stay in the canvas.
You may want to try replacing the 1's in the code with 2's, as the canvas uses an extra pixel to automatically remove "aliasing".

Android bitmap shift/move issues

I have a problem that I can not really solve. I have created a graphing app which will contain data with alot of data points. To enable scrolling in the graph i create a bitmap of the graph data, and the shift / move the bitmap to the right or left of the screen depending on the user input. The bitmap is always the graph view height and graph view width. When the user moves the bitmap, i shift the bitmap with:
memoryCanvas.drawBitmap(memoryBitmap, bitmapShift, 0.0f, paint);
where shift is a a float value containing the shifting values.
Now, on most devices i have tried this is, it works very nice. I have tried it on HTC Desire, Galaxy Tab and Galaxy S. When testing this on my own Galaxy S however, i get strange results that i can not explain. Do note that my Galaxy S contains a custom rom (with android 4.0.4), so that is probably the reason why i get this behavior, but i still can not understand it or properly mitigate it.
So in a normal use case behavior, the bitmaps get shifted by bitmapShift number of pixels, and then i fill in the empty space by normal line drawing. But when using my phone, dragging the bitmap either direction slowly, so the bitmapShift values are around 0.5, the bitmap does not move, or only moves sometimes. I have compared the bitmapShift on the other platforms and they are in the same range, 0.5 when dragging slowly. This behavior does of course screw up my drawings a lot. This does also happen when doing fast dragging, but its most visible when doing it slowly.
I can not really figure out what causes this behavior. The bitmap does not move according to my bitmapShift value. It does on all other platforms i have tried. If i skip using bitmaps, and only draw lines according to the shifting values, everything works fine.
Does anyone have any idea on what could cause this behavior? Im kinda running out after sitting some days trying to figure it out. The critical code is below. This code is in my onDraw function.
memoryCanvas.setBitmap(emptyBitmap); //First set another bitmap to clear
memoryCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR); //Clear it
memoryCanvas.drawBitmap(memoryBitmap, bitmapShift, 0.0f, paint); //Draw shifted bitmap on it
memoryCanvas.drawLines(lineDrawPoints, 0 , cnt, paint); //Draw remaining lines
memoryCanvas.setBitmap(memoryBitmap); //Set the original
memoryCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR); //Clear original
memoryCanvas.drawBitmap(emptyBitmap, 0.0f, 0.0f, paint); //Draw the final image
canvas.drawBitmap(memoryBitmap, 0, 0.0f, paint); //And finally draw on real canvas
Any help, tips, suggestions are very welcome.
Cheers
Wilhelm
When there is only a simple transform set on Canvas (a simple transform = translate only, no rotate, no scale), Skia, Android's 2D rendering library, aligns bitmaps to the pixel grid. This means that a move by less than 1 pixel might not be visible at all. A silly workaround is to set a very, very small scale or rotate transform on Canvas before drawing your bitmap. This has the side effect of not snapping bitmaps to the pixel grid.
I think I should just add a new API on Paint to let apps do subpixel positioning of bitmaps no matter what transform is set.

Make certain area of bitmap transparent on touch --> again

I'm trying to achieve the same results as per thread:
Make certain area of bitmap transparent on touch.
I'm stick to code presented in this answer: Lumis answer and acording to SteD this solution should work.
Unfortunately is not working for me (and also for another user: Make certain area of bitmap transparent on touch doesn't works, it's draw a black circle), I'm just getting black circle.
I tried many things but not get this solve. Make background transparent as per suggestion from second thread do not make any difference.
After many experiments I found that transparency is working, when I'm set this
android:theme="#android:style/Theme.Translucent"
in my AndroidManifest.xml I can see everything under my application i.e. desktop.
I went through code many times and cant see obvious mistake, only reason I thinking is cause this is Z order, but bitmaps and canvas do not maintenance z orders. Z ordering is done by drawing in certain order (which is correct in this code).
Is this some strange example of optimisation in android code, or I'm missing something in android manifest file?
Finally I found solution that's working:
#Override
public void onDraw(Canvas canvas){
super.onDraw(canvas);
//draw background
canvas.drawBitmap(bgr, 0, 150, null);
//copy the default overlay into temporary overlay and punch a hole in it
c2.drawBitmap(overlayDefault, 0, 0, null); //exclude this line to show all as you draw
c2.drawCircle(X, Y, 80, pTouch);
//draw the overlay over the background
//canvas.drawBitmap(overlay, 0, 0, null);
Paint new_paint = new Paint(/*Paint.ANTI_ALIAS_FLAG*/);
new_paint.setXfermode(new PorterDuffXfermode(Mode.SRC_ATOP));
canvas.drawBitmap(overlay, 0, 0, new_paint);
}
But I don't understand why is working. I was investigate xfermodes with this source code: android Xfermodes demo and according to this image: Xfermodes image
It not make any sense, apart that xfermode make sure that overlay bitmap is bean drawn second (Z order) and transparency came to play. But Z order should be maintained by drawing order.
If somebody have better idea how to solve this, please share your knowledge.
Regards.
you can edit onDraw() method:
public void onDraw(Canvas canvas){
super.onDraw(canvas);
canvas.drawColor(Color.TRANSPARENT);
canvas.drawBitmap(bgr, 0, 0, null);
c2.drawCircle(X, Y, 10, pTouch);
Paint new_paint = new Paint(/*Paint.ANTI_ALIAS_FLAG*/);
new_paint.setXfermode(new PorterDuffXfermode(Mode.SRC_ATOP));
canvas.drawBitmap(overlay, 0, 0, new_paint);
}
I tried and it worked !
Hope this solution helps you

Gradient appears banded in a SurfaceView, but looks very smooth in a normal View

My problem is that when drawing a simple test image (a rectangle with a gradient fill) within a SurfaceView, the gradient has colour banding. When drawing exactly the same rectangle with the same gradient in a simple extended View, the gradient looks very smooth, and as nice as I would expect for 32-bit colour.
This is occurring side by side using the test SurfaceView placed alongside the test View within the same layout in the same Activity.
For information, in the Activity class I am calling window.setFormat(PixelFormat.RGBA_8888) to switch the Activity to 32-bit colour, as this was the solution in the past to eliminate banding in gradients (however, I believe that this is no longer necessary at a certain Android level, where 32-bit is the default). My minSdkVersion is 8.
The test code that appears in the onDraw() of both the simple extended View and the SurfaceView is:
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(false);
paint.setFilterBitmap(false);
paint.setDither(false);
Shader shader = new LinearGradient(
0,
0,
0,
200,
new int[]{0xff150d2f,0xff432b96},
null,
Shader.TileMode.CLAMP
);
paint.setShader(shader);
canvas.drawRect(0,0,getWidth(),getHeight(), paint);
Here is the screenshot showing the SurfaceView above and the normal View beneath. I realise that the banding is very subtle in this example; it's even more apparent when the gradient sweeps over a smaller band of colours.
Any suggestions, please?
Trev
Found the solution myself in the end by adding this into the SurfaceView's constructor:
getHolder().setFormat(PixelFormat.RGBA_8888);

Banding on a PNG in Android despite ARGB8888 and Gingerbread [duplicate]

My problem is that when drawing a simple test image (a rectangle with a gradient fill) within a SurfaceView, the gradient has colour banding. When drawing exactly the same rectangle with the same gradient in a simple extended View, the gradient looks very smooth, and as nice as I would expect for 32-bit colour.
This is occurring side by side using the test SurfaceView placed alongside the test View within the same layout in the same Activity.
For information, in the Activity class I am calling window.setFormat(PixelFormat.RGBA_8888) to switch the Activity to 32-bit colour, as this was the solution in the past to eliminate banding in gradients (however, I believe that this is no longer necessary at a certain Android level, where 32-bit is the default). My minSdkVersion is 8.
The test code that appears in the onDraw() of both the simple extended View and the SurfaceView is:
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(false);
paint.setFilterBitmap(false);
paint.setDither(false);
Shader shader = new LinearGradient(
0,
0,
0,
200,
new int[]{0xff150d2f,0xff432b96},
null,
Shader.TileMode.CLAMP
);
paint.setShader(shader);
canvas.drawRect(0,0,getWidth(),getHeight(), paint);
Here is the screenshot showing the SurfaceView above and the normal View beneath. I realise that the banding is very subtle in this example; it's even more apparent when the gradient sweeps over a smaller band of colours.
Any suggestions, please?
Trev
Found the solution myself in the end by adding this into the SurfaceView's constructor:
getHolder().setFormat(PixelFormat.RGBA_8888);

Categories

Resources