How to fix the clock from flickering? - java

I am currently making an analog clock in java using AWT Package and Swing. But the digital clock overlay is currently flickering every once in a while and I'd like to fix that.
I've read about implementing double buffered in conjunction with repaint() but I am stuck on how to implement it.
import java.applet.Applet;
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.Graphics;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.GregorianCalendar;
import java.util.TimeZone;
import java.util.Timer;
import java.util.TimerTask;
import javax.swing.JFrame;
public class Clock2d extends Applet {
GregorianCalendar cal;
Timer clockTimer = new Timer();
TimeZone clockTimeZone = TimeZone.getDefault();
public Clock2d() {
clockTimer.schedule(new TickTimerTask(), 0, 1000);
}
#Override
public void init() {
}
public void paint(Graphics g) {
g.setColor(Color.BLUE);
g.fillOval(40, 40, 220, 220);
g.setColor(Color.WHITE);
g.fillOval(50, 50, 200, 200);
double second = cal.get(Calendar.SECOND);
double minute = cal.get(Calendar.MINUTE);
double hours = cal.get(Calendar.HOUR);
for (int i = 0; i < 60; i++) {
int length = 90;
double rad = (i * 6) * (Math.PI) / 180;
if (i % 5 == 0) {
length = 82;
g.setColor(Color.BLUE);
} else {
g.setColor(Color.GRAY);
}
int x = 150 + (int) (95 * Math.cos(rad - (Math.PI / 2)));
int y = 150 + (int) (95 * Math.sin(rad - (Math.PI / 2)));
int x1 = 150 + (int) (length * Math.cos(rad - (Math.PI / 2)));
int y1 = 150 + (int) (length * Math.sin(rad - (Math.PI / 2)));
g.drawLine(x, y, x1, y1);
}
drawHands(g, second, minute, hours);
SimpleDateFormat sdf = new SimpleDateFormat("hh:mm:ss");
g.setColor(Color.BLUE);
g.setFont(new Font("Tahoma", Font.BOLD, 16));
g.drawString(sdf.format(cal.getTime()), 120, 20);
g.setFont(new Font("Arial", Font.BOLD, 10));
}
public void drawHands(Graphics g, double second, double minute, double hours) {
double rSecond = (second * 6) * (Math.PI) / 180;
double rMinute = ((minute + (second / 60)) * 6) * (Math.PI) / 180;
double rHours = ((hours + (minute / 60)) * 30) * (Math.PI) / 180;
g.setColor(Color.RED);
g.drawLine(150, 150, 150 + (int) (100 * Math.cos(rSecond - (Math.PI / 2))), 150 + (int) (100 * Math.sin(rSecond - (Math.PI / 2))));
g.setColor(Color.BLACK);
g.drawLine(150, 150, 150 + (int) (70 * Math.cos(rMinute - (Math.PI / 2))), 150 + (int) (70 * Math.sin((rMinute - (Math.PI / 2)))));
g.drawLine(150, 150, 150 + (int) (50 * Math.cos(rHours - (Math.PI / 2))), 150 + (int) (50 * Math.sin(rHours - (Math.PI / 2))));
}
class TickTimerTask extends TimerTask {
#Override
public void run() {
cal = (GregorianCalendar) GregorianCalendar.getInstance(clockTimeZone);
repaint();
}
}
public static void main(String[] args) {
JFrame frame = new JFrame("Clock 2D");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setPreferredSize(new Dimension(330, 330));
Clock2d clock2d = new Clock2d();
clock2d.setPreferredSize(new Dimension(320, 320));
clock2d.init();
frame.setLayout(new BorderLayout());
frame.getContentPane().add(clock2d, BorderLayout.CENTER);
frame.pack();
frame.setVisible(true);
}
}
The code work exactly as intended aside from the occasional flickering of the Numbered Digital clock.

