Realizing Animation without Flickering Using Java

Background

Years ago, during my studies, a friend of mine told me that he was programming a "Life" -simulation with "bacteria" moving in a window eating "algae" which "grow" as well in that window. The moving around consumes energy, while "eating the algae" gives back energy and if an "bacterium" has collected enough energy, it splits into two individuals.

I was very fascinated by his idea and wanted to create my own life simulation. I tried a couple of times with a couple of tools, but - being a unexperienced programmer at this time - never succeeded.

However, recently I had the wish to learn Java, as I collected some experience with C#, and wanted to switch to a more platform-independent programming language.

Output

Here is a little movie of the outcome of my attempts, the not-so fluent animation is a result of swapping due to low memory:

During development I experienced some challenges which I finally managed and which I want to share with you.

Environment

Hardware: MacBook5,1 with Intel Core 2 Duo processor and 2 GB RAM

Operating system: Mac OSX 10.7.5

IDE: Eclipse Kepler Service Release 1

UI Framework: WindowBuilder Pro (providing Swing & SWT)

JVM: 1.5 (Mac OX Default)

Challenges

Flickering

The first thing I stumbled over was the phenomenon of the "flickering" screen. This means that the animation does not run fluently, but creates occasional errors which switches the output window to white so the screen flickers. This phenomenon is a quite common one judged by the large number of discussion in the web. Finally I found a discussion which helped me. The solution of the flickering-problem involves creating a Buffer-Image which is posted to the screen instead of posting the graphics-object ("sprites") individually and a specific override-implementation of the "paint()" method.

Main Program

    public static void main(String[] args) {
        createAndShowGUI();
    }

Method createAndShowGUI()

    public static void createAndShowGUI() {
        JFrame mainFrame = new JFrame();
        mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        PixiesUI animationPanel = new PixiesUI();
        mainFrame.getContentPane().add(animationPanel);
        mainFrame.pack();
        mainFrame.setVisible(true);
        animationPanel.runAnimation();
    }

Method runAnimation() 

public void runAnimation() { [...]
  while (elapsedTime < animDuration) {
  //Create algae
  //Move Bacteriae
  try {
    Thread.sleep(30);
  }
  catch (Exception e) {
  }
  paint(this.getGraphics()); <-- This is important! pass the Graphics object of panel to paint()
  }
}

Override Method paint(Graphics g)

    @Override
    public void paint(Graphics g) {
 
      Dimension theDim = getSize();
      BufferedImage theBuffImg = new BufferedImage(5, 5, BufferedImage.TYPE_INT_RGB); <-- Bufferimage for fluent animation
      theBuffImg = (BufferedImage) createImage(theDim.width,theDim.height);
      Graphics2D theBuffImgGraphics = theBuffImg.createGraphics();
      theBuffImgGraphics.setPaint(Color.BLACK);
      Rectangle rect = new Rectangle(0, 0, theDim.width,theDim.height);
      theBuffImgGraphics.fill(rect);
      [... do more paint stuff here ...]
        g.drawImage(theBuffImg, 0, 0, this); <-- Finally paint image on JPanel
    }

 Object Housekeeping with ArrayLists

Another (common) problem is to savely add or remove objects from arrays holding all the objects in the application during loops. In essence there a two approaches, one involving the original list and a buffer list, another involving the use of an iterator.

Buffer List Approach

Here I created entries in a buffer list by loop in over the original list using an iterator. The removal of objects of the original list is driven by the buffer list (I call the "algae" "Pixie" ;)):

         ArrayList<CPixie> pixieList;
         ArrayList<CPixie> pixieBuffer;
         Iterator<CPixie> pixieIterator = pixieList.iterator();
         while (pixieIterator.hasNext()){
         CPixie thePixie = pixieIterator.next();
            if (thePixie.getEnergy() > 1500){
            CPixie newPixie = new CPixie(thePixie.getXPos() + 5, thePixie.getYPos() + 5);
            pixieBuffer.add(newPixie);
            thePixie.reduceEnergy(900);
            }
            }

 

            for (CPixie newPixie : pixieBuffer){
            addNewPixie(newPixie.getXPos(),newPixie.getYPos());
         }

