Flash You Man

Filed Under (animation, flash) by Nathan Schwermann on 26-04-2009

Tagged Under : , , , , , , , ,

Well, I am certainly excited to post this video to share with everyone. This is my very first flash animation and I even surprised myself with how well it came out. I did run into a few issues with the sound not syncing up perfectly, especially when doing the speech glow effect on the Heaven and Rhea characters. It seems the filters I used slowed down the frame rate causing the sound to go off sync. But enough with the technical talk this time.

I chose the title Why Hamsters Eat Their Babies and How Zeus Was Born to help set the mood and tone of the video. It seems to work because everyone who I have showed this too in person got a smile on their face when they read the title screen. I like the perspective view when reading about myths and I love when they try to explain something that we, or the Ancient Greeks, don’t understand. Which is why I decided to make Cronos a hamster instead of an image of the sky. Well I suppose a hamster is a little more interesting, but I am happy with my decision to keep Rhea an actual floating planet earth.

Now, the idea of making Cronos eat his children and for Rhea to feed him a rock instead of Zeus all came from The Theogony of Hesiod I just can’t make this stuff up. I’m giving thought of bringing some of my other favorite myths to life as well in the future. Feel free to post a comment with suggestions!

I also have to give a thanks to CartoonSmart for their great free tutorials on drawing and animation in flash. I couldn’t have done it without them! Thanks again for watching!

Don't mess with the Zeus

text wrapping with JavaME

Filed Under (java, programming) by Nathan Schwermann on 09-04-2009

Tagged Under : , , ,

Recently I had the pleasure of remaking Hunt the Wumpus using JavaME for a school project. I didn’t think I would run into any big challenges since it is just a text-based adventure game but never-the-less I was excited to program for mobile phones. It didn’t take long before I learned the hard way that text doesn’t automatically wrap around the screen when you draw it. Being that text is the most important part of a text-based game I had to come up with a way to dynamically wrap text around the screen.

A quick Google search for ‘text wrap midp’ and I found a nice article explaining how to do it. I found it was a good starting point, but the example did have some issues. For one, the algorithm they shared didn’t take into account whether or not it started writing on the next line in the middle of a word. Second, their code had a bug in it which would stack the first few characters on top of each other when you went to a new line.

Another issue I had to think about was if the screen was small enough the text would draw right on top of my picture for the current room. So I decided to implement a simple text box for all of my dialog to help the readability. I think that ultimately it turned out looking pretty good.

Lets get down to how it was done. I made a function that took the MIDP graphics reference, a string, and a Y value for where to draw it on the screen. Drawing the box turned out to be fairly easy, MIDP did most of the work for me, other than that I just tweaked the hard coded values till I thought it looked good.

public void drawDialog(Graphics g, String text, int Y){

  int outerX, innerX , arcValue, Boxwidth, Boxheight, outerY;
  outerX = 10; //arbitary
  innerX = 12;
  arcValue = 5;
  Boxwidth = curCanvas.getWidth() - 20;
  Boxheight = (g.getFont().stringWidth(text) / Boxwidth ) * g.getFont().getHeight() + g.getFont().getHeight();
  outerY = Y - Boxheight - 10;

  g.setColor(243, 234, 172);
  g.fillRoundRect(outerX, outerY, Boxwidth, Boxheight, arcValue, arcValue);
  g.setColor(135, 53, 53);
  g.fillRoundRect(innerX, outerY + (innerX - outerX), Boxwidth - (innerX - outerX)*2, Boxheight  - (innerX - outerX)*2, arcValue, arcValue);
  g.setColor(255, 255, 255);

Next I decided to use the StringTokenizer class to break my string up into words and use the string length to determine if it is time to draw on the next line yet, instead of characters like the article I found.

  Font font = g.getFont();
  int fontHeight = font.getHeight();
  int idx = 0;
  int width = Boxwidth;
  int lineWidth = 0;
  int wordWidth = 0;
  int y = outerY ;
  int x = innerX + 1;
  String curString;
  String words[] = new String[500];
  StringTokenizer st = new StringTokenizer(text, ' ');
  while(st.hasMoreChars()){ //break text into words
  words[idx]=st.nextToken();
  idx++;
}

for(int stct = 0; stct < idx; stct++){
  curString = words[stct];
  //measure the word to draw
  wordWidth = font.stringWidth(curString);
  lineWidth += wordWidth;
  //see if new line is needed
  if(lineWidth >= width){
    y += fontHeight;
    lineWidth = wordWidth;
    x = innerX + 1;
  }
  g.drawString(curString, x, y, Graphics.TOP | Graphics.LEFT);
  x =  lineWidth + innerX + 1;
}

This worked great, however since I am new to programming in JavaME and Java all together. I didn’t realize that you can’t use generics in JavaME, I’m not sure why NetBeans let it slide, it ran fine in the emulator, but I ran into troubles trying to deploy it to a real cell phone. In fact I couldn’t even compile my project on the Sprint SDK because of including the StringTokenizer class. So ultimately I went back to using individual characters, and I thought of a real easy way to see if I should be drawing on the next line. The only catch is I had to be mindful not to use any words larger than 10 characters, because that was the arbitrary value I chose to check for a new line. At any rate I wish I would have thought of it in the first place because it would have saved me a lot of work.

Font font = g.getFont();
int fontHeight = font.getHeight();
//change string to char data
char[] data = new char1;
text.getChars(0, text.length(), data, 0);
int width = Boxwidth;
int lineWidth = 0;
int charWidth = 0;
int y = outerY;
int x = innerX + 1;
char ch;
for(int ccnt=0; ccnt < data.length; ccnt++){
  ch = data[ccnt];
  //measure the char to draw
  charWidth = font.charWidth(ch);
  lineWidth = lineWidth + charWidth;
  //see if a new line is needed
  if (lineWidth >= (width - 10) && ch == ' '){
    y = y + fontHeight;
    lineWidth = charWidth;
    x = innerX + 1;
  }
//draw the char
  g.drawChar(ch, x, y,
  Graphics.TOP |Graphics.LEFT);
  x = lineWidth + innerX + 1;
}

All in all it was a good learning experience and I’m happy to share it with all of you. Thanks for reading.

Hello world!

Filed Under (About Me) by Nathan Schwermann on 03-04-2009

Well my search for a suitable host to deploy a game I made for JavaME enabled devices ultimately led to my buying my own server and namespace. I figured it would be a nice place to host my portfolio and resume, and I figured I might as well make a blog as well. Web design has gotten so much more complicated since the last time I made a web page back in 1998. I have no idea about all this CSS and PHP stuff, looks like I have a lot to learn. Luckily my school is offering a free PHP boot camp lesson in 2 weeks. Well I hope you subscribe to my feed I’ll try to write about lots of interesting stuff. In the mean time if you have a JavaME enabled phone (thats pretty much any phone besides iphone, g1, and blackberry) I invite you to try and install my game. Some providers wont let you install games this way, but what you do is goto this site on your phone and then click the download link.