public class Clock2d extends Applet A java.awt.Applet is not only deprecated, but also not double buffered by default. Change that to extend a JPanel (which is).
Then change public void paint(Graphics g) { to public void paintComponent(Graphics g) { super.paintComponent(g); to respect the paint chain.
class TickTimerTask extends TimerTask use a javax.swing.Timer instead. It runs on the Event Dispatch Thread, and any calls to the GUI should be made on the EDT.
Here are those three points, expressed in the code. Do you see the 'flickering' artifacts in this version?
import java.awt.*;
import java.awt.event.*;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.GregorianCalendar;
import java.util.TimeZone;
import javax.swing.*;
public class Clock2d extends JPanel {
TimeZone clockTimeZone = TimeZone.getDefault();
GregorianCalendar cal =
(GregorianCalendar) GregorianCalendar.getInstance(clockTimeZone);
ActionListener repaintListener = (ActionEvent e) -> {
cal = (GregorianCalendar) GregorianCalendar.getInstance(clockTimeZone);
repaint();
};
Timer clockTimer = new Timer(100, repaintListener);
public Clock2d() {
clockTimer.start();
}
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(Color.BLUE);
g.fillOval(40, 40, 220, 220);
g.setColor(Color.WHITE);
g.fillOval(50, 50, 200, 200);
double second = cal.get(Calendar.SECOND);
double minute = cal.get(Calendar.MINUTE);
double hours = cal.get(Calendar.HOUR);
for (int i = 0; i < 60; i++) {
int length = 90;
double rad = (i * 6) * (Math.PI) / 180;
if (i % 5 == 0) {
length = 82;
g.setColor(Color.BLUE);
} else {
g.setColor(Color.GRAY);
}
int x = 150 + (int) (95 * Math.cos(rad - (Math.PI / 2)));
int y = 150 + (int) (95 * Math.sin(rad - (Math.PI / 2)));
int x1 = 150 + (int) (length * Math.cos(rad - (Math.PI / 2)));
int y1 = 150 + (int) (length * Math.sin(rad - (Math.PI / 2)));
g.drawLine(x, y, x1, y1);
}
drawHands(g, second, minute, hours);
SimpleDateFormat sdf = new SimpleDateFormat("hh:mm:ss");
g.setColor(Color.BLUE);
g.setFont(new Font("Tahoma", Font.BOLD, 16));
g.drawString(sdf.format(cal.getTime()), 120, 20);
g.setFont(new Font("Arial", Font.BOLD, 10));
}
public void drawHands(Graphics g, double second, double minute, double hours) {
double rSecond = (second * 6) * (Math.PI) / 180;
double rMinute = ((minute + (second / 60)) * 6) * (Math.PI) / 180;
double rHours = ((hours + (minute / 60)) * 30) * (Math.PI) / 180;
g.setColor(Color.RED);
g.drawLine(150, 150, 150 + (int) (100 * Math.cos(rSecond - (Math.PI / 2))), 150 + (int) (100 * Math.sin(rSecond - (Math.PI / 2))));
g.setColor(Color.BLACK);
g.drawLine(150, 150, 150 + (int) (70 * Math.cos(rMinute - (Math.PI / 2))), 150 + (int) (70 * Math.sin((rMinute - (Math.PI / 2)))));
g.drawLine(150, 150, 150 + (int) (50 * Math.cos(rHours - (Math.PI / 2))), 150 + (int) (50 * Math.sin(rHours - (Math.PI / 2))));
}
public static void main(String[] args) {
// Swing / AWT GUIs should be created & changed on the EDT ..
Runnable r = () -> {
JFrame frame = new JFrame("Clock 2D");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setPreferredSize(new Dimension(330, 330));
Clock2d clock2d = new Clock2d();
clock2d.setPreferredSize(new Dimension(320, 320));
frame.setLayout(new BorderLayout());
frame.getContentPane().add(clock2d, BorderLayout.CENTER);
frame.pack();
frame.setVisible(true);
};
// .. this is how we ensure that Runnable is on the EDT.
SwingUtilities.invokeLater(r);
}
}
Further tip re fonts:
g.setFont(new Font("Arial", Font.BOLD, 10));
Given the paint method is called repeatedly, it would be best to establish the fonts (both of them) when the class is constructed and store them a attributes of the class (which can be referenced in the methods).
But better to use logical fonts instead of something like 'Arial', like this:
g.setFont(new Font(Font.SANS_SERIF, Font.BOLD, 10));
Not only does that provide compile time checking, but it adapts across OS platforms. For example, the SANS_SERIF font would result in Arial on Windows and probably most *nix boxes, but on OS X the default SANS_SERIF (undecorated) font is Helvetica.
The other font, Tahoma, is more problematic. Again it's likely to be present on many Windows boxes, but it might be best to either test for it and have a list of backups, or supply the font with the clock app. (assuming you have distribution rights).

Related

How to show graphics on JPanel directly at start?

I want to draw a Koch Curve Snowflake in my program, its working fine so far except for 1 Problem.
I want to show a drawn Curve directly at start up, but cant get this to show ( see section in code with comment). After I press the button intended to draw a curve, it shows just fine.
What do I need to change to show something drawn on the panel before any button is pressed?
package fractals;
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Point;
import java.awt.Rectangle;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.SwingUtilities;
public class fractalsGUI extends JFrame {
private JPanel drawPanel, menuPanel;
private JButton drawButton;
private JTextField iterField;
private final JLabel iterLabel = new JLabel("Iterations:");
private final int defaultIterations = 4;
private final double cos60 = 0.5;
private final double sin60 = 0.5 * Math.sqrt(3);
private final double lengthModifier = Math.sqrt(3) * 2 / 3;
public fractalsGUI() {
/*
* GUI grafics setup stuff
*
*/
setTitle("Koch Curve Snowflake Generator");
drawPanel = new JPanel();
menuPanel = new JPanel();
drawButton = new JButton();
iterField = new JTextField("" + defaultIterations, 2);
this.setSize(600, 600);
drawButton.setText("Draw Curve");
drawButton.setActionCommand("drawCurve");
setLayout(new BorderLayout());
this.add(drawPanel, BorderLayout.CENTER);
this.add(menuPanel, BorderLayout.SOUTH);
menuPanel.add(iterLabel);
menuPanel.add(iterField);
menuPanel.add(drawButton);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
/*
* draw initial Curve --- THIS DOES NOT SHOW ---
*/
drawSegment(drawPanel.getGraphics(), new Point(200,300), new Point(400,300), 3);
/*
* GUI Button functions
*
*/
drawButton.addActionListener(new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
if (e.getActionCommand().equals("drawCurve")) {
int iterations = Integer.parseInt(iterField.getText());
if (iterations > 8)
iterations = 8;
else if (iterations < 0)
iterations = 0;
drawCurve(iterations, drawPanel.getGraphics(), new Rectangle(drawPanel.getSize()));
}
}
});
}
public void drawSegment(Graphics g, Point start, Point end, int iteration) {
// base case
if (iteration == 0)
g.drawLine(start.x, start.y, end.x, end.y);
// recursion
else {
Point distance = new Point((end.x - start.x) / 3, (end.y - start.y) / 3);
Point firstThirdEnd = new Point(start.x + distance.x, start.y + distance.y);
Point lastThirdStart = new Point(end.x - distance.x, end.y - distance.y);
Point triangleTip = new Point(firstThirdEnd.x + (int) (distance.x * cos60 + distance.y * sin60), firstThirdEnd.y + (int) (distance.y * cos60 - distance.x * sin60));
drawSegment(g, start, firstThirdEnd, iteration - 1);
drawSegment(g, firstThirdEnd, triangleTip, iteration - 1);
drawSegment(g, triangleTip, lastThirdStart, iteration - 1);
drawSegment(g, lastThirdStart, end, iteration - 1);
}
}
public void drawCurve(int iterations, Graphics g, Rectangle bounds) {
// fill in background
g.setColor(Color.white);
g.fillRect(bounds.x, bounds.y, bounds.width, bounds.height);
double w, h;
if (bounds.height < (int) (bounds.width * lengthModifier)) {
// height is limiting
h = bounds.height;
w = h / lengthModifier;
}
else {
// width is limiting
w = bounds.width;
h = w * lengthModifier;
}
int top = bounds.y + (int) ((bounds.height - h) / 2 + (h / 4));
Point curve1start = new Point(bounds.x + (int) ((bounds.width - w) / 2), top);
Point curve2start = new Point(bounds.x + (int) ((bounds.width + w) / 2), top);
Point curve3start = new Point(bounds.x + (bounds.width / 2), bounds.y + (int) ((bounds.height + h) / 2));
// draw recursion
g.setColor(Color.red);
drawSegment(g, curve1start, curve2start, iterations);
g.setColor(Color.blue);
drawSegment(g, curve2start, curve3start, iterations);
g.setColor(Color.green);
drawSegment(g, curve3start, curve1start, iterations);
}
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
public void run() {
fractalsGUI mainWindow = new fractalsGUI();
}
});
}
}
after this
drawSegment(drawPanel.getGraphics(), new Point(200,300), new Point(400,300), 3);
call this
drawPanel.repaint()

