We Keep Coding

Creating sliders with arrow buttons

How can I create a slider with two arrow buttons from the side? The arrows/triangle should turn white when clicked. And the slider should move each time the arrow button is clicked.
here's the link to what it should look like
and here's what I've done so far
int x=75;
void setup() {
size(600,400);
}
void draw() {
background(100);
fill (200);
rect (75, 25, 400, 50);
stroke(0);
if(mousePressed) {
if (mouseX >75 && mouseX <= 475)
{x=mouseX;}
}
fill(127,0,0);
rect (x, 20, 9, 60);
fill (255);
fill (200);
rect (10, 25, 50, 50);
{
if (mousePressed == true) {
fill(255);
} else {
fill(0);
}
triangle (50, 60, 50, 40, 15, 50);
}
fill (200);
rect (490, 25, 50, 50);
{
if (mousePressed == true) {
fill(255);
} else {
fill(0);
}
triangle (500, 60, 500, 40, 535, 50);
}
println(x);
}
When I click anywhere on the screen, my problem is that both arrows turn white. I need it to individually function. And the slider is not moving every time I click the arrow buttons

The following approach to this problem uses 4 different classes: ForwardArrow, BackArrow, Slider, and ValueField. Arrow fill color is controlled by the press() method of its respective class.
color BLUE = color(64, 124, 188);
color LTGRAY = color(185, 180, 180);
color YELLOW = color(245, 250, 13);
color RED = color(255, 0, 0);
color BLACK = color(0, 0, 0);
color WHITE = color(255, 255, 255);
color GREEN = color(32, 175, 47);
ForwardArrow _fwdArrw;
BackArrow _backArrw;
ValueField _valueFld;
Slider _slider;
final int _sliderX = 90;
final int _sliderY = 40;
final int _sliderW = 200;
final int _sliderH = 30;
final int _txtSize = 22;
final int _initValue = 40;
final int _maxValue = 200;
final int _minValue = 0;
int value = _initValue;
class ValueField {
float x, y, w, h;
String title;
color fldColor;
color txtColor;
// Constructor
ValueField(int xpos, int ypos, float wt, float ht, String valueStr, color background, color foreground) {
x = xpos;
y = ypos;
w = wt;
h = ht;
title = valueStr;
fldColor = background;
txtColor = foreground;
}
void display(int val) {
// **** Value Field **** //
fill(fldColor); // erase old value
rect(x, y, w, h);
fill(txtColor); // text color
textSize(_txtSize);
textAlign(CENTER);
text(str(val), x, y, w, h);
// **** Slider bar **** //
fill(255);
rect(_sliderX, _sliderY, _sliderW*val/_maxValue, _sliderH);
}
}
class ForwardArrow {
float x, y, w, h;
color arrwColor;
// Constructor
ForwardArrow(int xpos, int ypos, float wt, float ht, color background) {
x = xpos;
y = ypos;
w = wt;
h = ht;
arrwColor = background;
}
void display() {
fill(arrwColor); // arrow color
noStroke();
triangle(x, y, x, y + h, x + w, y + h/2 );
}
void press() {
fill(255); // arrow color
noStroke();
triangle(x, y, x, y + h, x + w, y + h/2 );
}
}
class BackArrow {
float x, y, w, h;
color arrwColor;
// Constructor
BackArrow(int xpos, int ypos, float wt, float ht, color background) {
x = xpos;
y = ypos;
w = wt;
h = ht;
arrwColor = background;
}
void display() {
fill(arrwColor);
noStroke();
triangle(x, y + h/2, x + w, y, x + w, y + h );
}
void press() {
fill(255);
noStroke();
triangle(x, y + h/2, x + w, y, x + w, y + h );
}
}
class Slider {
float x, y, w, h;
color barColor;
color trimColor;
// Constructor
Slider(int xpos, int ypos, float wt, float ht, color background, color foreground) {
x = xpos;
y = ypos;
w = wt;
h = ht;
barColor = background;
trimColor = foreground;
}
void display() {
stroke(0);
strokeWeight(1);
noFill();
rect(x, y, w, h);
}
}
void setup() {
size(500, 250);
background(BLUE);
_slider = new Slider(_sliderX, _sliderY, _sliderW, _sliderH, WHITE, BLACK);
_backArrw = new BackArrow(50, 40, 30, 30, GREEN);
_fwdArrw = new ForwardArrow(300, 40, 30, 30, GREEN);
_valueFld = new ValueField(380, 40, 60, 30, str(_initValue), WHITE, BLACK);
}
void draw() {
background(BLUE);
_valueFld.display(value);
_fwdArrw.display();
_backArrw.display();
_slider.display();
// FwdArrw Long Press
if ((mouseX >= _fwdArrw.x) && (mouseX <= _fwdArrw.x + _fwdArrw.w) && (mouseY >= _fwdArrw.y) && (mouseY <= _fwdArrw.y + _fwdArrw.h)) {
if (mousePressed == true) {
_fwdArrw.press();
value++;
if (value > _maxValue) {
value = _maxValue;
}
_valueFld.display(value);
}
}
// BackArrw Long Press
if ((mouseX >= _backArrw.x) && (mouseX <= _backArrw.x + _backArrw.w) && (mouseY >= _backArrw.y) && (mouseY <= _backArrw.y + _backArrw.h)) {
if (mousePressed == true) {
_backArrw.press();
value--;
if (value < _minValue) {
value = _minValue;
}
_valueFld.display(value);
}
}
}
A revision of your code follows;
int x=75;
void setup() {
size(600, 400);
}
void draw() {
background(100);
fill (200);
rect (75, 25, 400, 50); // slider bar
stroke(0);
fill(127, 0, 0);
rect (x, 20, 9, 60); // slider thumb
fill (200);
rect (10, 25, 50, 50); // back arrow
fill(0);
triangle (50, 60, 50, 40, 15, 50);
if ((mouseX >= 10) && (mouseX <= 10 + 50) && (mouseY >= 25) && (mouseY <= 25 + 50) ) {
if (mousePressed == true) {
fill(255);
triangle (50, 60, 50, 40, 15, 50);
x--;
if (x<75) {
x = 75; // minValue
}
} else {
fill(0);
triangle (50, 60, 50, 40, 15, 50);
}
}
fill (200);
rect (490, 25, 50, 50); //forward arrow
fill(0);
triangle (500, 60, 500, 40, 535, 50);
if ((mouseX >= 490) && (mouseX <= 490 + 50) && (mouseY >= 25) && (mouseY <= 25 + 50) ) {
if (mousePressed == true) {
fill(255);
triangle (500, 60, 500, 40, 535, 50);
x++;
if (x>466) {
x = 466; // maxValue
}
} else {
fill(0);
triangle (500, 60, 500, 40, 535, 50);
}
}
}