Iterator Approach

ArrayList<CFood> foodItems; 

Iterator<CFood> foodIterator = foodItems.iterator();
while(foodIterator.hasNext()){
CFood foodItem = foodIterator.next();
if (foodItem.getEaten()) foodIterator.remove();
}

I hope that helps with you own project. To be complete I post the complete code of my project below.

All Code

Class PixieUI

import java.awt.Color;

import java.awt.Dimension;

import java.awt.Graphics;

import java.awt.Graphics2D;

import java.awt.Rectangle;

import java.awt.image.BufferedImage;

import javax.swing.JFrame;

import javax.swing.JPanel;

public class PixiesUI extends JPanel {

private static final long serialVersionUID = 1L;

//int ovalX = 50;

    long animDuration = 5000;

    long currentTime = System.nanoTime() / 1000000;

    long startTime = currentTime;

    long elapsedTime = currentTime - startTime;

    private CFoodList _foodItems;

    private CPixieList _pixieList;

    public PixiesUI() {

        setPreferredSize(new Dimension(500, 500));

        setDoubleBuffered(true);

    }

    public void runAnimation() {

    _foodItems = new CFoodList();

    _pixieList = new CPixieList();

    CPixieList _newPixieBuffer = new CPixieList();

    //Create the first Pixie

    Dimension theDim = getSize();

    _pixieList.addNewPixie(theDim.width / 2,theDim.height / 2);

        while (elapsedTime < animDuration) {

        //Remove all items from last pass

        _newPixieBuffer.pixieList.clear();

            elapsedTime = currentTime - startTime;

            //create new random food

    theDim = getSize();

            _foodItems.addNewFood(theDim.width,theDim.height);

            _foodItems.addNewFood(theDim.width,theDim.height);

            _foodItems.addNewFood(theDim.width,theDim.height);

           

            _pixieList.movePixies(theDim.width, theDim.height);

           

            try {

                Thread.sleep(30);

            }

            catch (Exception e) {

            }

           

            paint(this.getGraphics());

        }

    }

    @Override

    public void paint(Graphics g) {

   

    Dimension theDim = getSize();

    BufferedImage theBuffImg = new BufferedImage(5, 5, BufferedImage.TYPE_INT_RGB);

    theBuffImg = (BufferedImage) createImage(theDim.width,theDim.height);

    Graphics2D theBuffImgGraphics = theBuffImg.createGraphics();

    theBuffImgGraphics.setPaint(Color.BLACK);

    Rectangle rect = new Rectangle(0, 0, theDim.width,theDim.height);

    theBuffImgGraphics.fill(rect);

           

        for (CPixie thePixie : _pixieList.pixieList){

        for (CFood foodItem : _foodItems.foodItems){

        if (foodItem.getFoodSprite().contains(thePixie.getXPos(),thePixie.getYPos())){

        thePixie.feedPixie();

        _foodItems.foodItems.remove(foodItem);

        break;

        }

        }

       

        theBuffImgGraphics.setPaint(Color.RED);

        theBuffImgGraphics.fill(thePixie.getPixieSprite());

        }

       

        for (CFood theFoodItem : _foodItems.foodItems){

        theBuffImgGraphics.setPaint(Color.GREEN);

        theBuffImgGraphics.fill(theFoodItem.getFoodSprite());

        }

       

        theBuffImgGraphics.setPaint(Color.BLACK);

        rect = new Rectangle(8, 8, 50, 16);

        theBuffImgGraphics.fill(rect);

       

        theBuffImgGraphics.setPaint(Color.BLACK);

        rect = new Rectangle(60, 8, 50, 16);

        theBuffImgGraphics.fill(rect);

       

        theBuffImgGraphics.setPaint(Color.GREEN);

        int foodNumber = _foodItems.foodItems.size();

        String foodNumberStr = String.valueOf(foodNumber);

        theBuffImgGraphics.drawString(foodNumberStr,10,23);

       

        theBuffImgGraphics.setPaint(Color.RED);

        int pixieNumber = _pixieList.pixieList.size();

        String pixieNumberStr = String.valueOf(pixieNumber);

        theBuffImgGraphics.drawString(pixieNumberStr,62,23);

       

        g.drawImage(theBuffImg, 0, 0, this);

    }