PieChart in java not showing

My piechart in java isn't showing, for my class we are to make a piechart using graphics and the values are user-input based. even after trying to input any values, my piechart would not show up at all.
What am i doing wrong?
My code:
package ass15;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.HeadlessException;
import javax.swing.JFrame;
public class PieChart extends JFrame {
private int iNorth, iSouth, iEast, iWest, iMidWest;
public PieChart(int North, int South, int East, int West, int MidWest) throws HeadlessException {
super("Assignment 15");
this.iNorth = North;
this.iSouth = South;
this.iEast = East;
this.iWest = West;
this.iMidWest = MidWest;
}
public void Paint(Graphics g) {
//Integer to percent
double dNorth,dSouth,dEast,dWest,dMidWest, total;
dNorth = 0.00 + iNorth;
dSouth = 0.00 + iSouth;
dEast = 0.00 + iEast;
dWest = 0.00 + iWest;
dMidWest = 0.00 + iMidWest;
total = dNorth + dSouth + dEast + dWest + dMidWest;
//initial arc
int startAngle = 0;
double curValue = 0.00;
startAngle = (int) (curValue * 360/total);
int arcAngle = (int) (dNorth * 360/total);
g.setColor(Color.red);
g.fillArc(50, 50, 100, 100, startAngle, arcAngle);
//new arc
curValue += dNorth;
startAngle = (int) (curValue * 360/total);
arcAngle = (int) (dSouth * 360/total);
g.setColor(Color.green);
g.fillArc(50, 50, 50, 50, startAngle, arcAngle);
//new arc
curValue += dSouth;
startAngle = (int) (curValue * 360/total);
arcAngle = (int) (dEast * 360/total);
g.setColor(Color.blue);
g.fillArc(50, 50, 50, 50, startAngle, arcAngle);
//new arc
curValue += dEast;
startAngle = (int) (curValue * 360/total);
arcAngle = (int) (dWest * 360/total);
g.setColor(Color.magenta);
g.fillArc(50, 50, 50, 50, startAngle, arcAngle);
//new arc
curValue += dWest;
startAngle = (int) (curValue * 360/total);
arcAngle = (int) (dMidWest * 360/total);
g.setColor(Color.yellow);
g.fillArc(50, 50, 50, 50, startAngle, arcAngle);
//background circle
g.setColor( Color.black );
g.drawArc( 50, 50, 50, 50, 0, 360 );
}
}
and my main is:
package ass15;
import java.util.StringTokenizer;
import javax.swing.JFrame;
import javax.swing.JOptionPane;
public class TestPieChart {
public static void main(String[] args) {
int north,south,east,west,midwest;
String token;
String in = "";
in = JOptionPane.showInputDialog("Input sales for regions");
StringTokenizer stk = new StringTokenizer(in, ",");
token = stk.nextToken().trim();
north = Integer.parseInt(token);
token = stk.nextToken().trim();
south = Integer.parseInt(token);
token = stk.nextToken().trim();
east = Integer.parseInt(token);
token = stk.nextToken().trim();
west = Integer.parseInt(token);
token = stk.nextToken().trim();
midwest = Integer.parseInt(token);
PieChart pi = new PieChart(north,south,east,west,midwest);
pi.setVisible(true);
pi.setSize(500, 500);
}
}
It was a stupid mistake...
ANSWER:
the method
Paint(Graphics g)
should be
paint(Graphics g)
did not realize that until i played with the code.