You've got part of the logic right for the slider/trackbar so it changes x only within a range. This happens horizontally only at this stage, but you can use the same logic to check horizontal limits as well. Similarly, you can check if the cursor is within the bounds of any rectangle (be it the slider or either of the buttons):
int x=75;
void setup() {
size(600, 400);
}
void draw() {
background(100);
// slider
fill (200);
rect (75, 25, 400, 50);
stroke(0);
if (mousePressed) {
if (mouseX >75 && mouseX <= 475)
{
x=mouseX;
}
}
fill(127, 0, 0);
rect (x, 20, 9, 60);
fill (255);
// left arrow button
fill (200);
rect (10, 25, 50, 50);
fill(0);
if (mousePressed == true) {
if (mouseX > 10 && mouseX <= 10 + 50 && mouseY > 25 && mouseY <= 25 + 50){
fill(255);
}
}
triangle (50, 60, 50, 40, 15, 50);
// right arrow button
fill (200);
rect (490, 25, 50, 50);
fill(0);
if (mousePressed == true) {
if (mouseX > 490 && mouseX <= 490 + 50 && mouseY > 25 && mouseY <= 25 + 50){
fill(255);
}
}
triangle (500, 60, 500, 40, 535, 50);
println(x);
}
Wouldn't it be nice if you could take that logic and instead of copy/pasting the different x,y,width,height parameters for the same 4 statements you could group that functionality in a reusable block of code ?
That what functions are for. You're already using them already (defining setup()/draw(), calling background()/fill()/etc.
The Processing Button example already provides the boolean overRect(int x, int y, int width, int height) function which is perfect for you're trying to achieve: pass in the x,y,width,height or a button and get back boolean value.
Here's your code using the overRect():
int x=75;
void setup() {
size(600, 400);
}
void draw() {
background(100);
// slider
fill (200);
rect (75, 25, 400, 50);
stroke(0);
if (mousePressed) {
if (mouseX >75 && mouseX <= 475)
{
x=mouseX;
}
}
fill(127, 0, 0);
rect (x, 20, 9, 60);
fill (255);
// left arrow button
fill (200);
rect (10, 25, 50, 50);
fill(0);
if (mousePressed && overRect(10, 25, 50, 50)) {
fill(255);
x--;
}
triangle (50, 60, 50, 40, 15, 50);
// right arrow button
fill (200);
rect (490, 25, 50, 50);
fill(0);
if (mousePressed && overRect(490, 25, 50, 50)){
fill(255);
x++;
}
triangle (500, 60, 500, 40, 535, 50);
// ensure x remains within the slide limits
x = constrain(x, 75, 475);
println(x);
}
boolean overRect(int x, int y, int width, int height) {
if (mouseX >= x && mouseX <= x+width &&
mouseY >= y && mouseY <= y+height) {
return true;
} else {
return false;
}
}