    public static void main(String[] args) {

        createAndShowGUI();

    }

    public static void createAndShowGUI() {

        JFrame mainFrame = new JFrame();

        mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        PixiesUI animationPanel = new PixiesUI();

        mainFrame.getContentPane().add(animationPanel);

        mainFrame.pack();

        mainFrame.setVisible(true);

        //I made the call to runAnimation here now

        //after the containing frame is visible.

        animationPanel.runAnimation();

    }

}

Class CFood

import java.util.Random;

import java.awt.geom.*;

public class CFood {

protected int _xPos;

protected int _yPos;

protected int _radius = 7;

protected boolean _eaten = false;

protected Ellipse2D.Double _foodSprite;

//Constructor *******************************

public CFood(int winXSize, int winYSize)

{

//Set Position of food

setXPos(winXSize);

setYPos(winYSize);

setFoodSprite();

}

private void setFoodSprite(){

_foodSprite = new Ellipse2D.Double(getXPos(),getYPos(),getRadius(),getRadius());

}

public Ellipse2D.Double getFoodSprite(){

return _foodSprite;

}

private void setXPos(int winXSize)

{ 

Random seedGen = new Random();

Random theRandomGenerator = new Random(seedGen.nextInt(1234567));

_xPos = theRandomGenerator.nextInt( winXSize );

}

private void setYPos(int winYSize)

{ 

Random seedGen = new Random();

Random theRandomGenerator = new Random(seedGen.nextInt(1234567));

_yPos = theRandomGenerator.nextInt( winYSize );

}

public void setEaten(){

_eaten = true;

}

public boolean getEaten(){

return _eaten;

}

//*******************************************

//Position Getters **************************

public int getXPos()

{

return _xPos;

}

public int getYPos()

{

return _yPos;

}

public int getRadius()

{

return _radius;

}

//*******************************************

}

Class CFoodList

import java.util.ArrayList;

import java.util.Iterator;

public class CFoodList {

ArrayList<CFood> foodItems;

public CFoodList()

{

super();

foodItems = new ArrayList<CFood>();

}

public void addNewFood(int winXSize, int winYSize)

{

CFood foodItem = new CFood(winXSize, winYSize);

foodItems.add(foodItem);

}

public void removeEatenFoodItems(){

Iterator<CFood> foodIterator = foodItems.iterator();

while(foodIterator.hasNext()){

CFood foodItem = foodIterator.next();

if (foodItem.getEaten()) foodIterator.remove();

}

}

public void removeEatenFoodItem(CFood eatenFoodItem){

foodItems.remove(eatenFoodItem);

}

}

Class CPixie

import java.util.Random;

import java.lang.Math;

import java.awt.geom.*;