Analog Clock working but seconds repainting

I made an Analog Clock and its working but when a remove the filloval (Background) the seconds hand keep repeating itself and but when i add filloval it is working. but i do not want the background there. Thanks
here is the code
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Locale;
import javax.swing.JFrame;
import javax.swing.JPanel;
public class Clock extends JPanel implements Runnable {
Thread thread = null;
SimpleDateFormat formatter = new SimpleDateFormat("s", Locale.getDefault());
Date currentDate;
int xcenter = 175, ycenter = 175, lastxs = 0, lastys = 0, lastxm = 0, lastym = 0, lastxh = 0, lastyh = 0;
private void drawStructure(Graphics g) {
g.setFont(new Font("TimesRoman", Font.BOLD, 20));
g.setColor(Color.black);
//g.fillOval(xcenter - 150, ycenter - 150, 300, 300);
g.setColor(Color.blue);
g.setColor(Color.green);
g.drawString("9", xcenter - 145, ycenter + 0);
g.drawString("3", xcenter + 135, ycenter + 0);
g.drawString("12", xcenter - 10, ycenter - 130);
g.drawString("6", xcenter - 10, ycenter + 145);
}
public void paint(Graphics g) {
int xhour, yhour, xminute, yminute, xsecond, ysecond, second, minute, hour;
drawStructure(g);
currentDate = new Date();
formatter.applyPattern("s");
second = Integer.parseInt(formatter.format(currentDate));
formatter.applyPattern("m");
minute = Integer.parseInt(formatter.format(currentDate));
formatter.applyPattern("h");
hour = Integer.parseInt(formatter.format(currentDate));
xsecond = (int) (Math.cos(second * 3.14f / 30 - 3.14f / 2) * 120 + xcenter);
ysecond = (int) (Math.sin(second * 3.14f / 30 - 3.14f / 2) * 120 + ycenter);
xminute = (int) (Math.cos(minute * 3.14f / 30 - 3.14f / 2) * 100 + xcenter);
yminute = (int) (Math.sin(minute * 3.14f / 30 - 3.14f / 2) * 100 + ycenter);
xhour = (int) (Math.cos((hour * 30 + minute / 2) * 3.14f / 180 - 3.14f / 2) * 80 + xcenter);
yhour = (int) (Math.sin((hour * 30 + minute / 2) * 3.14f / 180 - 3.14f / 2) * 80 + ycenter);
// Erase if necessary, and redraw
g.drawLine(xcenter, ycenter, xsecond, ysecond);
g.setColor(Color.red);
g.drawLine(xcenter, ycenter - 1, xminute, yminute);
g.drawLine(xcenter - 1, ycenter, xminute, yminute);
g.setColor(Color.green);
g.drawLine(xcenter, ycenter - 1, xhour, yhour);
g.drawLine(xcenter - 1, ycenter, xhour, yhour);
lastxs = xsecond;
lastys = ysecond;
lastxm = xminute;
lastym = yminute;
lastxh = xhour;
lastyh = yhour;
}
public void start() {
if (thread == null) {
thread = new Thread(this);
thread.start();
}
}
public void stop() {
thread = null;
}
public void run() {
while (thread != null) {
try {
Thread.sleep(100);
} catch (InterruptedException e) {
}
repaint();
}
thread = null;
}
public void update(Graphics g) {
paint(g);
}
public static void main(String args[]) {
JFrame frame = new JFrame();
Color c = new Color(118, 73, 190);
frame.setBackground(c);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setBounds(0, 0, 400, 400);
Clock clock = new Clock();
frame.getContentPane().add(clock);
frame.setVisible(true);
}
}
Instead of overriding paint(), Swing programs should override paintComponent(). In addition, invoke super.paintComponent() to avoid this kind of rendering artifact. A similar problem is illustrated in this related example. Some additional observations:
Swing programs should be constructed and updates on the event dispatch thread.
Use a Swing timer to update the display.
As tested:
import java.awt.EventQueue;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.event.ActionEvent;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Locale;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.Timer;
//* #see https://stackoverflow.com/a/26213625/230513 */
public class Clock extends JPanel {
private Timer t = new Timer(1000, (ActionEvent e) -> {
repaint();
});
private SimpleDateFormat formatter = new SimpleDateFormat("s", Locale.getDefault());
private Date currentDate;
private int xcenter = 175, ycenter = 175, lastxs = 0, lastys = 0, lastxm = 0, lastym = 0, lastxh = 0, lastyh = 0;
private void drawStructure(Graphics g) {
g.setFont(new Font("TimesRoman", Font.BOLD, 20));
g.drawString("9", xcenter - 145, ycenter + 0);
g.drawString("3", xcenter + 135, ycenter + 0);
g.drawString("12", xcenter - 10, ycenter - 130);
g.drawString("6", xcenter - 10, ycenter + 145);
}
#Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2d = (Graphics2D) g;
g2d.setRenderingHint(
RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
int xhour, yhour, xminute, yminute, xsecond, ysecond, second, minute, hour;
drawStructure(g);
currentDate = new Date();
formatter.applyPattern("s");
second = Integer.parseInt(formatter.format(currentDate));
formatter.applyPattern("m");
minute = Integer.parseInt(formatter.format(currentDate));
formatter.applyPattern("h");
hour = Integer.parseInt(formatter.format(currentDate));
xsecond = (int) (Math.cos(second * 3.14f / 30 - 3.14f / 2) * 120 + xcenter);
ysecond = (int) (Math.sin(second * 3.14f / 30 - 3.14f / 2) * 120 + ycenter);
xminute = (int) (Math.cos(minute * 3.14f / 30 - 3.14f / 2) * 100 + xcenter);
yminute = (int) (Math.sin(minute * 3.14f / 30 - 3.14f / 2) * 100 + ycenter);
xhour = (int) (Math.cos((hour * 30 + minute / 2) * 3.14f / 180 - 3.14f / 2) * 80 + xcenter);
yhour = (int) (Math.sin((hour * 30 + minute / 2) * 3.14f / 180 - 3.14f / 2) * 80 + ycenter);
g.drawLine(xcenter, ycenter, xsecond, ysecond);
g.drawLine(xcenter, ycenter - 1, xminute, yminute);
g.drawLine(xcenter - 1, ycenter, xminute, yminute);
g.drawLine(xcenter, ycenter - 1, xhour, yhour);
g.drawLine(xcenter - 1, ycenter, xhour, yhour);
lastxs = xsecond;
lastys = ysecond;
lastxm = xminute;
lastym = yminute;
lastxh = xhour;
lastyh = yhour;
}
public void start() {
t.start();
}
public void stop() {
t.stop();
}
public static void main(String args[]) {
EventQueue.invokeLater(() -> {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setBounds(0, 0, 400, 400);
Clock clock = new Clock();
frame.getContentPane().add(clock);
frame.setVisible(true);
clock.start();
});
}
}

