I am trying to use Android's onDraw function to draw rectangles and lines with shadows around them so they can be seen on a white backgrounds. I have my Paint set up to have a shadowlayer but there is no shadow when the lines are drawn.
Here is my code for the Paint:
paint = new Paint();
paint.setColor(Color.WHITE);
paint.setStyle(Paint.Style.FILL);
paint.setTextSize(m_textSize);
paint.setAntiAlias(true);
Typeface font = Typeface.create("Times New Roman", Typeface.NORMAL);
paint.setTypeface(font);
paint.setShadowLayer(5, 0, 0, Color.BLACK);
this.setLayerType(View.LAYER_TYPE_HARDWARE, paint);
And here is my drawing code:
private void drawMark(Canvas c, float y, float size)
{
float x = (float) (getWidth()-5.0-size);
c.drawRect(x, y, x + size, y + markHeight, paint);
}
Is there something I am missing to make the shadow work for drawRect?
Please note that I am also using the canvas to draw text and the text does get the shadow effect, but shapes and lines do not.
Thanks
The shadows will only appear when you're drawing in software mode:
this.setLayerType(View.LAYER_TYPE_SOFTWARE, paint);
Related
I am ddrawing a circle on the bitmap and setting this bitmap to ImageView. the circle is drawn correctly but i dont want it to be a filled circle is there any way to make the filled area transparent?
i am using the following code
Bitmap bmp = RasterImageConverter.convertToBitmap(_loadedImage, ConvertToImageOptions.NONE.getValue());
Canvas c = new Canvas(bmp);
c = new Canvas(bmp);
myimgview.draw(c);
Paint p = new Paint();
p.setColor(Color.RED);
float x=(float) circleX;
float y=(float) circleY;
float Tx=(float) textX;
float Ty=(float)textY;
// c.drawLine(x, y, xend, yend, p);
c.drawCircle(300, 300, 200, p);
c.drawText(myText, Tx, Ty, p);
myimgview.setImageBitmap(bmp);
You need to inform the paint that you dont' use a fill style, but a stroke style.
The default is FILL
The Style specifies if the primitive being drawn is filled, stroked, or both (in the same color). The default is FILL.
So your code must be:
Paint p = new Paint();
p.setStyle(Paint.Style.STROKE);
Here are explained the differences between the different styles.
STROKE
Geometry and text drawn with this style will be stroked, respecting the stroke-related fields on the paint.
FILL
Geometry and text drawn with this style will be filled, ignoring all stroke-related settings in the paint.
FILL_AND_STROKE
Geometry and text drawn with this style will be both filled and stroked at the same time, respecting the stroke-related fields on the paint.
You need to change the Paint style to stroke:
Paint p = new Paint();
p.setStyle(Paint.Style.STROKE);
Use the setStyle(Paint.Style.STROKE) method on your paint p instance.
You are almost there... you need to set the style of the Paint object...
by invoking the method
p.setStyle(Paint.Style.STROKE);
The options are:
Example:
Bitmap bmp = RasterImageConverter.convertToBitmap(_loadedImage, ConvertToImageOptions.NONE.getValue());
Canvas c = new Canvas(bmp);
c = new Canvas(bmp);
myimgview.draw(c);
Paint p = new Paint();
p.setColor(Color.RED);
p.setStyle(Paint.Style.STROKE);
I have a custom wheel picker view I'm working on as above. Is it possible to color the text that the blue rectangle highlights to white, even if just partially? So if it's 50% on the text, it'll change half of it to white, half to black?
Edit:
I'm using Java code (ported to C#) from here: https://code.google.com/archive/p/android-wheel/.
Basically, the blue rectangle is an xml defined shape that I place behind the scrollable text in code.
I then draw the rectangle, and the items on top, using this code:
/**
* Draws items
* #param canvas the canvas for drawing
*/
private void drawItems(Canvas canvas)
{
canvas.Save();
int top = (currentItem - firstItem) * getItemHeight() + (getItemHeight() - this.Height) / 2;
canvas.Translate(PADDING, -top + scrollingOffset);
itemsLayout.Draw(canvas);
canvas.Restore();
}
/**
* Draws rect for current value
* #param canvas the canvas for drawing
*/
private void drawCenterRect(Canvas canvas)
{
int center = this.Height / 2;
int offset = (int)(getItemHeight() / 2 * 1.2);
centerDrawable.SetBounds(0, center - offset, this.Width, center + offset);
centerDrawable.Draw(canvas);
}
From what I can tell, the rectangle itself doesn't have a text attribute to set properties like highlighting or ColorPrimaryInverse.
Edit 2:
From what I can tell I need to use Volodymyr's code in an overriden onDraw for each of the TextViews that make up my control. This is what I have so far:
protected override void OnDraw(Canvas canvas)
{
Rect rect = new Rect();
this.GetDrawingRect(rect);
Paint mpaint = new Paint();
mpaint.Color = Color.Black;
mpaint.SetStyle(Style.Fill);
canvas.Save();
canvas.ClipRect(rect, Region.Op.Difference);
this.SetTextColor(Color.Black);
base.OnDraw(canvas);
canvas.Restore();
mpaint.Color = Color.White;
canvas.Save();
canvas.ClipRect(rect, Region.Op.Replace); // lets draw inside center rect only
this.SetTextColor(Color.White);
base.OnDraw(canvas);
canvas.Restore();
}
But this only changes the text color to white for all elements. I feel like I'm close here, any help would be appreciated!
There is couple ways to do that or something similar:
You can use the Canvas.clipRect method, pass the selection rectangle and render text with other color. So your code will be like:
private draw(Canvas canvas)
{
RectF centerRect = new RectF(....); // change to your values
drawCenterRect(canvas);
canvas.save();
canvas.clipRect(centerRect, Region.Op.DIFFERENCE); // lets draw everywhere except center rect
drawItems(canvas, Color.BLACK); // Pass color outside selection
canvas.restore();
canvas.save();
canvas.clipRect(centerRect, Region.Op.REPLACE); // lets draw inside center rect only
drawItems(canvas, Color.WHITE); // Pass color inside selection
canvas.restore();
}
(Advanced) You can render text on new layer/bitmap and than combine it with ColorFilter like to make the contrast.
I'm trying to draw one rectangle that's light gray over another rectangle that's white on a canvas, but it doesn't seem to do anything. Here's what I've got:
public void onDraw(Canvas c) {
Paint paint = new Paint();
paint.setColor(Color.LTGRAY);
c.drawRect(0, 0, width, height, paint);
paint.setColor(Color.WHITE);
c.drawRect(10, 10, width - 10, height - 10, paint); //This is slightly smaller than the gray rectangle, so it looks kinda like a border.
}
To display this, I use setContentView() in the main activity to set the view to a new class extending SurfaceView. When the surface is created in the custom SurfaceView, it starts a thread that executes onDraw() every 100 milliseconds. I got the Canvas by using holder.lockCanvas(), then onDraw()ing and holder.unlockCanvasAndPost(c).
Where are you initializing your width and height? Are they set to 0?
Try calling canvas.getWidth() or canvas.getHeight().
Bitmap newBm = ...
Canvas canvas = new Canvas(newBm);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.WHITE);
paint.setTextSize((int) (44 * scale));
Rect bounds = new Rect();
paint.getTextBounds(gText, 0, gText.length(), bounds);
canvas.drawText(gText, x, y, paint);
I drew text on the Bitmap like so. How could I get a grey background that is the same height as the text but covers the whole screen??
You could use a Rect. Before drawing the text draw the Rect to the screen:
int screenWidth = getApplicationContext().getResources().getDisplayMetrics().widthPixels;
Rect greyBack = new Rect(0,top,screenWidth,bottom);
Paint paint = new Paint();
paint.setARGB(128, 100, 100, 100); //added alpha because Snapchat has translucent //grey background
canvas.drawRect(greyBack, paint);
top and bottom need to be coordinates above and below the text. You could use y's value and take away a bit for top and add a bit for bottom. How much you add/subtract is up to you and changes the height of the greyBack background.
The best way to see and learn how these sort of things are done with well written code is to look at the android source code itself. For example here is the onDraw method for a TextView it includes additional stuff you won't probably need like compoundPadding, but you can follow it through and get the basic concept of how it's done.
How can i draw text on canvas as shown in below image highlighted in Green rectangle .
I have done following code.... but from this code i can write text in straight. can't write text at angle.
Bitmap bmpLayered = Bitmap.createBitmap(bmpMain.getWidth(), bmpMain
.getHeight(), Bitmap.Config.ARGB_8888);
Canvas cv = new Canvas(bmpLayered);
Paint charPaint = new Paint();
charPaint.setAntiAlias(true);
charPaint.setStyle(Paint.Style.FILL);
charPaint.setTextSize(24);
charPaint.setColor(Color.BLACK);
charPaint.setStrokeWidth(3);
cv.drawText("None", 570, 222, charPaint);
Please help me to solve this.
Thanks.
cv.save();
cv.rotate(-45, x, y);
cv.drawText("your text here", x, y, paint);
cv.restore();
where cv being reference to your canvas, x & y the point where you want to draw.
After you've drawn the text to the canvas you could rotate the canvas.
cv.drawText("None", 570, 222, charPaint);
//rotate the canvas
cv.rotate(45f);
// or around a pivot point
cv.rotate(45f, 100, 100);
Android Developer: Graphics-Canvas Rotate