Completing a graphics program in Java, I'm trying to animate rain falling using a timer. Right now I am testing my code with a big blue rectangle so I can see where it's going but the animation isn't working for me. I'm very new to Java graphics so I could be making mistakes that just aren't clear to me.
When I try to repaint the square to move, and the paint function is called the whole screen blinks, this may be because I was using recursive functions to draw fractal trees, but I'm not sure. Is there a way to keep everything I have drawn from being repainted and just call repaint on the rain? Any guidance or tips would be appreciated.
import java.awt.*;
import javax.swing.*;
import java.lang.Math;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
public class FractalTree extends JFrame {
private int frameWidth = 1440;
private int frameHeight = 850;
private int rainX = 0;
private int rainY = 0;
public FractalTree()
{
setBounds(1000, 1000, frameWidth, frameHeight ); //graphics window size
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
ActionListener listener = new TimerListener();
final int DELAY = 1500;
Timer t = new Timer(DELAY, listener);
t.start();
setResizable(false);
}
public void setRain(int newRainX, int newRainY)
{
rainX = newRainX;
rainY = newRainY;
}
public void setSkyGround(Graphics g)
{
Color sky = new Color(180, 225, 255);
g.setColor(sky);
g.fillRect(0, 0, frameWidth, 550);
Color sun = new Color(225, 225, 150);
g.setColor(sun);
g.fillOval(1380, -40, 100, 100);
g.drawLine(frameWidth, 0, 1350, 550);
g.drawLine(frameWidth, 0, 1450, 550);
g.drawLine(1350, 550, 1450, 550);
int xpoints[] = {frameWidth, 1450, 1350};
int ypoints[] = {0, 550, 550};
int npoints = 3;
g.fillPolygon(xpoints, ypoints, npoints);
g.drawLine(frameWidth, 0, 1080, 550);
g.drawLine(frameWidth, 0, 880, 550);
g.drawLine(880, 550, 1080, 550);
int xpoints2[] = {frameWidth, 1080, 880};
int ypoints2[] = {0, 550, 550};
int npoints2 = 3;
g.fillPolygon(xpoints2, ypoints2, npoints2);
g.drawLine(frameWidth, 0, 480, 550);
g.drawLine(frameWidth, 0, 280, 550);
g.drawLine(480, 550, 280, 550);
int xpoints3[] = {frameWidth, 480, 280};
int ypoints3[] = {0, 550, 550};
int npoints3 = 3;
g.fillPolygon(xpoints3, ypoints3, npoints3);
g.drawLine(frameWidth, 0, 0, 430);
g.drawLine(frameWidth, 0, 0, 300);
g.drawLine(0, 430, 0, 300);
int xpoints4[] = {frameWidth, 0, 0};
int ypoints4[] = {0, 430, 300};
int npoints4 = 3;
g.fillPolygon(xpoints4, ypoints4, npoints4);
g.drawLine(frameWidth, 0, 0, 100);
g.drawLine(frameWidth, 0, 0, 0);
g.drawLine(0, 100, 0, 0);
int xpoints5[] = {frameWidth, 0, 0};
int ypoints5[] = {0, 0, 100};
int npoints5 = 3;
g.fillPolygon(xpoints5, ypoints5, npoints5);
Color grassBackground = new Color(150, 255, 170);
g.setColor(grassBackground);
g.fillRect(0, 550, frameWidth, frameHeight);
}
public void drawTree(Graphics g, int x1, int y1, double angle, int depth, int red, int green, int blue)
{
if (depth == 0)
{
Color doodle = new Color(red, green, blue);
g.setColor(doodle);
g.fillOval(x1, y1, 10, 10);
}
else
{
Graphics2D g2 = (Graphics2D) g;
g2.setStroke(new BasicStroke(depth));
Color brown = new Color(100, 25, 0);
g.setColor(brown);
int x2 = x1 + (int) (Math.cos(Math.toRadians(angle)) * depth * 10);
int y2 = y1 + (int) (Math.sin(Math.toRadians(angle)) * depth * 10);
g.drawLine(x1, y1, x2, y2);
drawTree(g, x2, y2, angle - 40, depth - 1, red, green, blue);
drawTree(g, x2, y2, angle + 20, depth - 1, red, green, blue);
}
}
public void realFlowers(Graphics g, int x, int y, int lenWid, int petals)
{
//calculates the increment
double inc = (2*Math.PI/petals);
g.setColor(Color.YELLOW);
//draws petals
for(int i = 0; i < petals; i++){
//keeps spacing consistent depandng on number of petals
double value = i * inc;
//draws petals with calculated spacing relative to number of petals
g.fillOval((int)((lenWid)*Math.cos(value)+x-lenWid/4),(int)((lenWid)*Math.sin(value)+y-lenWid/4), lenWid + lenWid/2, lenWid + lenWid/2);
}
//draws middle flower bud;
g.setColor(Color.ORANGE);
g.fillOval(x - lenWid/4, y - lenWid/4, lenWid + lenWid/2 , lenWid + lenWid/2);
}
public void drawGrass(Graphics g, int width, int height, int interval, int red, int green, int blue)
{
height = frameHeight - height;
Color grass = new Color(red, green, blue);
for(int i = 0; i < width; i= i + interval)
{
for(int j = frameHeight; j > height; j = j - interval)
{
g.setColor(grass);
g.fillRect(i, j, 3, 5);
}
}
}
public void rainDrops(Graphics g, int x, int y, int w, int h)
{
setRain(x, y);
Color rain = new Color(0, 76, 153);
g.setColor(rain);
g.fillRect(x, y, w, h);
}
public void moveRainBy(int dx, int dy)
{
rainX = rainX + dx;
rainY = rainY + dy;
repaint();
}
class TimerListener implements ActionListener
{
public void actionPerformed(ActionEvent event)
{
moveRainBy(1, 1);
}
}
public void paint(Graphics g) {
setSkyGround(g);
drawGrass(g, 1440, 315, 5, 0, 255, 0);
drawGrass(g, 1430, 310, 10, 0, 204, 0);
drawTree(g, 1085, 730, -90, 10, 255, 102, 102);
drawTree(g, 250, 600, -90, 8, 255, 255, 255);
drawTree(g, 1110, 740, -90, 4, 255, 102, 102);
drawTree(g, 1060, 745, -90, 2, 255, 102, 102);
realFlowers(g, 700,700, 8, 8);
rainDrops(g, 200, 200, 30, 30);
}
public static void main(String[] args) {
new FractalTree().setVisible(true);
}
}
When I try to repaint the square to move, and the paint function is called the whole screen blinks
This is because you've override paint of the a top level container (JFrame) which is not double buffered.
As a general recommendation, you should be basing your core functionality around a JPanel and override it's paintComponent method. Take a look at Performing Custom Painting and Painting in AWT and Swing for more details
You might like to also have a look at How to get the EXACT middle of a screen, even when re-sized and How can I set in the midst? for more details why it's not recommended to extend directly from JFrame and try to paint to it.
Is there a way to keep everything I have drawn from being repainted and just call repaint on the rain?
Painting is destructive, that is, each time paint/paintComponent is called, you are expected to repaint the entire state of the component from scratch.
You could use a buffering technique, using something like BufferedImage to paint your state to and simply have the paint methods draw the image, but that would depend on how complex a solution you want. If you were to use buffering technique, I would consider which elements are "static" and which elements are "dynamic". Painting those static elements to the buffer and then, when paint is called, painting the dynamic elements over the top the buffer
Related
I'm doing homework from CSE 142 assigned by my tutor, I am trying to replicate the code but the size variable is not changing the size of the squares drawn by the program, it is instead changing the distances from each square to another square. I don't know where to start looking to fix this problem, so maybe you guys could help with that a little bit
import java.awt.*;
public class CafeWall{
public static final int WIDTH = 800;
public static final int HEIGHT = 450;
public static void main (String[] args){
DrawingPanel panel = new DrawingPanel(WIDTH, HEIGHT);
Graphics g = panel.getGraphics();
panel.setBackground(Color.LIGHT_GRAY);
grid(g, 250, 200, 6, 25, 6, 10, Color.WHITE, Color.BLACK);
grid(g, 10, 150, 8, 25, 8, 0, Color.BLACK, Color.WHITE);
grid(g, 425, 180, 9, 20, 10, 10, Color.BLACK, Color.WHITE);
grid(g, 400, 20, 4, 35, 4, 35, Color.BLACK, Color.WHITE);
singleRow(g, 0, 0, 8, Color.BLACK, Color.WHITE, 25);
singleRow(g, 50, 70, 10, Color.BLACK, Color.WHITE, 25);
}
public static void grid(Graphics g, int x, int y, int row, int size,
int column, int offset,Color color1, Color color2){
for(int i = 0; i < row;i++){
int offsetTemp = 0;
offsetTemp = offset;
singleRow(g, x + offsetTemp, y+size*i, column, color1, color2,
size);
if(i % 2 != 0){
offsetTemp = offset;
singleRow(g, x, y+size*i, column, color1, color2, size);
}
}
}
public static void singleRow(Graphics g, int x, int y, int num, Color
color1, Color color2, int size){
for(int i = 0; i < num ; i++){
if (i % 2 == 0){
square(g , x+size*i, y, 25, Color.BLACK, true);
} else {
square(g , x+size*i, y, 25, Color.WHITE, false);
}
}
}
public static void square(Graphics g, int x, int y, int size, Color
color, boolean diagonals){
g.setColor(color);
g.fillRect(x, y, size, size);
if (diagonals){
g.setColor(Color.RED);
g.drawLine(x,y,x+size,y+size);
g.drawLine(x+size,y,x,y+size);
}
}
}
In your two lines
square(g , x+size*i, y, 25, Color.BLACK, true);
and
square(g , x+size*i, y, 25, Color.WHITE, false);
you're passing 25 as the value or the parameter of square called size. So all your squares will be size 25. Maybe instead of 25, you want to pass your variable size as the value of this parameter. Like
square(g , x+size*i, y, size, Color.BLACK, true);
So I am having trouble drawing Concentric Circles(think of a Bull's eye Target). My issue is that each circle I draw is not centered, instead shifts position from the original circle. Here is my code:
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import javax.swing.JPanel;
public class TargetPanel extends JPanel {
public TargetPanel() {
this.setPreferredSize(new Dimension(800,800));
}//end constructor
public void paintComponent(Graphics g) {
Color blue = new Color(0, 100, 0);
Color yellow = new Color(100, 0, 0);
super.paintComponent(g);
int dimension = 800;
int partition = 75;
drawCirlce(g, Color.WHITE, Color.BLACK, dimension);
}//end draw circle
private void drawCirlce(Graphics g, Color blue, Color yellow, int dimension) {
g.setColor(Color.WHITE);
g.fillOval((getHeight()- (dimension))/2, (getWidth()-(dimension))/2, dimension, dimension);
g.setColor(Color.BLACK);
g.drawOval((getHeight() - (dimension))/2, (getWidth()-(dimension))/2, dimension, dimension);
g.drawOval((getHeight()- (dimension))/2, (getWidth()- (dimension))/2, dimension-30, dimension-30);
}//end drawCircle
}//end main
I think I know what the issue is: the -30 shifts it, that being the case how do I form smaller cirlces with the origin of the circles being centered?
I think you need to subtract 30 from the dimension and then update the dimension value, like so:
private void drawCirlce(Graphics g, Color blue, Color yellow, int dimension) {
g.setColor(Color.WHITE);
g.fillOval((getHeight() - (dimension)) / 2, (getWidth() - (dimension)) / 2, dimension, dimension);
g.setColor(Color.BLACK);
g.drawOval((getHeight() - (dimension)) / 2, (getWidth() - (dimension)) / 2, dimension, dimension);
// Updated code here:
dimension -= 30;
g.drawOval((getHeight() - (dimension)) / 2, (getWidth() - (dimension)) / 2, dimension, dimension);
}//end drawCircle
Like this you should get the different circles at a regular distance.
The code below can be run and displays two circle lines at the same distance:
import javax.swing.*;
import java.awt.*;
public class Circles extends JFrame {
public Circles() throws HeadlessException {
this.setLayout(new BorderLayout());
final Dimension dimension = new Dimension(600, 600);
this.setSize(new Dimension(dimension.width + 50, dimension.height + 50));
this.add(new TargetPanel(dimension), BorderLayout.CENTER);
}
public static void main(String[] args) {
Circles circles = new Circles();
circles.setLocationRelativeTo(null);
circles.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
circles.setVisible(true);
}
}
class TargetPanel extends JPanel {
public TargetPanel(Dimension dimension) {
this.setPreferredSize(dimension);
}//end constructor
public void paintComponent(Graphics g) {
Color blue = new Color(0, 100, 0);
Color yellow = new Color(100, 0, 0);
super.paintComponent(g);
int dimension = this.getPreferredSize().width;
int partition = 75;
drawCircle(g, Color.WHITE, Color.BLACK, dimension);
}//end draw circle
private void drawCircle(Graphics g, Color blue, Color yellow, int dimension) {
g.setColor(Color.WHITE);
final int yCenter = (getHeight() - (dimension)) / 2;
final int xCenter = (getWidth() - (dimension)) / 2;
g.fillOval(xCenter, yCenter, dimension, dimension);
g.setColor(Color.BLACK);
g.drawOval(xCenter, yCenter, dimension, dimension);
dimension -= 30;
g.drawOval((getWidth() - (dimension)) / 2, (getHeight() - (dimension)) / 2, dimension, dimension);
}//end drawCircle
}//end main
Please help me how to make this eye move or to make it blink using repaint, thread and implements runnable. I don't know where to place the right codes to make it work. Please help me guys! Thank you!
Here is the code:
import java.awt.*;
import java.applet.*;
public class Pucca extends Applet {
public Pucca(){
setSize(700, 700); }
//paint method
public void paint(Graphics g){
Color white = new Color(255,255,255);
g.setColor(white);
g.fillOval(600, 100, 125, 125); //left white fill eye
g.setColor(Color.BLACK);
g.drawOval(600, 100, 125, 125); // left big black line eye
g.setColor(white);
g.fillOval(700, 100, 125, 125); //right white fill eye
g.setColor(Color.BLACK);
g.drawOval(700, 100, 125, 125); //right big black line eye
Color blue = new Color(0, 160, 198);
g.setColor(blue);
g.fillOval(635, 130, 51, 51); // left blue fill eye
g.setColor(Color.BLACK);
g.drawOval(635, 130, 50, 50); // left black small line eye
g.setColor(blue);
g.fillOval(735, 130, 51, 51); // right blue fill eye
g.setColor(Color.BLACK);
g.drawOval(735, 130, 50, 50); // right black small line eye
g.setColor(Color.BLACK);
g.fillOval(650, 145, 20, 20); // left black iris
g.setColor(Color.BLACK);
g.fillOval(750, 145, 20, 20); // right black iris
}
}
When it comes to animation, everything becomes variable. You also have a lot of repeated code (seriously, if you can paint one eye, you can paint lots).
The first thing you need to is make all the values of the eye as variable as possible.
The follow makes the eye size and position variable and the iris and pupil a scaled value of the eye size, which makes the whole process simpler to animate.
Next, you need an updated loop, which can update the state of the values you want to change. To keep it simple, I've set it up so that the pupil has a variable offset, which is changed over time.
import java.applet.Applet;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Point;
import java.awt.Rectangle;
public class Pucca extends Applet {
public Pucca() {
setSize(700, 700);
Thread t = new Thread(new Runnable() {
private int xDelta = -1;
private int yDelta = 0;
private int blinkCount = 0;
#Override
public void run() {
while (true) {
try {
Thread.sleep(40);
} catch (InterruptedException ex) {
}
xOffset += xDelta;
double irisSize = eyeSize.width * irisScale;
double range = ((eyeSize.width - irisSize) / 2);
if (xOffset <= -range) {
xOffset = -(int) range;
xDelta *= -1;
} else if (xOffset >= range) {
xOffset = (int) range;
xDelta *= -1;
}
blinkCount++;
if (blink && blinkCount > 10) {
blink = false;
blinkCount = 0;
} else if (blinkCount > 25) {
blink = true;
blinkCount = 0;
}
repaint();
}
}
});
t.setDaemon(true);
t.start();
}
private boolean blink = false;
private int xOffset, yOffset = 0;
private Dimension eyeSize = new Dimension(125, 125);
private Point left = new Point(20, 20);
private Point right = new Point(left.x + 100, left.y);
private double irisScale = 0.4;
private double pupilScale = 0.16;
//paint method
#Override
public void paint(Graphics g) {
super.paint(g);
paintEye(g, new Rectangle(left, eyeSize));
paintEye(g, new Rectangle(right, eyeSize));
}
protected void paintEye(Graphics g, Rectangle bounds) {
Color white = new Color(255, 255, 255);
if (blink) {
g.setColor(Color.YELLOW);
} else {
g.setColor(white);
}
g.fillOval(bounds.x, bounds.y, bounds.width, bounds.height); //left white fill eye
g.setColor(Color.BLACK);
g.drawOval(bounds.x, bounds.y, bounds.width, bounds.height); // left big black line eye
if (!blink) {
Color blue = new Color(0, 160, 198);
paintEyePartAt(g, bounds, irisScale, blue);
paintEyePartAt(g, bounds, pupilScale, Color.BLACK);
}
}
private void paintEyePartAt(Graphics g, Rectangle bounds, double delta, Color color) {
int width = (int) (bounds.width * delta);
int height = (int) (bounds.height * delta);
g.setColor(color);
g.fillOval(
xOffset + bounds.x + ((bounds.width - width) / 2),
yOffset + bounds.y + ((bounds.height - height) / 2),
width, height); // left blue fill eye
g.setColor(Color.BLACK);
g.drawOval(
xOffset + bounds.x + ((bounds.width - width) / 2),
yOffset + bounds.y + ((bounds.height - height) / 2),
width,
height); // left blue fill eye
}
}
This complicates things, as painting can occur for any number of reasons, many of which you don't have control over or will be notified about, so you should be very careful about where and when you change values.
You should also have a look at Java Plugin support deprecated and Moving to a Plugin-Free Web and Why CS teachers should stop teaching Java applets.
Applets are simply a dead technology and given the inherent complexities involved in using them, you should instead focus you should probably attention towards window based programs.
Personally, I'd start with having a look at Painting in AWT and Swing and Performing Custom Painting
I have a new problem with the repaint methode.
There is a frame in which I paint several graphics together. When I click in a specific range of coordinates, it should change the status of one graphic and then repaint this specific range. But this repaint doesn't work...
This is the method that initialize the graphics (the declaration of the graphics isn't shown):
private void initComponents() {
Painter painter = new Painter();
setExtendedState(MAXIMIZED_BOTH);
int width = (int) getContentPane().getBounds().getWidth();
int height = (int) getContentPane().getBounds().getHeight();
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
g0 = new Gleis(25, 1, 4, 0, 0);
g1 = new Gleis(26, 1, 0, 1, 0);
k0 = new KnopfRot(26, 1, 0, false);
g2 = new Gleis(27, 1, 0, 2, 0);
g3 = new Gleis(28, 1, 0, 3, 0);
g4 = new Gleis(29, 1, 0, 4, 0);
g5 = new Gleis(30, 1, 0, 5, 0);
g6 = new Gleis(31, 1, 0, 6, 0);
g7 = new Gleis(32, 1, 0, 7, 0);
g8 = new Gleis(33, 1, 0, 8, 0);
g9 = new Gleis(34, 1, 0, 9, 0);
g10 = new Gleis(35, 1, 0, 10, 0);
g11 = new Gleis(36, 1, 0, 11, 0);
g12 = new Gleis(37, 1, 0, 12, 0);
g13 = new Gleis(38, 1, 0, 13, 0);
k1 = new KnopfRot(38, 1, 1, false);
painter.addGleis(g0);
painter.addGleis(g1);
painter.addKnopfRot(k0);
painter.addGleis(g2);
painter.addGleis(g3);
painter.addGleis(g4);
painter.addGleis(g5);
painter.addGleis(g6);
painter.addGleis(g7);
painter.addGleis(g8);
painter.addGleis(g9);
painter.addGleis(g10);
painter.addGleis(g11);
painter.addGleis(g12);
painter.addGleis(g13);
painter.addKnopfRot(k1);
this.addMouseListener(new MouseListener() {
#Override
public void mouseClicked(MouseEvent e) {
double x = e.getX();
double y = e.getY();
frameMouseClicked(x, y);
}
});
this.getContentPane().add(painter);
this.setVisible(true);
}
public void frameMouseClicked(double x, double y) {
if(x >= 306 && x <= 314 && y >= 55 && y <= 63){ //x+11 y+32
Painter painter = new Painter();
painter.updateKnopfRot(k0, 26, 1, 306, 55);
repaint();
}
else{}
}
Then my class KnopfRot:
public class KnopfRot {
int xposition;
int yposition;
int type;
int id;
boolean status;
//Konstruktor
public KnopfRot(int xpos, int ypos, int id, boolean status){
this.xposition = xpos * 11 + 12;
this.yposition = ypos * 11 + 12;
this.id = id; //zur eindeutigen Bezeichnung der Gleiselemente
this.status = status;
}
public void draw(Graphics2D g) {
if (!status) {
Ellipse2D.Double aussen = new Ellipse2D.Double(xposition, yposition, 8, 8);
Ellipse2D.Double innen = new Ellipse2D.Double(xposition + 1, yposition + 1, 6, 6);
g.setColor(Color.black);
g.fill(aussen);
g.setColor(Color.red);
g.fill(innen);
}
else if (status){
Ellipse2D.Double aussen = new Ellipse2D.Double(xposition, yposition, 7, 7);
Ellipse2D.Double innen = new Ellipse2D.Double(xposition + 1, yposition + 1, 5, 5);
g.setColor(Color.black);
g.fill(aussen);
g.setColor(Color.red);
g.fill(innen);
}
else {}
}
}
And the Painter-Class with the method updateKnopfRot which is callen in the MouseEvent:
public class Painter extends JPanel {
private List<Gleis> gleisList = new ArrayList<>();
private List<KnopfRot> knopfList = new ArrayList<>();
//fügt ein neues Element der Liste gleisList hinzu
public void addGleis(Gleis gleis) {
gleisList.add(gleis);
}
public void addKnopfRot(KnopfRot knopf) {
knopfList.add(knopf);
}
public void updateKnopfRot(KnopfRot knopf, int x, int y, int xpos, int ypos) {
knopfList.remove(knopf);
addKnopfRot(new KnopfRot(x, y, 0, true));
}
//paint-Methode geht jedes Element der Liste gleisList durch und führt die draw-Methode in Gleis.java aus
#Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
for (Gleis gleis : gleisList) {
gleis.draw(g2);
}
for (KnopfRot knopf : knopfList) {
knopf.draw(g2);
}
}
}
Sorry for so much code but I can't reduce it to explain/show the problem.
Can somebody help?
You're creating a new Painter(...) object within your frameMouseClicked(...) method, and then changing the state of this object, but this will have no effect on the completely different visualized Painter object. Your solution -- don't create a new Painter object, but rather use a reference to the original, and then try to change its state.
Regarding:
Sorry for so much code but I can't reduce it to explain/show the problem.
If this answer doesn't solve your problem, then yes, you can reduce this code and make it runnable as we've discussed in the past. Yes it will take some effort on your part to create and post a valid MCVE, but it's worth it.
When running my program, sometimes the the triangles are drawn, sometimes they aren't, and sometimes only the last one appears. Originally I put the code in a for loop, but it didn't work, so I tried to go backwards and write it all out instead to see if it works, but to no avail. The correct behavior should be, displaying five triangles, equally spaced on the screen (Directly below the top rectangle). I tried printing out the array, but the number of times the println() method was called was sort of random, instead of constant. I heard that the paintComponent() method can be called at any time by the Swing Framework, but I'm not sure. Essentially I'm asking, why the triangles (the cyan ones) aren't being drawn correctly, and how do I fix it?
#SuppressWarnings("serial")
public class GraphicsClass extends JPanel {
private int[] xCoordinates = {20, 40, 30};
private int[] yCoordinates = {40, 40, 60};
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(Color.DARK_GRAY);
g.fillRect(0, 0, 450, 40);
g.fillRect(0, 260, 450, 40);
g.setColor(Color.CYAN);
g.fillPolygon(xCoordinates, yCoordinates, 3);
xCoordinates[0] += 95;
xCoordinates[1] += 95;
xCoordinates[2] += 95;
g.fillPolygon(xCoordinates, yCoordinates, 3);
xCoordinates[0] += 95;
xCoordinates[1] += 95;
xCoordinates[2] += 95;
g.fillPolygon(xCoordinates, yCoordinates, 3);
xCoordinates[0] += 95;
xCoordinates[1] += 95;
xCoordinates[2] += 95;
g.fillPolygon(xCoordinates, yCoordinates, 3);
xCoordinates[0] += 95;
xCoordinates[1] += 95;
xCoordinates[2] += 95;
g.fillPolygon(xCoordinates, yCoordinates, 3);
}
}
Think about it this way. paintComponent may be called any time (upwards of four times when the component is first painted on the screen in some cases). So each time it is called, you're adding 95 to each of the xCoordinates, this would make xCoordinates[0] equal to 400 after paintComponent is called the first time, 800 after the second time, so on and so fourth...
Instead, you need to make a copy of the xCoordinates and modify it instead, for example...
public class TestPane extends JPanel {
private int[] xCoordinates = {20, 40, 30};
private int[] yCoordinates = {40, 40, 60};
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(Color.DARK_GRAY);
g.fillRect(0, 0, 450, 40);
g.fillRect(0, 260, 450, 40);
int[] xPosy = Arrays.copyOf(xCoordinates, xCoordinates.length);
g.setColor(Color.CYAN);
for (int index = 0; index < 4; index++) {
g.fillPolygon(xPosy, yCoordinates, 3);
xPosy[0] += 95;
xPosy[1] += 95;
xPosy[2] += 95;
}
}
}
Of course, you could forgo some of the oddities and just make use of the 2D Graphics Shape API
public class TestPane extends JPanel {
private Polygon triangle;
public TestPane() {
triangle = new Polygon(new int[]{20, 40, 30}, new int[]{40, 40, 60}, 3);
}
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2d = (Graphics2D) g.create();
g2d.setColor(Color.DARK_GRAY);
g2d.fillRect(0, 0, 450, 40);
g2d.fillRect(0, 260, 450, 40);
g2d.setColor(Color.CYAN);
AffineTransform at = AffineTransform.getTranslateInstance(0, 0);
for (int index = 0; index < 4; index++) {
Shape shape = at.createTransformedShape(triangle);
g2d.fill(shape);
at.translate(95, 0);
}
}
}