Processing Java - Problem with draw an eclipse or load pic - java

i'm testing a code in Processing with Java for my school.
I try to create a game and i have a problem to draw an eclipse or to load a picture.
I think the picture or the eclipse is drawing under my game board .. I don't know how to solved it.
I have a txt file for the game board ( by level).
An example :
110000000
000000031
000000000
100000000
000000000
000000000
200000001
Please, can you help me
thank you
int cols, rows, w, x, y,level;
String lines[];
PImage flag;
void setup() {
size(460,360);
cols = 9;
rows = 7;
w = 50 ;
x= 0;
y = 0;
level = 1;
lines = loadStrings("../../data/niveau"+level+".iwk");
flag = loadImage("../../data/flag.png");
ellipseMode(CORNER);
}
void draw() {
String lines[]= loadStrings("../../data/niveau"+level+".iwk");
loadCard(cols,rows,w,x,y,lines,flag);
}
void loadCard(int cols, int rows, int w, int x,int y,String lines[],PImage flag) {
for (int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
if(lines[i].charAt(j) == '1'){
fill(156, 158, 162);
}
else if(lines[i].charAt(j) == '2'){
fill(225, 169, 26) ;
ellipse(x,y,w/2,w/2);
}
else if(lines[i].charAt(j) == '3'){
image(flag,x,y,w/2,w/2);
}else {
fill(23, 159, 215);
}
rect(x, y, w, w);
x = x + w ;
}
y = y + w ;
x = 0 ;
}
}

It is indeed drawn under the game board.
Check the loadCard function. First the ellipse / image is draw, then a rect is draw with the same x / y, ergo on top of it.
A modified your code a little, it should show the ellipses / image
void loadCard(int cols, int rows, int w, int x,int y,String lines[],PImage flag) {
for (int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
//draw default so ellipse / img has a background
fill(23, 159, 215);
rect(x, y, w, w);
//draw other cases on top of default
if(lines[i].charAt(j) == '1'){
fill(156, 158, 162);
rect(x, y, w, w);
}
else if(lines[i].charAt(j) == '2'){
fill(225, 169, 26) ;
ellipse(x,y,w/2,w/2);
}
else if(lines[i].charAt(j) == '3'){
image(flag,x,y,w/2,w/2);
}
x = x + w ;
}
y = y + w ;
x = 0 ;
}
}
Since you're learning, allow me to give you 2 tips:
loadStrings() needs to happen only once per level. You should not put it in draw(), because draw() is called every frame. It is already called in setup, that is fine for now. Eventually you can put it in a separate function, and call this function at the beginning of a new level.
If you use a double for loop to draw a game board, you can use the iterators (int i and int j) as x/y variables. Instead of rect(x, y, w, w); you can use rect(i*w, j*w, w, w);. This way you'll have fewer variables to manage.

Related

How to Get an Objects X position in processing

