How to fill a freedrawn shape with colour - java

Im making a program using Java for android.
I'm drawing alot of rectangles on a bitmap using 4 lines connecting. ATM the lines are black and the background is white, i want to fill these "boxes" with colour and i cant figure out how to do it.
to change from drawing 4 lines into making a box from the start is not an option, i have to draw lines that form a box.
im thinking of something that takes an argument of x,y in the middle of the "box" and then filling it with pixles until it hits the edge of the box but i cant get it to work.
it needs to be reapeteble too, i have alot of boxes to fill.
im using android 2.1 with API 7

You can quite simply do this with a Path. It works as you're talking about -- move from point to point "drawing lines" -- but when you're done you can fill it.
Paint paint = new Paint();
paint.setStyle(Style.FILL);
// set other paint parameters, like color...
...
Path path = new Path();
path.moveTo(startX, startY);
path.lineTo(startX, startY + 50);
path.lineTo(startX+50, startY + 50);
path.lineTo(startX+50, startY);
canvas.drawPath(path, paint);

Use Paths. You can create your lines in a path, and then when you draw the path on the canvas, it will filled with the paint. You can also add a stroke to the path to add a border to the shape.

Related

Android different multiple color in textview based on background [duplicate]

I am writing a custom progress bar. I would like to create an effect similar to
where the "50%" text color changes dynamically to white while the black bar progresses right. Is that possible using "simple" solutions? I looked up PorterDuff, ColorFilters, xFermodes, nothing seems to work. Any ideas? ATM my code looks sth like this:
Rect r = new Rect(1, 1, m_width-1, m_height-1);
canvas.drawRect(r, pWhiteFill);
r = new Rect(1, 1, progressWidth, m_height-1);
canvas.drawRect(r, pBlackFill);
canvas.drawText(String.valueOf(progress)+"%", m_width/2, m_height/2, pBlackTxtM);
Is there a way to modify pBlackTxtM paint to change color based on whats drawn below it 'on the canvas'?
Even if the question is quite old I'd like to share the solution to this.
You can't do this using an "inverting" Paint, but you can achieve it using clipping.
The idea is to draw the text twice, once in black and once in white color, while setting the clipping region to match respective part of the bar.
Here is some code to outline the idea:
// store the state of the canvas, so we can restore any previous clipping
canvas.save();
// note that it's a bad idea to create the Rect during the drawing operation, better do that only once in advance
// also note that it might be sufficient and faster to draw only the white part of the bar
Rect r = new Rect(1, 1, m_width-1, m_height-1);
canvas.drawRect(r, pWhiteFill);
// this Rect should be created when the progress is set, not on every drawing operation
Rect r_black = new Rect(1, 1, progressWidth, m_height-1);
canvas.drawRect(r_black, pBlackFill);
// set the clipping region to the black part of the bar and draw the text using white ink
String text = String.valueOf(progress)+"%";
canvas.cliprect(r_black);
canvas.drawText(text, m_width/2, m_height/2, pWhiteTxtM);
// draw the same text again using black ink, setting the clipping region to the complementary part of the bar
canvas.clipRect(r, Region.Op.XOR);
canvas.drawText(text, m_width/2, m_height/2, pBlackTxtM);
canvas.restore();

Alternative to using Graphics2D Area?

I'm making a game where you start by drawing your map. At the moment it works by having an Area instance variable and then when the player clicks/drags the mouse it adds Ellipse2Ds to it. Here's what I mean:
Area land = new Area();
And then in the MouseDragged method
Point2D mouse = e.getPoint();
Ellipse2D ter = new Ellipse2D.Double(mouse.getX() - drawRad, mouse.getY() - drawRad, drawRad*2, drawRad*2);
land.add(new Area(ter));
And then basically the same except land.subtract(new Area(ter)) for erasing.
My problem with this is that after doing a lot of drawing it becomes very slow to draw the Area. the other problem is that I would like to be able to easily get the outline of the drawing, and I haven't found a good way of doing that using Areas. Using area.getPathIterator is not nearly accurate enough.
So I'm wondering what other ways of saving drawings are? I can't just have an array of Ellipses because then erasing wouldn't work.
Thanks!
If you are drawing the same thing over and over it may be worth while to draw it to an image once or load it from a file at start up and then just paint the image rather than painting all the individual shapes.
To load from a file, put your picture file in the same directory as your .java file and load:
BufferedImage img = ImageIO.read(this.getClass().getResource("picture.png"));
To draw on the image once:
BufferedImage img = new BufferedImage(width,height, BufferedImage.TYPE_4BYTE_ABGR);
Graphics2D g = img.createGraphics();
In your paintComponent method you draw the image somewhere.
g.drawImage(img, 0, 0, this);
If you have something moving over a background, instead of adding and subtracting the moving item. Just draw the background and then draw the thing that moves, drawing the background will effectively erase the old position with less computation.