counter updating/repainting graphics

I'm creating a Hangman game where a player enters a word and the other player tries to guess that word. There are 26 JButtons on the screen (with each letter of the alphabet).
Each time a correct letter is chosen a counter variable increments. The number of the counter variable dictates how much of the hangman is drawn (7 is when the hangman is fully drawn). I can get counter to increment when the correct letter is chosen but I cannot get parts of the hangman to be drawn when it does increment.
Here is my Hangman class that draws the Hangman and includes the incrementCounter method:
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;
public class HangMan extends JPanel implements ActionListener {
private int xS = 8;
private int yS = 30;
public int counter;
private Color hatColor = Color.BLACK;
private int dx = 0;
private int dy = 0;
public HangMan(int initalX, int initalY) {
// starting location
xS = initalX;
yS = initalY;
counter = 0;
Dimension dim = new Dimension(250, 475);
this.setPreferredSize(dim);
setFocusable(true);
requestFocusInWindow();
this.setVisible(true);
}
public void drawHangMan(Graphics g) {
g.setColor(Color.BLACK);
if (counter == 0) {
repaint();
}
if (counter == 1) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
repaint();
}
if (counter == 2) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
repaint();
}
if (counter == 3) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
drawBody(xS + 25, yS + 80, xS + 25, yS + 175, g); // body
repaint();
}
if (counter == 4) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
drawBody(xS + 25, yS + 80, xS + 25, yS + 175, g); // body
drawLeftLeg(xS - 20, yS + 225, xS + 25, yS + 175, g); //left leg
repaint();
}
if (counter == 5) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
drawBody(xS + 25, yS + 80, xS + 25, yS + 175, g); // body
drawLeftLeg(xS - 20, yS + 225, xS + 25, yS + 175, g); //left leg
drawRightLeg(xS + 25, yS + 175, xS + 65, yS + 225, g); //right leg
repaint();
}
if (counter == 6) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
drawBody(xS + 25, yS + 80, xS + 25, yS + 175, g); // body
drawLeftLeg(xS - 20, yS + 225, xS + 25, yS + 175, g); //left leg
drawRightLeg(xS + 25, yS + 175, xS + 65, yS + 225, g); //right leg
drawLeftArm(xS - 20, yS + 90, xS + 25, yS + 120, g); //left arm
repaint();
}
if (counter == 7) {
drawHat(xS + 15, yS - 1, 20, 25, g); // hat
drawBrim(xS + 10, yS + 25, 30, 6, g); // brim
drawHead(xS, yS + 30, 50, 50, g); // head
drawBody(xS + 25, yS + 80, xS + 25, yS + 175, g); // body
drawLeftLeg(xS - 20, yS + 225, xS + 25, yS + 175, g); //left leg
drawRightLeg(xS + 25, yS + 175, xS + 65, yS + 225, g); //right leg
drawLeftArm(xS - 20, yS + 90, xS + 25, yS + 120, g); //left arm
drawRightArm(xS + 25, yS + 120, xS + 70, yS + 90, g); //right arm
repaint();
}
}
public void drawLeftArm(int a, int b, int x, int y, Graphics g) {
g.drawLine(a, b, x, y); //left arm
repaint();
}
public void drawRightArm(int a, int b, int x, int y, Graphics g) {
g.drawLine(a, b, x, y); //left arm
repaint();
}
public void drawLeftLeg(int a, int b, int x, int y, Graphics g) {
g.drawLine(a, b, x, y); //left arm
repaint();
}
public void drawRightLeg(int a, int b, int x, int y, Graphics g) {
g.drawLine(a, b, x, y); //left arm
repaint();
}
public void drawBody(int a, int b, int x, int y, Graphics g) {
g.drawLine(a, b, x, y); //left arm
repaint();
}
public void drawHead(int a, int b, int x, int y, Graphics g) {
g.drawOval(a, b, x, y); //left arm
repaint();
}
public void drawHat(int a, int b, int x, int y, Graphics g) {
g.drawRect(a, b, x, y); //left arm
repaint();
}
public void drawBrim(int a, int b, int x, int y, Graphics g) {
g.drawRect(a, b, x, y); //left arm
repaint();
}
public void drawHanger(Graphics g) {
g.fillRect(xS - 125, yS + 300, 80, 20);
g.drawLine(xS - 85, yS + 300, xS - 85, yS + 80);
g.drawLine(xS - 85, yS + 80, xS + 22, yS + 80);
}
public void incrementCounter() {
counter++;
System.out.println("counter = " + counter);
repaint();
}
public void paintComponent(Graphics g) {
super.paintComponent(g);
drawHangMan(g);
drawHanger(g);
repaint();
g.setFont(new Font("Sherif", Font.BOLD, 40));
}
public void actionPerformed(ActionEvent e) {
repaint();
}
}
Now here is my Button Class that draws the 26 JButtons and includes the ActionListener that will call the update method every time a button is clicked
import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JPanel;
public class Button extends JPanel {
JButton[] grid = new JButton[26];
Dashes dash;
public Button(String str, Dashes dash) {
this.dash = dash;
final String alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
Dimension dim = new Dimension(360, 360);
this.setPreferredSize(dim);
ActionListener listener = new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
String action = e.getActionCommand();
System.out.println(action);
dash.update(action);
dash.repaint();
/*
add(new JLabel(action + ""));
setVisible(true);
*/
}
};
for (int i = 0; i < grid.length; i++) {
grid[i] = (JButton) this.add(new JButton(alphabet.charAt(i) + ""));
grid[i].addActionListener(listener);
this.setVisible(true);
}
}
}
and here is my Dashes class that contains the update method
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.geom.Line2D;
import javax.swing.JLabel;
import javax.swing.JPanel;
public class Dashes extends JPanel {
JLabel label;
String word;
String guess = "";
HangMan hang;
public Dashes(String word) {
this.word = word;
hang = new HangMan(150, 150);
for (int i = 0; i < word.length(); i++) {
guess += " ";
}
word = word.toUpperCase();
Dimension dim = new Dimension(1500, 300);
this.setPreferredSize(dim);
this.setVisible(true);
}
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2d = (Graphics2D) g;
drawDashes(g2d);
}
private void drawDashes(Graphics2D g2d) {
for (int i = 0; i < word.length() * 50; i += 50) {
g2d.draw(new Line2D.Double(100.0 + i, 200.0, 125.0 + i, 200.0));
for (int j = 0; j < guess.length(); j++) {
g2d.drawString(guess.charAt(j) + "", 108 + j * 50, 198);
}
// g2d.drawString("m", 108 + i, 198);
}
}
public void update(String str) {
for (int i = 0; i < word.length(); i++) {
if (str.equals(word.charAt(i) + "")) {
guess = guess.substring(0, i) + str + guess.substring(i + 1);
hang.incrementCounter();
hang.repaint();
}
}
}
}
I'm sorry for making such a small problem so long. I would like to mention that if I initially set counter to be 2, for example, it would correctly draw the hat, brim and head. Some background: I was assigned a Java graphics project without ever actually having been taught graphics!

