When I call drawCircle (ex. canvas.drawCircle(x, y, r, mPaint);) and I use Paint Style STROKE to initialize the parameter mPaint, the result doesn't quite make a full 360 degrees (2*PI radian) circle in all cases. Sometimes you get a full circle (as I would expect) and sometimes only an arc.
Does someone have an idea what would cause this to happen ?
I don't know what cases work and which don't (yet). I've noticed the ones that don't work seem to be the larger circles I'm drawing (>100.0 radius). Could be size related. I am using floating point for x, y and r. I could try rounding to the nearest int when in the drawing code.
Are you doing anything else to the canvas before the drawCircle? This could happen if, for example you are scaling the canvas or transforming it before you draw the circle.
Related
I want a circle on the canvas in android app.
It can be done either using a bitmap of circle or actually drawing a circle.
I have done both but the circle in later has rough edges.
Why is this happening. And how can i get the Circle as i expect ?
edit:
Since android is running on phones varying in pixel density and screen size, is there a recommended method ? I want the circle to be smooth all the time.
Try
paint.setAntiAlias(true)
or set a flag during creation
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
And tell us if it works
I am trying to draw a dynamic radar, but I can't get the cone shape to draw properly. I can get the two lines to work fine, but I can't get the shading between them to work.
My Goal:
What I am getting:
And this is my code:
paint.setColor(Color.WHITE);
RectF oval = new RectF(0,0,200,200);
canvas.drawArc(oval,(float)globalAzimuth+26, (float)globalAzimuth-26,false,paint);
globalAzimuth is the direction the phone is facing. The radar spins as the phone does. The lines spin fine and synchorinized, but the arc just gets bigger and is obviously terribly off.
Does anyone know how to do this?
It looks like you're treating the parameter sweepAngle as a stop angle. It should be the number of degrees to sweep, clockwise from startAngle.
From the docs:
sweepAngle : Sweep angle (in degrees) measured clockwise
Edit : It looks like you could use a constant 52 as the sweep angle, since you're just going 26 degrees in either direction from globalAzimuth(although your lines appear closer together than 52 degrees, so I'm not sure). If you do, you'll need to keep in mind that it goes clockwise, so your startAngle should be globalAzimuth - 26, rather than plus.
I am drawing an arc with a border by painting two arcs, one over the other the first being slightly larger.
The issue is with "slightly larger" this can end up with the border not always being even all the way round.
Both the arcs I am drawing have the same radius, I simply make it larger by adding a degree to the start and two degrees to the end (necessary to ensure the borders on either end of the arc are equal) and increasing the stroke width.
In the supplied picture the thicker border edge is the smallest I can possibly make it while it is still visible. (-1 degree off the inner arc)
I have considered drawing the arc outline with four separate calls two straight lines for either end and two arcs. This seems quite inefficient for what I want to achieve.
I am wondering if anyone has any suggestions about how else I could draw a border thats even, minimizing the number of draw/canvas rotation calls if possible.
Relevant code sample for current solution:
Paint mOutlinePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
Paint mFillPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mFillPaint.setStyle(Style.STROKE);
mFillPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
mFillPaint.setColor(Color.TRANSPARENT);
mFillPaint.setStrokeWidth(mValueWidth);
mOutlinePaint.setStyle(Style.STROKE);
mOutlinePaint.setStrokeWidth(mBorderWidth);
mOutlinePaint.setColor(Color.WHITE);
mRect.set(mHalfXSubRadius, mHalfYSubRadius, mHalfXAddRadius, mHalfYAddRadius);
canvas.drawArc(mRect, ARC_START-1, MAX_ARC+2, false, mOutlinePaint);
canvas.drawArc(mRect, ARC_START, MAX_ARC, false, mFillPaint);
U shouldnt make your arc bigger, instead try to draw the same sized arc (in white), X pixel right,down,up,left,corners as well (total of 8 drawings).
where X is the border size u want.
after that draw the main arc (in gray) in the middle.
psuedo code:
paint=white;
drawArc(x,y+2);
drawArc(x,y-2);
drawArc(x+2,y+2);
drawArc(x+2,y-2);
drawArc(x-2,y+2);
drawArc(x-2,y+2);
drawArc(x+2,y);
drawArc(x-2,y);
paint=gray;
drawArc(x,y);
So i'm making a custom View that displays some graphs (plots), and in some ocasions i want to rotate the canvas 90 degrees.
All i can guess is that there's a bug in my device (HTC Desire, with android 2.3), i haven't test it yet in another device.
#Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.save();
canvas.rotate((float) 90.0);
canvas.drawPoint(10, 10, pointPaint); /* Sorry about missing that these
* coordinates will fall out after being rotated... it's just an
* example. put 10, -10 and it should work, but it doesn't */
canvas.restore();
}
This won't draw the point, but if we change that 90.0 for a 90.014 (i found that this was the minimum, 90.013 doesn't work either) then the point will show up.
So... is it something i'm doing wrong, or it's just Android's bug? I googled a lot, but couldn't find nothing....
-Victor -
edit: Additional info: Only points doesn't work. Rects, lines and circles work perfect.
edit: screenshot of my app, you can see how the red line has dots on the 90.014 degree version, and the 90.0 doesn't.:
(As you can see, the 90.014 it looks like a little bit flipped (you can see how the Y axis is 'broken')
Setting the Paint of the dots to use a ROUND stroke cap resolves the problem, even though it doesn't yet explain the strange behavior you are experiencing. e.g.:
paint.setStrokeCap(Paint.Cap.ROUND)
The canvas rotates through its origin, so if you rotate your canvas by 90 degrees you are effectively rotating your view out of your screen. You should translate the canvas to the axis you want to rotate on first:
canvas.save();
canvas.translate(-axispointx,-axispointy);
canvas.rotate((float) 90.0);
canvas.translate(axispointx,axispointy);
canvas.drawPoint(10, 10, pointPaint);
canvas.restore();
Good day,
I have weird problem with drawing image. Code and pictures say more then words.
mCamera.save();
mCamera.rotateX(rotateX);
mCamera.getMatrix(mMatrix);
mCamera.restore();
canvas.save();
canvas.setMatrix(mMatrix);
// here I draw images
...
canvas.restore();
and results are at images below. First picture have angle 0, second around 45 degree and last something more. It depend on size of area (number of bitmaps) I want to draw. I notice that when I draw bitmaps that whole fits canvas bounds, it works fine. But problem is mainly when I draw images with something like (so with part outside of canvas)
canvas.drawBitmap(image, -100, -100, null)
and images (hmm, because I'm new here, I cannot post images directly ...)
ttp://locus.asamm.cz/data/_temp/1311873666794.png
http://locus.asamm.cz/data/_temp/1311873695945.png
http://locus.asamm.cz/data/_temp/1311873782054.png
So question is, if there is any working solution or at least any tip. Also if anyone experienced can tell if drawing with OpenGL can help with this and if so, please point me to any information source that can help me with drawing bitmaps that change a lot (it's map application so user move with map), because I still cannot find any simple and clear source of info.
Thanks to all very much
It's a limitation of the 2D drawing API. To do true 3D you should use OpenGL.
I expect you are trying to produce a google maps tilt/rotate effect which I have successfull done for google maps since they don't think we need an update ;-) and I needed it for my application, even if you are using your own tiles it's basically the same thing.
One thing that helps is realize that the rotations for the Camera Matrix are performed in the upper left corner.
So you should transform to the appropriate location (dependent on axis of rotation and your expected results) and then back, something like ... the effects you are getting were very similar to mine before I read the docs and figured that out.
camera.save();
camera.rotateX(tilt); // tilt forward or backward
camera.rotateY(0);
camera.rotateZ(angle); // Rotate around Z access (similar to canvas.rotate)
camera.getMatrix(cameraMatrix);
// This moves the center of the view into the upper left corner (0,0)
// which is necessary because Matrix always uses 0,0, as it's transform point
// use the center of the canvas, or the bottom center dependent on your results
cameraMatrix.preTranslate(-centerX, -centerY);
// NOTE: Camera Rotations logically happen here when the canvas has the matrix applied
// This happens after the camera rotations are applied, moving the view back to
// where it belongs, allowing us to rotate around the center or any point we choose
// Move it back after the rotations are applied
cameraMatrix.postTranslate(centerX, centerY);
camera.restore();
canvas.concat(cameraMatrix);
The other thing to do is to oversize the container so you don't have empty space (or at least limit it) after your tilt/rotate operations, you can do that by calculating the needed oversize, the diagonal of your display works for basic rotation, + a percentage based on tilt if you are using that.
Playing around with the pre/postTranslate can can give you some interesting results.
As to moving the bitmap I am not really sure why you are doing this, probably panning, but as long as the canvas is getting filled it shouldn't matter
Update
Here is how I oversize the canvas, I tried to use the LayoutParams to do this but didn't have much luck with it so on Measure was the way to go for me.
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
if (!isInEditMode())
super.onMeasure(View.MeasureSpec.makeMeasureSpec(scaledDimensionsW,
View.MeasureSpec.EXACTLY),
View.MeasureSpec.makeMeasureSpec(scaledDimensionsH,
View.MeasureSpec.EXACTLY));
else
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}