public class CPixie {

protected int _xPos;

protected int _yPos;

protected int _Energy;

protected int _radius = 7;

protected int _stepWidth;

protected Ellipse2D.Double _pixieSprite;

public CPixie(int xPos, int yPos) {

setXPos(xPos);

setYPos(yPos);

setEnergy(1000);

setPixieSprite();

Random ranGen = new Random();

_stepWidth = 1 + ranGen.nextInt(10);

}

private void setPixieSprite(){

_pixieSprite = new Ellipse2D.Double(getXPos(),getYPos(),getRadius(),getRadius());

}

public Ellipse2D.Double getPixieSprite(){

return _pixieSprite;

}

private void setXPos(int xPos){

_xPos = xPos;

}

private void setYPos(int yPos){

_yPos = yPos;

}

private void setEnergy(int theEnergy){

_Energy = theEnergy;

}

public int getEnergy(){

return _Energy;

}

public int getXPos(){

return _xPos;

}

public int getYPos(){

return _yPos;

}

public int getRadius(){

return _radius;

}

public void movePixie(int winWidth, int winHeight){

Random theRandomGen = new Random();

int xStep = theRandomGen.nextInt(_stepWidth) * (int) Math.pow(-1.0,(double)theRandomGen.nextInt(2));

if (!checkHorizInsidePanel(xStep,winWidth)) xStep = xStep * -1;

setXPos(getXPos() + xStep);

int yStep = theRandomGen.nextInt(_stepWidth) * (int) Math.pow(-1.0,(double)theRandomGen.nextInt(2));

if (!checkVerticalInsidePanel(yStep,winHeight)) yStep = yStep * -1;

setYPos(getYPos() + yStep);

setPixieSprite();

reduceEnergy();

}

public void feedPixie(){

setEnergy(getEnergy() + 450);

}

private boolean checkHorizInsidePanel(int xStep, int winWidth){

boolean insidePanel = false;

if (winWidth > getXPos() + xStep && getXPos() + xStep > 0) insidePanel = true;

return insidePanel;

}

private boolean checkVerticalInsidePanel(int yStep, int winHeight){

boolean insidePanel = false;

if (winHeight > getYPos() + yStep && getYPos() + yStep > 0) insidePanel = true;

return insidePanel;

}

public void reduceEnergy(int amount){

setEnergy(getEnergy() - amount);

}

private void reduceEnergy(){

setEnergy(getEnergy() - _stepWidth);

}

}

Class CPixieList

import java.util.ArrayList;

import java.util.Iterator;

public class CPixieList {

ArrayList<CPixie> pixieList;

ArrayList<CPixie> pixieBuffer;

public CPixieList()

{

super();

pixieList = new ArrayList<CPixie>();

pixieBuffer = new ArrayList<CPixie>();

}

public void movePixies(int winWidth, int winHeight){

pixieBuffer.clear();

        if (pixieList.size() > 0){

            for(CPixie thePixie : pixieList){

            thePixie.movePixie(winWidth, winHeight);

            }

        }

        

        //Clean Pixie list from dead pixies

        removeDeadPixies();

        

        //Create new Pixies if energy is high enough

        if (pixieList.size() > 0){

            //for(CPixie thePixie : _pixieList.pixieList){

        Iterator<CPixie> pixieIterator = pixieList.iterator();

        while (pixieIterator.hasNext()){

        CPixie thePixie = pixieIterator.next();

            if (thePixie.getEnergy() > 1500){

            CPixie newPixie = new CPixie(thePixie.getXPos() + 5, thePixie.getYPos() + 5);

            pixieBuffer.add(newPixie);

            thePixie.reduceEnergy(900);

            }

            }

            for (CPixie newPixie : pixieBuffer){

            addNewPixie(newPixie.getXPos(),newPixie.getYPos());

            }

        }

}

public void giveBirthToPixie(int xStartPos, int yStartPos, CPixie thePixie){

addNewPixie(xStartPos, yStartPos);

thePixie.reduceEnergy(900);

}

public void addNewPixie(int xStartPos, int yStartPos)

{

CPixie thePixie = new CPixie(xStartPos, yStartPos);

pixieList.add(thePixie);

}

public void removeDeadPixies(){

Iterator<CPixie> theIterator = pixieList.iterator();

ArrayList<CPixie> bufferList = new ArrayList<CPixie>();

while (theIterator.hasNext()){

CPixie thePixie = theIterator.next();

if (thePixie.getEnergy() <= 0){

theIterator.remove();

bufferList.add(thePixie);

}

}

for (CPixie deadPixie : bufferList){

pixieList.remove(deadPixie);

}

}

}

SQL - Calling Stored Procedure with Comma Separated List in Input Parameter

Background