1 - Remove repaint() from the paint logic (as said in comment)
2 - in Dashes.update() use String.equalsIgnoreCase() instead of String.equals() (probably you have lowercase word and are comparing with uppercase charactere from the Button class).
3 - in Dashes.update() increment counter and repaint HangMan only if you miss:
public void update(String str) {
boolean found = false;
for (int i = 0; i < word.length(); i++) {
if (str.equalsIgnoreCase(word.charAt(i) + "")) {
guess = guess.substring(0, i) + str + guess.substring(i + 1);
found = true;
}
}
if(!found) {
hang.incrementCounter();
hang.repaint();
}
}

Detecting if a 2D Graphics fill Rect is in another fillRect(eclipse)

private JPanel contentPane;
private KeyListener myKeyListener;
JLabel lblUp;
JLabel lblMiddle;
JLabel lblDown;
JButton btnStart;
JLabel lblScore;
int lblu = 0;
int x = 0;
int y = 50;
int u = 1;
int w = 1;
int rxx = 0;
int ryy = 0;
int s = 0;
Timer timer;
/**
* Launch the application.
*/
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
public void run() {
try {
Game_1 frame = new Game_1();
frame.setVisible(true);
} catch (Exception e) {
e.printStackTrace();
}
}
});
}
/**
* Create the frame.
*/
public Game_1() {
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setBounds(100, 100, 450, 300);
contentPane = new JPanel();
contentPane.setBorder(new EmptyBorder(5, 5, 5, 5));
setContentPane(contentPane);
contentPane.setLayout(null);
JLabel lblScore = new JLabel("0");
lblScore.setHorizontalAlignment(SwingConstants.CENTER);
lblScore.setForeground(Color.GREEN);
lblScore.setBounds(388, 0, 46, 14);
contentPane.add(lblScore);
addKeyListener(this);
}
public void keyPressed(KeyEvent arg0) {
Graphics pen = this.contentPane.getGraphics();
int maxh = contentPane.getHeight();
int maxw = contentPane.getWidth();
if(y < 0){
y = maxh -50;
}
if(y > maxh-45){
y = 0;
}
if (arg0.getKeyCode() == KeyEvent.VK_UP) {
if(u ==0){
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
y = y - 10;
pen.setColor(Color.GREEN);
pen.fillRect(x, y, 50, 50);
pen.setColor(Color.BLACK);
pen.fillRect(x - 50, y, 50, 50);
x = x + 1;
if (x >= maxw) {
pen.fillRect(x - 30, y, 50, 50);
x = 0;
}
}
} else if (arg0.getKeyCode() == KeyEvent.VK_RIGHT) {
if(u ==1){
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
Timer timer = new Timer(100, this);
timer.start();
u = 0;
}else if(u ==0){
x = x +10;
}
} else if (arg0.getKeyCode() == KeyEvent.VK_DOWN) {
if(u ==0){
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
pen.setColor(Color.BLACK);
y = y+ 10;
if (x >= maxw) {
pen.fillRect(x - 30, y, 50, 50);
x = 0;
}
}
} else if (arg0.getKeyCode() == KeyEvent.VK_LEFT) {
if(u ==0){
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
pen.setColor(Color.BLACK);
x = x- 10;
if (x < 0) {
pen.fillRect(x - 30, y, 50, 50);
x = maxw;
}
}
}
}
public void keyReleased(KeyEvent arg0) {
}
public void keyTyped(KeyEvent arg0) {
}
public void run() {
}
#Override
public void actionPerformed(ActionEvent arg0) {
Graphics pen = this.contentPane.getGraphics();
int maxh = contentPane.getHeight();
int maxw = contentPane.getWidth();
pen.setColor(Color.BLACK);
pen.fillRect(0, 0, maxw, maxh);
pen.setColor(Color.GREEN);
pen.fillRect(x, y, 50, 50);
pen.setColor(Color.BLACK);
pen.fillRect(x - 50, y, 50, 50);
x = x + 1;
if (x >= maxw) {
pen.fillRect(x - 30, y, 50, 50);
x = 0;
}
if(w ==1){
Random r = new Random();
int ry = r.nextInt(maxh - 0) + 100;
int rx = r.nextInt(maxw - 0) + 100;
rxx = rx;
ryy = ry;
pen.setColor(Color.RED);
pen.fillRect(rx, ry, 10, 10);
w = 0;
}
pen.setColor(Color.RED);
pen.fillRect(rxx, ryy, 10, 10);
if(x-50 <= rxx && x > rxx && y > ryy && y-50 <= ryy){
s ++;
System.out.println("PUNKT");
pen.setColor(Color.BLACK);
pen.fillRect(rxx, ryy, 10, 10);
w = 1;
}
}
}
here is the Problem: it only detects that they touch in the left top >corner(the wrong code is at the end, the last if)
you can start the game by pressing the Right arrow Button on you're Keyboard.Moving upwards: up Key on you're Keyboard.Moving downwards:down Key on your're Keyboard.The right Button also lets you move to the right, the left Button to the left.Picture of the Game