I am trying to make Space Invaders in Processing. I am currently working on getting the enemy to move correctly. I have got them to be drawn in the right spot but I haven't gotten them to be moved correctly. Here is my code:
PImage mainPlayer;
PImage enemyPlayer;
float Xspeed = 60;
float Yspeed = 60;
float X;
float Y;
Enemy EnemyPlayer = new Enemy("EnemyPlayerSpaceInvaders.png", 10, 10, 6);
void setup() {
size(1400, 800);
//enemyPlayer = loadImage("EnemyPlayerSpaceInvaders.png");
mainPlayer = loadImage("MainPlayerSpaceInvaders.png");
}
void draw() {
background(0);
Enemy[] enemyPlayer = new Enemy[60];
for (int i = 0; i < 5; i += 1) {
for (int j = 0; j < 11; j += 1) {
enemyPlayer[j *i] = new Enemy("EnemyPlayerSpaceInvaders.png", 50 + j * 100, 5 + 75 * i, 6);
}
}
for (int i = 0; i < 5; i += 1) {
for (int j = 0; j < 11; j += 1) {
if(enemyPlayer[j * i].alive){
enemyPlayer[j * i].Draw();
}
enemyPlayer[j *i].moveAndDraw(6);
}
}
}
class Enemy {
boolean alive = true;
float x;
float y;
float speed;
String playerTexFile;
PImage playerTex;
Enemy(String PlayerTexFile, float X, float Y, float Speed){
x = X;
y = Y;
speed = Speed;
playerTexFile = PlayerTexFile;
}
void Draw(){
playerTex = loadImage(playerTexFile);
image(playerTex, x, y);
}
void moveAndDraw(float Speed){
playerTex = loadImage(playerTexFile);
if(alive){
x += Speed;
if (x >= 1300) {
x = 100;
y += 50;
}
}
}
}
Here is my result:
The Draw function works but what you're seeing that is messing it up is the moveAndDraw() function.
And the enemy drawings aren't moving. I have made this before with c++ SFML but in that there is a very basic getPosition function. The reason I want to get position is that right now I'm having to use inaccurate numbers as the X and Y position and for the enemy to move correctly I need to know exactly what it's position is. I have checked multiple pages on processing.org but none of them helped. I haven't found any getPosition void and all the ones I've seen other people using a void to do this I just haven't been able to get it to work. If there is some code that could get me this to work or just some function I've looked over and even a website page I could look at I'd be open to it. Please tell me anything I can do to get this working.
The issue is that you recreate the enemies in every frame at it's initial position:
void draw() {
background(0);
Enemy[] enemyPlayer = new Enemy[60];
for (int i = 0; i < 5; i += 1) {
for (int j = 0; j < 11; j += 1) {
enemyPlayer[j *i] = new Enemy("EnemyPlayerSpaceInvaders.png", 50 + j * 100, 5 + 75 * i, 6);
}
}
// [...]
}
You've to:
Create a global array of enemies Enemy[] enemyPlayer (and delete PImage enemyPlayer).
Create and initialize the enemies in setup.
Use and move the existing enemies in draw:
Further note, that your loops doesn't do what you expect it to do. Create the enemies in 2 nested loops. If i runs from o to 6 and j from 0 to 10, the the index of an enemy is i*10 + j.
The enemies can be moved in a single loop from 0 to enemyPlayer.length.
//PImage enemyPlayer; <--- DELETE
// global array of enemies
Enemy[] enemyPlayer = new Enemy[60];
// [...]
void setup() {
size(1400, 800);
mainPlayer = loadImage("MainPlayerSpaceInvaders.png");
// create enemies
for (int i = 0; i < 6; i += 1) {
for (int j = 0; j < 10; j += 1) {
enemyPlayer[i*10 + j] = new Enemy("rocket64.png", 50 + j * 100, 5 + 75 * i, 6);
}
}
}
void draw() {
background(0);
// move enemies
for(int i = 0; i < enemyPlayer.length; ++i ) {
if(enemyPlayer[i].alive){
enemyPlayer[i].Draw();
}
enemyPlayer[i].moveAndDraw(6);
}
}

Adding a JPanel with 86,000 Components

So I found Conway's Game of Life recently, so I'm naturally addicted. It hasn't taken me long to find out that I am very limited by my computer's CPU. I've also found that, for whatever reason, I cannot add a JPanel with many JComponents to a JFrame.
So I have a loop that adds 86,400 JLabels to a JPanel, which happens in ~1 second, but adding this JPanel to a JFrame takes ~2 minutes.
I understand I could use java.awt.Graphics, but I'd prefer to use JLabels because they automatically resize.
So my question: Why does this take so long to add the JPanel to the JFrame, and how do I fix it?
Using java.awt.Graphics, I was able to remove this long period of lag:
public void render(int[][] cells) {
int cellHeight = image.getHeight() / cells.length;
int cellWidth = image.getWidth() / cells[0].length;
for (int y = 0; y < cells.length; y++) {
for (int x = 0; x < cells[y].length; x++) {
int col = colors[cells[y][x]].getRGB();
fillSquare(x * (cellWidth), y * (cellHeight), cellWidth, cellHeight, col);
}
}
}
// Could pass a java.awt.Rectangle here
private void fillSquare(int xPos, int yPos, int width, int height, int col) {
for (int y = 0; y < height; y++) {
for (int x = 0; x < width; x++) {
pixels[(x + xPos) + (y + yPos) * image.getWidth()] = col;
}
}
}
#Override
public void paint(Graphics g) {
g.drawImage(image, 0, 0, getWidth(), getHeight(), null);
}
For this method, it's important to keep the JFrame's size proportional to the number of cells, this way there is no unused space within the JFrame.