Java Animations

I've started to take interest with making animations(slideshows, backgrounds etc) in Java. I know that JavaFX is much better for doing this, but I'm just to stubborn to bother switching over.
Here is what I got so far.
import java.awt.Color;
import java.awt.GradientPaint;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.awt.image.BufferedImageOp;
import java.awt.image.ConvolveOp;
import java.awt.image.Kernel;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Random;
import javax.swing.JFrame;
import javax.swing.JPanel;
public class BlurredLightCells extends JPanel {
private static final long serialVersionUID = 4610174943257637060L;
private Random random = new Random();
private ArrayList<LightCell> lightcells;
private float[] blurData = new float[500];
public static void main(String[] args) {
JFrame frame = new JFrame("Swing animated bubbles");
frame.setSize(1000, 750);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(new BlurredLightCells(60));
frame.setVisible(true);
}
public BlurredLightCells(int amtOfBCells) {
setSize(1000, 750);
/**
* Below we initiate all the cells that are going to be drawn on screen
*/
Arrays.fill(blurData, 1f / 20f);
lightcells = new ArrayList<LightCell>(amtOfBCells);
for (int i = 0; i < amtOfBCells; i++) {
/**
* Below we generate all the values for each cell(SHOULD be random for each one)
*/
int baseSpeed = random(0, 3);
int xSpeed = (int) Math.floor((Math.random() * (baseSpeed - -baseSpeed + baseSpeed)) + -baseSpeed);
int ySpeed = (int) Math.round((Math.random() * baseSpeed) + 0.5);
int radius = random(25, 100);
int x = (int) Math.floor(Math.random() * getWidth());
int y = (int) Math.floor(Math.random() * getHeight());
int blurrAmount = (int) (Math.floor(Math.random() * 10) + 5);
int alpha = (int) ((Math.random() * 15) + 3);
/**
* Now we draw a image, and apply transparency and a slight blur to it
*/
Kernel kernel = new Kernel(blurrAmount, blurrAmount, blurData);
BufferedImageOp op = new ConvolveOp(kernel);
BufferedImage circle = new BufferedImage(150, 150, BufferedImage.TYPE_INT_ARGB);
Graphics2D circlegfx = circle.createGraphics();
circlegfx.setColor(new Color(255, 255, 255, alpha));
circlegfx.fillOval(20, 20, radius, radius);
circle = op.filter(circle, null);
LightCell bubble = new LightCell(x, y, xSpeed, ySpeed, radius, getDirection(random.nextInt(3)), circle);
lightcells.add(bubble);
}
}
public int random(int min, int max) {
final int n = Math.abs(max - min);
return Math.min(min, max) + (n == 0 ? 0 : random.nextInt(n));
}
#Override
public void paint(Graphics g) {
int w = getWidth();
int h = getHeight();
final Graphics2D g2 = (Graphics2D) g;
GradientPaint gp = new GradientPaint(-w, -h, Color.LIGHT_GRAY, w, h, Color.DARK_GRAY);
g2.setPaint(gp);
g2.fillRect(0, 0, w, h);
long start = System.currentTimeMillis();
for (int i = 0; i < lightcells.size(); i++) {
LightCell cell = lightcells.get(i);
cell.process(g2);
}
System.out.println("Took " + (System.currentTimeMillis() - start) + " milliseconds to draw ALL cells.");
repaint();
}
public String getDirection(int i) {
switch (i) {
case 0:
return "right";
case 1:
return "left";
case 2:
return "up";
case 3:
return "down";
}
return "";
}
private class LightCell {
private int x, y, xSpeed, ySpeed, radius;
private String direction;
private BufferedImage image;
public LightCell(int x, int y, int xSpeed, int ySpeed, int radius, String direction, BufferedImage image) {
this.x = x;
this.y = y;
this.xSpeed = xSpeed;
this.ySpeed = ySpeed;
this.radius = radius;
this.direction = direction;
this.image = image;
}
public void process(Graphics g) {
switch (direction) {
case "right":
moveRight();
break;
case "left":
moveLeft();
break;
case "up":
moveUp();
break;
case "down":
moveDown();
break;
}
g.drawImage(image, x, y, null);
}
private void moveUp() {
x += xSpeed;
y -= ySpeed;
if (y + (radius / 2) < 0) {
y = getHeight() + (radius / 2);
x = (int) Math.floor(Math.random() * getWidth());
}
if ((x + radius / 2) < 0 || (x - radius / 2) > getWidth()) {
y = radius + (radius / 2);
x = (int) Math.floor(Math.random() * getWidth());
}
}
private void moveDown() {
x += xSpeed;
y += ySpeed;
if (y - (radius / 2) > getHeight()) {
y = 0 - (radius / 2);
x = (int) Math.floor(Math.random() * getWidth());
}
if ((x + radius / 2) < 0 || (x - radius / 2) > getWidth()) {
y = getHeight() + (radius / 2);
x = (int) Math.floor(Math.random() * getWidth());
}
}
private void moveRight() {
x += ySpeed;
y += xSpeed;
if (y - (radius / 2) > getHeight() || y + (radius / 2) < 0) {
x = 0 - (radius / 2);
y = (int) Math.floor(Math.random() * getHeight());
}
if ((x - radius / 2) > getWidth()) {
x = 0 - (radius / 2);
y = (int) Math.floor(Math.random() * getWidth());
}
}
private void moveLeft() {
x -= ySpeed;
y -= xSpeed;
if (y - (radius / 2) > getHeight() || y + (radius / 2) < 0) {
x = getWidth() + (radius / 2);
y = (int) Math.floor(Math.random() * getHeight());
}
if ((x + radius / 2) < 0) {
x = getWidth() + (radius / 2);
y = (int) Math.floor(Math.random() * getWidth());
}
}
}
}
If you run that, you will see the cells move at a very high speed, and if you look through the code, you see I call repaint() in the paint method in which I override. I know thats not good to do. But my question is, is their any other way in which I could draw each cell outside of the repaint() loop I have right now, because that causes other components to flash/flicker when I use this in a JFrame with other components.
FYI: Aventually I'd like to achieve something similar to this: Click Here
Thanks!
The issue of flicker is to do with the fact that top level containers are not double buffered. Instead of extending from JFrame (or other top level containers), you should consider using something more like JPanel and override it's paintComponent.
nb- Had it in my head that the OP was extending from JFrame...
Two issues could be causing the flickering. The first is overriding paint, the second is not calling super.paint(g) and the time between the updates. A better solution would be to override paintComponent and make sure you are calling super.paintComponent. Also using something like a javax.swing.Timer to schedule updates and regular intervals would also help...
Only call repaint when you want to encourage the RepaintManager to update you component. Don't call repaint from within any paintXxx method, this will cause a never ending loop of paint requests to schedule onto the event queue, eventually consuiming your CPU
I would avoid doing anything in your paintXxx methods that might take time to perform, this will slow down the rendering process. Instead, I would use a javax.swing.Timer for simple updates or for more complicated processing, a Thread which could be used to update the model before it is rendered to the screen.
This is an example of some simple optimisation process I did to take animation of 500 objects to 4500 with only a slight degration in the overall performance.
Updated
I changed you code slight and it works fine...
I changed your paint method to paintComponent and added super.paintComponent(g)
#Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
int w = getWidth();
int h = getHeight();
final Graphics2D g2 = (Graphics2D) g;
GradientPaint gp = new GradientPaint(-w, -h, Color.LIGHT_GRAY, w, h, Color.DARK_GRAY);
g2.setPaint(gp);
g2.fillRect(0, 0, w, h);
for (int i = 0; i < lightcells.size(); i++) {
LightCell cell = lightcells.get(i);
cell.process(g2);
}
}
And at the end of your constructor I added...
Timer timer = new Timer(40, new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
repaint();
}
});
timer.start();
To update the UI on a regular bases...