Currently I am programming on an ASP.NET web application with a data connection to a MS SQL Server 2008 R2 database. I am fetching data always via stored procedures. Today I came across the problem that I wanted to program a procedure where I have to do a SELECT with a WHERE column IN (...) with an unknown number of arguments in the IN statement.
Hence I was looking for a way to transfer a comma separated list as string parameter into the WHERE IN argument.

First Try

The straight forward approach I tried looked like this:

CREATE PROCEDURE [dbo].[MyProcedure]
@inputList nvarchar(MAX) <- comma separated list of values (string)
AS
BEGIN
      SELECT * FROM myTable
      WHERE
      colName IN (@idList)
END
GO

Unfortunately, this approach does not work. You can inject a list with on list element which will return some reasonable result, but as soon as you call this with list with more than one argument, this fails, as the argument is not interpreted as WHERE IN ('arg1','arg2') but as WHERE IN ('arg1,arg2').

Solution

After some research I stumbled over a Code Project thread which was the key to solve the problem. To have a more ready-to-use description I wrote this blog. With the help of the above thread I wrote the following stored procedure:

CREATE PROCEDURE [dbo].[myWorkingProcedure]
@inputList nvarchar(MAX)
AS
DECLARE @SEPERATOR as VARCHAR(1)
DECLARE @SetPoint INT
DECLARE @VALUE nvarchar(50)
CREATE TABLE #tempTab (id nvarchar(50) not null)
BEGIN
SET NOCOUNT ON;
WHILE PATINDEX('%,%',@idList) > 0 <-- Drive loop while commata exist in the input string
BEGIN
SELECT  @SP = PATINDEX('%,%',@idList) <-- Determine position of next comma
SELECT  @VALUE = LEFT(@idList , @SP - 1) <-- copy everything from the left into buffer
SELECT  @idList = STUFF(@idList, 1, @SP, '') <-- throw away the stuff you copied
INSERT INTO #tempTab (id) VALUES (@VALUE) <-- put value in buffer table
END
INSERT INTO #tempTab (id) VALUES (@idList) <-- insert last value in the input list to buffer
BEGIN
SELECT * FROM myTable
WHERE
myColumn IN (SELECT id FROM #tempTab) <-- Do the select
DROP TABLE #tempTab <-- throw buffer table away
END
END
GO

Conclusion

With the help of the above code it is possible to perform dynamic SELECT WHERE IN statements with an unknown number of arguments. I hope this post helps you to overcome your own problems with transactional SQL


all the best
WolfiG

Prinzessinnen-Bett im Selbstbau mit Bauplan

Liebe Leser,

unsere Töchter entwachsen langsam ihren Babybettchen / Gitterbettchen. Vor allem die Große ist inzwischen mit 3 1/2 Jahren und 104 cm so groß, dass sie in mittelfristiger Zeit ein neues Bett braucht. Sie träumt von einem Prinzessinnenbett, natürlich am liebsten als Hochbett. Die Kleine ist 20 Monate alt, insofern kommt für sie im Moment kein Hochbett in Frage.
Weiterhin möchten wir die beiden Kinder für die nächsten Jahre in einem gemeinsamen Schlafzimmer unterbringen. Wir können also momentan kein Hochbett für die Große anschaffen, da beide Kinder im gleichen Zimmer herumtollen werden. Was wir aber gerne hätten, wäre ein Bett, das "mitwächst", also das sich umbauen lässt. Da Bett sollte für unsere Große als Prinzessinnen-Bett ("normal") begonnen werden und dann so aufgebaut sein, dass es durch Module erweiterbar ist, idealerweise in ein paar Jahren zum Hochbett.
Weitere Anforderungen / Spezifikationen des zu bauenden Betts:

• Standardmaß für Lattenrost und Matratze (90 x 200 cm)
• Unter dem Bett sollten große Schubladen Platz haben um Bettwäsche dort unterzubringen
• Kompatibilität mit den Maßen eines Bettes von einem beliebten Kinderbettherstellers (L x B: 201,4 x 97,9) um das Zubehör dazu nutzen zu können. Ich habe allerdings eine größere Höhe gewählt, als das Bett von P.... um mehr Platz für einen großen Bettkasten zu schaffen.

Für die Erstellung der technischen Zeichnungen verwende ich LibreCAD, CorelCAD 2014 und für die der 3D-Darstellungen Blender

Der "Standard"-Rahmen

Um ein Bettsystem modular aufzubauen, brauchen wir einen Rahmen, der einen "Standard" darstellt, und auf Basis dessen das Bettsystem aufgebaut wird. Wie oben beschrieben, möchte ich den Rahmen auf Standard-Lattenrost- und Matratzenmaßen aufbauen. Ich habe im Moment die folgenden, im Internet erhältlichen Produkte als Arbeitshypothese ausgewählt:

• Lattenrost "Sirius" von Breckle, erhältlich bei Home24, eine Alternative ist ein Lattenrost von IKEA 
• passende Matratze ebenfalls bei Home24

Bettgestell im Eigenbau

Als Ausgangsmaterial habe ich im Baumarkt erhältliche Vierkant-Hölzer aus Kiefer (54 x 54 mm) verwendet. Es hat sich allerdings aber beim Bau herausgestellt, dass ein anderes Holz besser gewesen wäre, ich denke, Buche vom Schreiner wäre besser gewesen. Hier die Materialliste:

• 7 Vierkant-Hölzer 54 x 54 mm x 3 m
• 2 Vierkanthölzer 20 x 20 mm x 2m
• 3 Vierkanthölzer 10 x 10 mm x 2 m
• 2 Spanplatten 90 x 45 x 8 mm
• Holzleim
• 4 x Möbelverbinder mit Schrauben der Länge 80 mm
• Rundholz, Durchmesser 25 mm, Länge 1 m
• Riffelstange, Durchmesser 12 mm, Länge 1 m

Das Material hat ungefähr 120.- € gekostet.
Weiterhin standen mit als Werkzeug folgendes zur Verfügung:

• Stichsäge
• Bohrmaschine
• Bohrer der Durchmesser 6, 7, 12, 25 mm
• Schraubzwingen
• Exzenterschleifer

Zusammengebaut sieht mein Gestell so aus:

Das ganze nochmal als Explosionszeichnung:

Im Original sieht das ganze zusammengebaut so aus:

Verbindung der Einzelteile

Mein Ziel beim Bettbau war es, die Teile so wenig wie möglich zu verschrauben, und gleichzeitig eine größtmögliche Stabilität zu erreichen. Da ich keine Oberfräse zum anfertigen von Schwalbenschwänzen habe (und auch ein zu unruhiges Händchen um das mit der Säge zu machen), entschied ich mich dazu, die Rahmenhölzer mittels "geradem Eckblatt" zu verbinden. Die beiden Hölzer werden dabei verklebt und zusätzlich durch einen durchgebohrten 12 mm Holzdübel (aus Riffelholz) verbunden.
Die Rahmenteile sehen im Original so aus:

Um die Längsschenkel zu befestigen, wollte ich es vermeiden, die Teile zu verkleben, um das Bett gut wieder verlegen zu können. Dazu habe ich eine Verzapfung mittels 25 mm Rundhölzern gewählt. Um die den Lattenrost tragenden Schenkel zu befestigen, sichere ich die verzapften Teile noch mit Möbelverbindern, für die die Rundhölzer mit einem 6-7 mm Loch entlang der Zapfen-Längsachse versehen werden.

Mai 2014 Update: So Sieht's aus

So, jetzt ist mein Werk bis auf einen zweiten Anstrich fertig. Ich habe noch eine Baldachin-Konstruktion auf Kanthölzern 54x54mm dazugebaut, damit ein Baladachin von PAIDI über dem Bett angebracht werden kann. In diesem Stadium bin ich ganz zufrieden:

Einmal ohne Baldachin, um die Unterkonstruktion zu zeigen

Einmal mit Baldachin und Bettzeug