I want, that the Rect detects that it touches the other in every part
of it, not only in the left top corner
Let's assume you've got first rect with: x1, y1, width1, height1 and second rect with x2, y2, width2, height2. The first rect touched the second in every part of it (so the second one is contained in the first one) when x1 <= x2 && x2+width2 <= x1+width2 && y1 <= y2 && y2+height <= y1+height
so
if (x1 <= x2 && x2+width2 <= x1+width2 && y1 <= y2 && y2+height <= y1+height) {
// the second rect is contained in the first rect
}

So I finally fixed it. For those who are interested, here is the fixed part of the code:
if (x+d >= x2 && x <= x2 && y+d >=y2 && y <= y2) {
s++;
d = d + s*10;
System.out.println("PUNKT");
pen.setColor(Color.BLACK);
pen.fillRect(x2, y2, 10, 10);
w = 1;
if (s == 10) {
JOptionPane.showMessageDialog(frame, "Achievement get: " + s + "Punkte!");
}

"The nested type cannot hide an enclosing type" class - Java Processing

I'm getting this error: The nested type cannot hide an enclosing type. I have looked it up, and other people seem to be declaring their class twice, which I am not.
What's weird is if I copy and paste the code into a new processing document, it works with no error. But as I'm converting it to js i need it to work with no errors after saving and opening again.
MotorBike Bike1, Bike2, Bike3, Bike4, Bike5, Bike6, Bike7, Bike8, Bike9;
int Score_Bike1 = 0;
int Score_Bike2 = 0;
int Score_Bike3 = 0;
int Score_Bike4 = 0;
int Score_Bike5 = 0;
int Score_Bike6 = 0;
int Score_Bike7 = 0;
int Score_Bike8 = 0;
int Score_Bike9 = 0;
String Score_Spacing = " ";
int GameState = 0;
class MotorBike {
float Pos_X;
int Pos_Y;
float Speed;
int Size = 30;
float WheelSize = Size / 3;
color Color;
MotorBike(int Declare_X, int Declare_Y, int Declare_Speed, color Declare_Color)
{
this.Pos_X = Declare_X;
this.Pos_Y = Declare_Y;
Speed = Declare_Speed;
Color = Declare_Color;
}
void move()
{
if (GameState == 1) {
Speed = (random(0, 50) / 10);
Pos_X = Pos_X + Speed;
}
}
void render()
{
fill(Color);
triangle(Pos_X, Pos_Y, Pos_X + Size, Pos_Y, Pos_X + Size / 2, Pos_Y -Size / 2);
fill(255);
strokeWeight(1.5);
ellipse(Pos_X, Pos_Y, WheelSize, WheelSize);
ellipse(Pos_X + Size, Pos_Y, WheelSize, WheelSize);
}
}
void setup()
{
size(700, 600);
background(200);
SpawnBikes();
}
void draw()
{
background(200);
strokeWeight(3);
line(50, 10, 50, 590);
line(650, 10, 650, 590);
strokeWeight(1);
MoveBikes();
DetectWinner();
DisplayScore();
}
void MoveBikes()
{
Bike1.render();
Bike1.move();
Bike2.render();
Bike2.move();
Bike3.render();
Bike3.move();
Bike4.render();
Bike4.move();
Bike5.render();
Bike5.move();
Bike6.render();
Bike6.move();
Bike7.render();
Bike7.move();
Bike8.render();
Bike8.move();
Bike9.render();
Bike9.move();
}
void DetectWinner()
{
textSize(15);
fill(0);
if (Bike1.Pos_X >= 620) {
noLoop();
text("Bike 1 Wins", 310, 10, 350, 50);
Score_Bike1 += 1;
GameState = 2;
}
if (Bike2.Pos_X >= 620) {
noLoop();
text("Bike 2 Wins", 310, 10, 350, 50);
Score_Bike2 += 1;
GameState = 2;
}
if (Bike3.Pos_X >= 620) {
noLoop();
text("Bike 3 Wins", 310, 10, 350, 50);
Score_Bike3 += 1;
GameState = 2;
}
if (Bike4.Pos_X >= 620) {
noLoop();
text("Bike 4 Wins", 310, 10, 350, 50);
Score_Bike4 += 1;
GameState = 2;
}
if (Bike5.Pos_X >= 620) {
noLoop();
text("Bike 5 Wins", 310, 10, 350, 50);
Score_Bike5 += 1;
GameState = 2;
}
if (Bike6.Pos_X >= 620) {
noLoop();
text("Bike 6 Wins", 310, 10, 350, 50);
Score_Bike6 += 1;
GameState = 2;
}
if (Bike7.Pos_X >= 620) {
noLoop();
text("Bike 7 Wins", 310, 10, 350, 50);
Score_Bike7 += 1;
GameState = 2;
}
if (Bike8.Pos_X >= 620) {
noLoop();
text("Bike 8 Wins", 310, 10, 350, 50);
Score_Bike8 += 1;
GameState = 2;
}
if (Bike9.Pos_X >= 620) {
noLoop();
text("Bike 9 Wins", 310, 10, 350, 50);
Score_Bike9 += 1;
GameState = 2;
}
}
void DisplayScore()
{
textSize(15);
fill(0);
text("Bike 1: " + Score_Bike1 + Score_Spacing + "Bike 2: " + Score_Bike2 + Score_Spacing + "Bike 3: " +
Score_Bike3 + Score_Spacing + "Bike 4: " + Score_Bike4 + Score_Spacing + "Bike 5: " + Score_Bike5 + Score_Spacing +
"Bike 6: " + Score_Bike6 + Score_Spacing + "Bike 7: " + Score_Bike7 + Score_Spacing + "Bike 8: " + Score_Bike8 +
Score_Spacing + "Bike 9: " + Score_Bike9, 65, 530, 635, 700);
}
void keyPressed()
{
if (keyPressed) {
if (key == ' ')
{
if (GameState == 0) {
GameState = 1;
}
if (GameState == 2) {
loop();
background(200);
SpawnBikes();
GameState = 0;
}
}
}
}
void SpawnBikes()
{
Bike1 = new MotorBike(50, 100, 2, color(255, 0, 0));
Bike2 = new MotorBike(50, 150, 2, color(0, 255, 0));
Bike3 = new MotorBike(50, 200, 2, color(0, 0, 255));
Bike4 = new MotorBike(50, 250, 2, color(255, 255, 0));
Bike5 = new MotorBike(50, 300, 2, color(0, 255, 255));
Bike6 = new MotorBike(50, 350, 2, color(255, 0, 255));
Bike7 = new MotorBike(50, 400, 2, color(100, 255, 0));
Bike8 = new MotorBike(50, 450, 2, color(0, 100, 255));
Bike9 = new MotorBike(50, 500, 2, color(255, 0, 100));
}

Your problem is caused by the fact that you're naming your sketch the same thing as a class you're using inside your sketch. Your sketch can't be named MotorBike if you have a MotorBike class inside that sketch.
Either rename your sketch, or rename your class.
Behind the scenes, this is because Processing exports your sketch as a Java class, and any classes in your sketch become inner classes of that Java class. So your sketch becomes something like this:
class MotorBike{
void draw(){
//whatever
}
class MotorBike{
int x;
//whatever
}
}
This is illegal Java, which is what's causing your error. You can't have an inner class with the same name as a parent class. In other words, a nested type cannot hide an enclosing type.
This is also why it works okay when you copy it into a new sketch- Processing gives your sketch a random default name, so you don't have this name collision until you save your sketch as something else.

Java Formating a string to have a decimal place

I have a military like game and there is a bar at the top that tells the time.(example) when it is 4:06 in the morning it says 4:6 is there a way I can change that to say 04:06 but also say (example) 11:45 and not 011:045.
Here is the time class:
public class Hud {
public int x, y;
public int money = 1000;
public int reputation = 5;
public int wifi = 3;
public int time = 0;
public int timer = 10;
public int minute = 50;
public int hour = 10;
public Hud(int x, int y) {
this.x = x;
this.y = y;
}
public void tick() {
if (time >= timer) {
time = 0;
minute++;
} else if (time <= timer) {
time++;
}
if (minute >= 60) {
minute = 0;
hour++;
}
if (hour >= 24) {
hour = 0;
}
}
public void render(Graphics g) {
Graphics2D g2 = (Graphics2D) g;
RenderingHints rh = new RenderingHints(RenderingHints.KEY_TEXT_ANTIALIASING, RenderingHints.VALUE_TEXT_ANTIALIAS_GASP);
g2.setRenderingHints(rh);
g.setColor(Color.LIGHT_GRAY);
g.fillRect(x, y, Comp.size.width + 9, 20);
g.setColor(Color.DARK_GRAY);
g.drawRect(x, y, Comp.size.width + 9, 20);
// money
g.setColor(Color.yellow);
g.setFont(new Font("italic", Font.BOLD, 15));
g.drawString("€ " + money, 10, 17);
// reputation
g.setColor(Color.black);
g.setFont(new Font("italic", Font.BOLD, 15));
g.drawString("Rep: " + reputation, 100, 16);
// time
g.setColor(Color.black);
g.setFont(new Font("italic", Font.BOLD, 15));
g.drawString("" + hour + ":" + minute, Comp.size.width / 2 - 20, 16);
}
}

This has absolutely nothing to do with Font (and so I'm not sure why you mention Font in your question title) and all to do with number formatting. You could do something like:
String displayString = String.format("%02d:%02d", minutes, seconds);
What this does is format the ints found in minutes and seconds into two digit Strings, prepended by a "0" if the int is only one digit long.
The "%02d" are format specifier Strings that help the String.format or java.util.Formatter know how you want to format the number. The % tells the formatter that this is a format specifier. 02 means to make it 2 digits wide and pre-pend a 0 if need b. d means that it's a decimal number.
e.g.,
g.setColor(Color.black);
g.setFont(new Font("italic", Font.BOLD, 15));
String displayString = String.format("%02d:%02d", hour, minute);
g.drawString(displayString, Comp.size.width / 2 - 20, 16);