Why does the clock flicker?

The following code is an animation of a clock.
What changes would have to be made in the program to make it not flicker?
Why does the field initiation have to take place in the addNotify() function for the hands to be displayed?
You can copy all of it into one .java file and it should work (flicker ;) ).
import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
import java.util.Calendar;
import java.util.GregorianCalendar;
public class ac extends Frame implements Runnable {
// for double buffering
Graphics og;
Image oi;
Thread t = null;
int width, height;
int timeH, timeM, timeS, radius = 50, lenH, lenM, lenS,
lenIn, cx, cy, x1, y1, x2, y2;
private boolean timeToQuit;
ac() {
addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent we) {
stopRunning();
dispose();
}
});
setMinimumSize(new Dimension(300, 300));
EventQueue.invokeLater(new Runnable() {
public void run() {
setVisible(true);
}
});
}
public void addNotify() {
super.addNotify();
width = getBounds().width;
height = getBounds().height;
setSize(width, height);
lenH = 5 * radius / 10;
lenM = 6 * radius / 10;
lenS = 7 * radius / 10;
lenIn = 8 * radius / 10;
cx = width / 2;
cy = height / 2;
// for double buffering
oi = createImage(width, height);
og = oi.getGraphics();
}
public static void main(String [] args) {
ac clock = new ac();
clock.start();
}
public void start() {
if (t == null) {
t = new Thread(this);
t.start();
}
}
public void stopRunning() {
timeToQuit = true;
}
public void run() {
Thread.currentThread().setPriority(Thread.NORM_PRIORITY - 1);
do {
repaint();
try {
Thread.sleep(500);
}
catch (InterruptedException e) {
}
}
while (!timeToQuit);
System.out.println("Quitting");
}
public void paint(Graphics g) {
og.setColor(new Color(170, 170, 170));
og.fillRect(0, 0, width, height);
Calendar cal = new GregorianCalendar();
timeH = cal.get(Calendar.HOUR);
timeM = cal.get(Calendar.MINUTE);
timeS = cal.get(Calendar.SECOND);
if (timeH >= 12)
timeH -= 12;
for (int i = 1 ; i < 13 ; i++) {
og.setColor(new Color(20, 20, 20));
x2 = (int) (cx + radius * Math.sin(i * 2 * 3.14159f / 12));
y2 = (int) (cy - radius * Math.cos(i * 2 * 3.14159f / 12));
if (i % 3 != 0) {
x1 = (int) (cx + 0.9f * radius * Math.sin(i * 2 * 3.14159f / 12));
y1 = (int) (cy - 0.9f * radius * Math.cos(i * 2 * 3.14159f / 12));
}
else {
x1 = (int) (cx + 0.8f * radius * Math.sin(i * 2 * 3.14159f / 12));
y1 = (int) (cy - 0.8f * radius * Math.cos(i * 2 * 3.14159f / 12));
}
og.drawLine(x1, y1, x2, y2);
og.setColor(new Color(230, 230, 230));
og.drawLine(x1 - 1, y1 - 1, x2 - 1, y2 - 1);
}
og.setColor(new Color(20, 20, 20));
x2 = (int) (cx + lenH * Math.sin((timeH + timeM / 60.0f + timeS / 3600.0f)
* 2 * 3.14159f / 12));
y2 = (int) (cy - lenH * Math.cos((timeH + timeM / 60.0f + timeS / 3600.0f)
* 2 * 3.14159f / 12));
og.drawLine(cx, cy, x2, y2);
og.setColor(Color.red);
og.drawLine(cx - 1, cy - 1, x2 - 1, y2 - 1);
og.setColor(new Color(20, 20, 20));
x2 = (int) (cx + lenM * Math.sin((timeM + timeS / 60.0f) * 2 * 3.14159f
/ 60));
y2 = (int) (cy - lenM * Math.cos((timeM + timeS / 60.0f) * 2 * 3.14159f
/ 60));
og.drawLine(cx, cy, x2, y2);
og.setColor(Color.green);
og.drawLine(cx - 1, cy - 1, x2 - 1, y2 - 1);
og.setColor(new Color(20, 20, 20));
x2 = (int) (cx + lenS * Math.sin(timeS * 2 * 3.14159f / 60));
y2 = (int) (cy - lenS * Math.cos(timeS * 2 * 3.14159f / 60));
og.drawLine(cx, cy, x2, y2);
og.setColor(Color.blue);
og.drawLine(cx - 1, cy - 1, x2 - 1, y2 - 1);
og.setColor(new Color(20, 20, 20));
og.drawOval((width - 2 * radius) / 2, (height - 2 * radius) / 2,
2 * radius, 2 * radius);
og.setColor(new Color(230, 230, 230));
og.drawOval((width - 2 * radius) / 2 - 1, (height - 2 * radius) / 2 - 1,
2 * radius, 2 * radius);
g.drawImage(oi, 0, 0, this);
}
}
This uses awt which is old and it paints on to the main Frame - not the best way to make a swing UI. You can try this :
make the timer - sleep amount to less or more, try 300 or 800
use a Panel to draw on, add the panel to the frame
use swing (use a JComponent, it double buffers automatically, and a JFrame
For 2 and 3 you can keep original class to make Frame/JFrame and a new class for the java.awt.Panel or javax.swing.JComponent which is added to the former.
Does not flicker on my mac system, so i think its an OS + times its refreshed issue. Meaning suggestion 1 might work - try that first. Talking about line of code :
Thread.sleep(800);
Believe it or not, the problem was solved by adding the function:
public void update(Graphics g)
{
paint(g);
}
But the question remains, why? And why aren't the hands displayed when you initiate the class fields outside the addNotify() function?

Categories

Resources