libgdx distorted texture when using camera.setToOrtho(false, GAME_WIDTH, GAME_HEIGHT);

I'am trying to make libgdx game, adn i've got 2 problems now:
1. When im using camera.setToOrtho(false, GAME_WIDTH, GAME_HEIGHT); my textrure of player is distored, one eye is bigger than another.
2. Im using this camera and viweport:
camera= new OrthographicCamera(GAME_WIDTH,GAME_HEIGHT);
camera.setToOrtho(false, GAME_WIDTH, GAME_HEIGHT);
viewport = new StretchViewport(GAME_WIDTH,GAME_HEIGHT,camera);
and when i do :
touchPos.set(Gdx.input.getX(1),Gdx.input.getY(1),0);
game.camera.unproject(touchPos);
System.out.println(touchPos.x+" "+ touchPos.y);
I get 0 0 in right top corner but my character witch cords 0 0 is drawing in left bottom corner.
When i use:
game.camera = new OrthographicCamera(820,480);
game.viewport = new FillViewport(820,480,game.camera);
i must use game.batch.setProjectionMatrix(game.camera.combined);
when i use this code i've got corectly working unproject method and coordinate system but i've got distored texture.
When i use:
camera = new PerspectiveCamera();
viewport = new StretchViewport(900, 470, camera);
i've got distored texture and bad coords system. and i can 't use :game.batch.setProjectionMatrix(game.camera.combined);
It is distorted because you are using a fixed width and height for the camera, so it simply stretches to fit whatever size window/screen you're putting it on.
Incidentally, StretchViewport does the same thing (distorts the scene to fit the dimensions you gave it to the window). But you just created a viewport without actually calling update() on it, so it's not doing anything.
You most likely want to use ExtendViewport or FillViewport to avoid stretching, but other options are available. Read about them here.
Your viewport won't properly respond to screen rotations (or desktop window resize) unless you put viewport.update(width,height) into the resize method. And you have to call update on it at least once regardless, using the actual screen dimensions. This is most convenient by simply putting viewport.update(width,height) into the resize method.

How to draw a triangular portion of a bitmap

I am attempting to draw a triangular portion of a bitmap. I already know how to draw a filled triangle using path, and I already know that the answer may involve something called BitmapShader, but I can not find any clear documentation or examples to put it all together.
EDIT: After much flailing and experimentation, I am now nearly there. My code looks like this:
Paint paint;
Path path = new Path();
BitmapShader bms = new BitmapShader(shrub_bitmap,TileMode.REPEAT ,TileMode.REPEAT );
paint.setStyle(Style.FILL);
paint.setShader(bms);
path.reset();
path.setFillType(Path.FillType.EVEN_ODD);
path.moveTo(x1,y1);
path.lineTo(x2,y2);
path.lineTo(x3,y3);
path.close();
canvas.drawPath(path, paint);
paint.setShader(null);
The only remaining problem is that the bitmap from which the triangle is drawn is rooted to the screen coordinates. This means that when the triangle is being animated (i.e. being drawn at various points around the screen), it has the appearance of being a window allowing us to see a static image underneath. What I actually want is for the bitmap to be tied to the triangle so that the triangle looks like a solid object moving around. Any idea how to fix that?
for your second question:
try using canvas.translate(x1, y1) and moveTo(0, 0), lineTo(x2 - x1, y2 - y1) ...

GeneralPath not drawing with changed scale

Im currently making a sidescroller game which uses randomly generated terrain that scrolls in the background. The terrain is basically an instance of the GeneralPath class. When the terrain generates, the corners (0, 0) and (width, 0) are included in the path since the height of the viewing canvas isnt known yet. To make the terrain appear right-side-up, i added the following lines of code:
g.translate(0, getHeight());
g.scale(0, -1);
This should flip the coordinate system into Cartesian format with the bottom left being 0, 0.
For some reason, the terrain isnt drawing. When i comment-out these lines, it works, but is upside-down. If i only comment out the scale command and change the amount translated by to a smaller number, it also draws successfully (upside-down and translated a small amount).
Thanks in advance!
As you noticed, you need to scale the x axis as well - g.scale(1, -1);

Categories

Resources