How to specifically color one rect when it's hovered over?

How does one go about coloring an individual rectangle when it's hovered over? The specific method used below really doesn't give me any ideas on how to solve this problem. It generates a grid in the window using individual rectangles. How would it be possible to listen for mouseX and mouseY and color one rectangle without disrupting this code? Thanks.
int cols,rows;
int scl = 20;
int gridsize = 0;
void setup(){
size(400,400);
int w = 400;
int h = 400;
cols = w / scl;
rows = h / scl;
}
void draw() {
//mouseX, mouseY
background(r,g,b);
for (int x = 0; x < cols; x++){
for (int y = 0; y < rows; y++){
stroke(55);
//noFill();
fill(50,50,50);
rect(x*scl,y*scl,scl,scl);
}
}
}
For reference, I am using Processing 3 for Java.
You can always check if the mouse is within the bounds of a rectangle:
you know the mouseX,mouseY values
you know the x,y and size of each box
if mouseX is within x and x+size and mouseY is within y and y+size you're over a box.
Here's the above applied to your code (if condition formatting for easy visibility, feel free to re-format):
int cols, rows;
int scl = 20;
int gridsize = 0;
void setup() {
size(400, 400);
int w = 400;
int h = 400;
cols = w / scl;
rows = h / scl;
}
void draw() {
//mouseX, mouseY
background(255);
for (int x = 0; x < cols; x++) {
for (int y = 0; y < rows; y++) {
int xpos = x*scl;
int ypos = y*scl;
stroke(55);
if(
(mouseX >= xpos && mouseX <= xpos+scl) &&
(mouseY >= ypos && mouseY <= ypos+scl)
){
fill(90);
}else{
fill(50);
}
rect(xpos, ypos, scl, scl);
}
}
}
For more info also checkout the Processing Button example
George's answer works nicely for this scenario, but there is another, a little more complex way too if might want to go Object Oriented here. For this little example, you could have a Grid class which holds and manages an array of Cell objects. Or you can just skip the Grid class and manage the Cells in your main sketch. You could give the Cell class a function to render itself and you could give each cell a color and a size too, it's totally up to you. Also, it could have a function which tells you if your mouse is over it and a function to change its color. A skeleton would look like this:
class Cell {
float x,y;
float length, breadth;
color col;
Cell(float x, float y) {
this.x = x;
this.y = y;
length = 10;
breadth = 10;
col = color(0);
}
void render() {
fill(col);
rect(x, y, length, breadth);
}
void setColor(color col) {
this.col = col;
}
boolean mouseOver() {
if(mouseX > x && mouseX < x+length) {
if(mouseY > y && mouseY < y+breadth) {
return true;
}
}
return false;
}
Now you could just use this class and its methods in your main sketch to find the cell with the mouse over it and call setColor on it to change its color.
George's answer is correct. I upvoted it and I believe you should mark it as the correct answer. Yushi's answer is basically just George's answer, moved into a class.
They both use point-rectangle collision detection, which checks whether the point is inside the rectangle. You just check each rectangle against the point (in your case the mouse position), and that allows you to determine which rectangle the mouse is in. This will work even if you have a bunch of rectangles of different shapes, and will even work with overlapping rectangles.
The other way to do it is using grid-based collision detection which takes advantage of the fact that you have a bunch of evenly spaced rectangles that don't overlap. You'd just use division to figure out which cell the mouse was in, and then you'd convert that cell to coordinates, and you'd use those coordinates to draw the rectangle. That might sound confusing, but it looks like this:
int cols;
int rows;
int scl = 20;
void setup() {
size(400, 400);
cols = width / scl;
rows = height / scl;
}
void draw() {
background(100);
for (int x = 0; x < cols; x++) {
for (int y = 0; y < rows; y++) {
stroke(55);
fill(50, 50, 50);
rect(x*scl, y*scl, scl, scl);
}
}
int hoveredRectColX = int(mouseX / scl);
int hoveredRectRowY = int(mouseY / scl);
float rectX = hoveredRectColX * scl;
float rectY = hoveredRectRowY * scl;
fill(255, 0, 0);
rect(rectX, rectY, scl, scl);
}
The last block of code is the meat and potatoes. First it figures out which row and column the mouse is in, then figures out the position of that cell, and uses that to draw a rectangle. If this doesn't make sense, the best thing you can do is get out a piece of paper and a pencil and draw a bunch of examples to see the pattern of what's going on.
Shameless self-promotion: I wrote a tutorial on collision detection in Processing, including both point-rectangle and grid-based collision detection, available here.

Java 8 + Swing: How to Draw Flush Polygons

(Sorry for the long post... at least it has pictures?)
I have written an algorithm that creates a mosaic from an image by statistically generating N convex polygons that cover the image with no overlap. These polygons have anywhere between 3-8 sides, and each side has an angle that is a multiple of 45 degrees. These polygons are stored internally as a rectangle with displacements for each corner. Below is an image that explains how this works:
getRight() returns x + width - 1, and getBottom() returns y + height - 1. The class is designed to maintain a tight bounding box around filled pixels so the coordinates shown in this image are correct. Note that width >= ul + ur + 1, width >= ll + lr + 1, height >= ul + ll + 1, and height >= ur + ul + 1, or there would be empty pixels on a side. Note also that it is possible for a corner's displacement to be 0, thus indicating all pixels are filled in that corner. This enables this representation to store 3-8 sided convex polygons, each of whose sides are at least one pixel in length.
While it's nice to mathematically represent these regions, I want to draw them so I can see them. Using a simple lambda and a method that iterates over each pixel in the polygon, I can render the image perfectly. As an example, below is Claude Monet's Woman with a Parasol using 99 polygons allowing all split directions.
The code that renders this image looks like this:
public void drawOnto(Graphics graphics) {
graphics.setColor(getColor());
forEach(
(i, j) -> {
graphics.fillRect(x + i, y + j, 1, 1);
}
);
}
private void forEach(PerPixel algorithm) {
for (int j = 0; j < height; ++j) {
int nj = height - 1 - j;
int minX;
if (j < ul) {
minX = ul - j;
} else if (nj < ll) {
minX = ll - nj;
} else {
minX = 0;
}
int maxX = width;
if (j < ur) {
maxX -= ur - j;
} else if (nj < lr) {
maxX -= lr - nj;
}
for (int i = minX; i < maxX; ++i) {
algorithm.perform(i, j);
}
}
}
However, this is not ideal for many reasons. First, the concept of graphically representing a polygon is now part of the class itself; it is better to allow other classes whose focus is to represent these polygons. Second, this entails many, many calls to fillRect() to draw a single pixel. Finally, I want to be able to develop other methods of rendering these polygons than drawing them as-is (for example, performing weighted interpolation over the Voronoi tessellation represented by the polygons' centers).
All of these point to generating a java.awt.Polygon that represents the vertices of the polygon (which I named Region to differentiate from the Polygon class). No problem; I wrote a method to generate a Polygon that has the corners above with no duplicates to handle the cases that a displacement is 0 or that a side has only one pixel on it:
public Polygon getPolygon() {
int[] xes = {
x + ul,
getRight() - ur,
getRight(),
getRight(),
getRight() - lr,
x + ll,
x,
x
};
int[] yes = {
y,
y,
y + ur,
getBottom() - lr,
getBottom(),
getBottom(),
getBottom() - ll,
y + ul
};
int[] keptXes = new int[8];
int[] keptYes = new int[8];
int length = 0;
for (int i = 0; i < 8; ++i) {
if (
length == 0 ||
keptXes[length - 1] != xes[i] ||
keptYes[length - 1] != yes[i]
) {
keptXes[length] = xes[i];
keptYes[length] = yes[i];
length++;
}
}
return new Polygon(keptXes, keptYes, length);
}
The problem is that, when I try to use such a Polygon with the Graphics.fillPolygon() method, it does not fill all of the pixels! Below is the same mosaic rendered with this different method:
So I have a few related questions about this behavior:
Why does the Polygon class not fill in all these pixels, even though the angles are simple multiples of 45 degrees?
How can I consistently code around this defect (as far as my application is concerned) in my renderers so that I can use my getPolygon() method as-is? I do not want to change the vertices it outputs because I need them to be precise for center-of-mass calculations.
MCE
If the above code snippets and pictures are not enough to help explain the problem, I have added a Minimal, Complete, and Verifiable Example that demonstrates the behavior I described above.
package com.sadakatsu.mce;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Polygon;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
public class Main {
#FunctionalInterface
private static interface PerPixel {
void perform(int x, int y);
}
private static class Region {
private int height;
private int ll;
private int lr;
private int width;
private int ul;
private int ur;
private int x;
private int y;
public Region(
int x,
int y,
int width,
int height,
int ul,
int ur,
int ll,
int lr
) {
if (
width < 0 || width <= ll + lr || width <= ul + ur ||
height < 0 || height <= ul + ll || height <= ur + lr ||
ul < 0 ||
ur < 0 ||
ll < 0 ||
lr < 0
) {
throw new IllegalArgumentException();
}
this.height = height;
this.ll = ll;
this.lr = lr;
this.width = width;
this.ul = ul;
this.ur = ur;
this.x = x;
this.y = y;
}
public Color getColor() {
return Color.BLACK;
}
public int getBottom() {
return y + height - 1;
}
public int getRight() {
return x + width - 1;
}
public Polygon getPolygon() {
int[] xes = {
x + ul,
getRight() - ur,
getRight(),
getRight(),
getRight() - lr,
x + ll,
x,
x
};
int[] yes = {
y,
y,
y + ur,
getBottom() - lr,
getBottom(),
getBottom(),
getBottom() - ll,
y + ul
};
int[] keptXes = new int[8];
int[] keptYes = new int[8];
int length = 0;
for (int i = 0; i < 8; ++i) {
if (
length == 0 ||
keptXes[length - 1] != xes[i] ||
keptYes[length - 1] != yes[i]
) {
keptXes[length] = xes[i];
keptYes[length] = yes[i];
length++;
}
}
return new Polygon(keptXes, keptYes, length);
}
public void drawOnto(Graphics graphics) {
graphics.setColor(getColor());
forEach(
(i, j) -> {
graphics.fillRect(x + i, y + j, 1, 1);
}
);
}
private void forEach(PerPixel algorithm) {
for (int j = 0; j < height; ++j) {
int nj = height - 1 - j;
int minX;
if (j < ul) {
minX = ul - j;
} else if (nj < ll) {
minX = ll - nj;
} else {
minX = 0;
}
int maxX = width;
if (j < ur) {
maxX -= ur - j;
} else if (nj < lr) {
maxX -= lr - nj;
}
for (int i = minX; i < maxX; ++i) {
algorithm.perform(i, j);
}
}
}
}
public static void main(String[] args) throws IOException {
int width = 10;
int height = 8;
Region region = new Region(0, 0, 10, 8, 2, 3, 4, 1);
BufferedImage image = new BufferedImage(
width,
height,
BufferedImage.TYPE_3BYTE_BGR
);
Graphics graphics = image.getGraphics();
graphics.setColor(Color.WHITE);
graphics.fillRect(0, 0, width, height);
region.drawOnto(graphics);
ImageIO.write(image, "PNG", new File("expected.png"));
image = new BufferedImage(
width,
height,
BufferedImage.TYPE_3BYTE_BGR
);
graphics = image.getGraphics();
graphics.setColor(Color.WHITE);
graphics.fillRect(0, 0, width, height);
graphics.setColor(Color.BLACK);
graphics.fillPolygon(region.getPolygon());
ImageIO.write(image, "PNG", new File("got.png"));
}
}
I spent all day working on it, and I seem to have a fix for this. The clue was found in the documentation for the Shape class, which reads:
Definition of insideness: A point is considered to lie inside a Shape if and only if:
it lies completely inside theShape boundary or
it lies exactly on the Shape boundary and the space immediately adjacent to the point in the increasing X direction is entirely inside the boundary or
it lies exactly on a horizontal boundary segment and the space immediately adjacent to the point in the increasing Y direction is inside the boundary.
Actually, this text is a bit misleading; the third case overrides second (i.e., even if a pixel in a horizontal boundary segment on the bottom of a Shape has a filled point to its right, it still will not be filled). Represented pictorially, the Polygon below will not draw the x'ed out pixels:
The red, green, and blue pixels are part of the Polygon; the rest are not. The blue pixels fall under the first case, the green pixels fall under the second case, and the red pixels fall under the third case. Note that all of the rightmost and lowest pixels along the convex hull are NOT drawn. To get them to be drawn, you have to move the vertices to the orange pixels as shown to make a new rightmost/bottom-most portion of the convex hull.
The easiest way to do this is to use camickr's method: use both fillPolygon() and drawPolygon(). At least in the case of my 45-degree-multiple-edged convex hulls, drawPolygon() draws the lines to the vertices exactly (and probably for other cases as well), and thus will fill the pixels that fillPolygon() misses. However, neither fillPolygon() nor drawPolygon() will draw a single-pixel Polygon, so one has to code a special case to handle that.
The actual solution I developed in trying to understand the insideness definition above was to create a different Polygon with the modified corners as shown in the picture. It has the benefit (?) of calling the drawing library only once and automatically handles the special case. It probably is not actually optimal, but here is the code I used for anyone's consideration:
package com.sadakatsu.mosaic.renderer;
import java.awt.Polygon;
import java.util.Arrays;
import com.sadakatsu.mosaic.Region;
public class RegionPolygon extends Polygon {
public RegionPolygon(Region region) {
int bottom = region.getBottom();
int ll = region.getLL();
int lr = region.getLR();
int right = region.getRight();
int ul = region.getUL();
int ur = region.getUR();
int x = region.getX();
int y = region.getY();
int[] xes = {
x + ul,
right - ur + 1,
right + 1,
right + 1,
right - lr,
x + ll + 1,
x,
x
};
int[] yes = {
y,
y,
y + ur,
bottom - lr,
bottom + 1,
bottom + 1,
bottom - ll,
y + ul
};
npoints = 0;
xpoints = new int[xes.length];
ypoints = new int[xes.length];
for (int i = 0; i < xes.length; ++i) {
if (
i == 0 ||
xpoints[npoints - 1] != xes[i] ||
ypoints[npoints - 1] != yes[i]
) {
addPoint(xes[i], yes[i]);
}
}
}
}

Repeating drawLine() to draw vertical bars Java

I was given an assignment and have been able to complete it, but I feel there must be a easier way to complete it.
I was tasked to draw 60 vertical bars with a width of 5 and random heights.
public void paintComponent( Graphics g )
{
super.paintComponent( g );
g.setColor( color );
int width = getWidth();
int height = getHeight();
int x, h;
// bar with a width of 5 and random heights
h = rd.nextInt(height); //random height
x = 50;
g.drawLine( x, height, x, height-h ); //Bar 1
g.drawLine( x+1, height, x+1, height-h );
g.drawLine( x+2, height, x+2, height-h );
g.drawLine( x+3, height, x+3, height-h );
g.drawLine( x+4, height, x+4, height-h );
g.drawLine( x+6, height, x+6, height-h -12 ); // Bar 2
g.drawLine( x+7, height, x+7, height-h -12 );
g.drawLine( x+8, height, x+8, height-h -12 );
g.drawLine( x+9, height, x+9, height-h -12 );
g.drawLine( x+10, height, x+10, height-h -12);
What I have done is just repeat this for all 60 bars and just change the offset at the end of height-h +/- * and left a space of 1 between bars
This seems like a very long way to do this. Any suggestions on how to implement this without repeating it 60 times.
Edit: Added an image of the final project.
Here is the finished look ![1]
[1]: http://i.stack.imgur.com/3ivpM.png
Looking at the other answers, no one states the obvious:
To draw 60 bars, you don't need to draw more than 60 items (certainly not 60x5=300 lines).
Your options:
draw the bars as filled rectangles
draw the bars as lines with a width of 5
Also the bar values should not be calculated while painting, they're supposed to be the data model.
public class Bars extends JPanel {
private double[] barValues;
private final static int BAR_WIDTH = 5;
private final static int BAR_GAP = 3;
public Bars () {
barValues = new double[60];
for (int i = 0; i < barValues.length; i++) {
barValues[i] = Math.random();
}
}
...
}
Painting using rectangles:
#Override
protected void paintComponent (Graphics g) {
Dimension size = getSize();
g.setColor(Color.white);
g.fillRect(0, 0, size.width, size.height);
g.setColor(new Color(0x445566));
for (int i = 0; i < barValues.length; i++) {
int h = (int) Math.round(barValues[i] * size.height);
int x = (i * (BAR_WIDTH + BAR_GAP));
int y = size.height - 1 - h;
int w = BAR_WIDTH;
g.fillRect(x, y, w, h);
}
}
Painting using lines of width 5:
#Override
protected void paintComponent (Graphics g) {
Dimension size = getSize();
g.setColor(Color.white);
g.fillRect(0, 0, size.width, size.height);
g.setColor(new Color(0x445566));
Graphics2D g2 = (Graphics2D) g;
g2.setStroke(new BasicStroke(5, BasicStroke.CAP_SQUARE, BasicStroke.JOIN_MITER));
for (int i = 0; i < barValues.length; i++) {
int h = (int) Math.round(barValues[i] * size.height);
int x = (i * (BAR_WIDTH + BAR_GAP)) + BAR_WIDTH / 2;
int y = size.height - 1 - h;
g.drawLine(x, y, x, y + h);
}
}
You could use a for loop with %
for(int i = 0, int j = 0 ; i < 360 ; i++ ) {
if(i % 5 != 0 ) {
g.drawLine( x+i, height, x+i, height-h - j);
}
if(i % 6 = 0)
j = j - 12;
}
I think that's right for what you want. I have made some assumptions:
You skip every 6th line to leave a space
You increase j by negative 12 every second line
why you don't use for loop and bunch of if statements!
for(int i = 0; i < 60; i++) {
if( i < 5) {
}
if( i > 5 && i < 10) {
}
// etc..
}
This is the second try :P
public void paintComponent(Graphics g) {
super.paintComponent(g);
int width = getWidth();
int height = getHeight();
System.out.println("getWidth = " + getWidth());
System.out.println("getHeight = " + getHeight());
Random rd = new Random();
int x = 50;
for (int i = 0; i <= 60; i++) {
int fisrt = (i / 12) * 12;
for (int j = 0; j < 12; j++) {
int h = rd.nextInt(height); // random height
g.drawLine(x + j, height, x + j, height - h - fisrt);
}
}
}
This is a great example of when to use a loop. To draw the first five lines you need something like this.
public void drawLines(int x, int height, int h, int j){
for(int i = 0; i < 5; i++){
g.drawLine(x + i, height, x + i, height - h - j);
}
}
However, this is not complete because you have to do this multiple times. just use another for loop.
for(int i = 0; i < 12, i++){
drawLines(x + i * 5, height, h, i * 12);
}
What you saw but didn't know it
You saw a pattern of repeating code. In time and probably after an algorithm class you should be able to pre-predict patterns, some are obvious some are not. This is where reasoning, deductive and math skills come in. Which goes in the order of:
I am repeating myself...
Why am I repeating this
Is this is a basic pattern?
If I am not seeing a basic pattern...can this code be broken down further?
What is changing increase/decreasing on each same line of code
What coding idiom (loop, do-while,collection etc) do I know that best deals with this
This is also why keeping code methods short and to the point allows you to see the above more clearly.
But more important before you code: design your objects beforehand. This will allow you to solve 99 problems before you even have to deal with the coding aspect.
A good design can work in any code of that type (in this case OO/object orientated).
(Some might argue to keep the second loop in the code below to its separate method to keep it clean, readable and allow you to reuse it again.)
Your Solution
Create a method to get your barWidth and this should be your whole paintComponent method. Everything is commented and all variables are clearly defined in what they do, but if you require any help understanding any part do say.
I am not sure why you have rd as a global field.
public void paintComponent( Graphics g ) {
// Carry out super first
super.paintComponent( g );
// Set all field types at start
int totalWidth, totalHeight, barHeight, barWidth, totalBarsRequired;
// Set all constant fields
barWidth = 5; // THE BAR WIDTH IS SET HERE (Create a method)
// Set all method fields
totalWidth = getWidth();
totalHeight = getHeight();
// No need to set the bars as we can calculate them from the bar width
totalBarsRequired = (int) totalWidth / barWidth;
// Look over all the bars required
for( int barNumber = 0 ; barNumber < totalBarsRequired ; barNumber++ ) {
// Set a new random height each bar
barHeight = rd.nextInt( totalHeight );
// Create the lines and loop until the barWidth has been met
for (int barLineNumber = 0 ; barLineNumber < barWidth ; barLineNumber++ ) {
g.drawLine( (barNumber * barWidth) + barLineNumber, barHeight, (barNumber * barWidth) + barLineNumber, barHeight );
}
}
}

Categories

Resources