Monday, August 11, 2008

Rolling Your Own 2

I’m making good progress making my own graphics library that will display the user interface. I can show multiple cards and move them. I feel like I am just creating what has been done hundreds of times since videogames were invented, but that’s ok. But that is the problem is writing your own code or “rolling your own.”

I’m still using Java of course. And I am just writing a little bit of code on top of the existing Java interface. The part of Java that creates user interfaces is called “Swing”, I don’t know why they named it that. So all I have to do is to generate the card picture and let Swing do all of the hard work of actually drawing it on the screen.

Each card is considered to be a sprite and when you click on a card, you are moving a sprite. All of the sprites are held in a “Sprite List” which is similar to an array. When the user click on a card, the xy coordinates are given to the sprite list and if a card is in that area, the user will be able to move that card. Everything is all pretty simple and straightforward so far.

For the mana pool on the left side of the screen, I may cheat and try to let Swing do all the work. It has a label class that can show a picture and some text, which would let me easily create the mana pool.


Unknown said...

In VB, we would create a PictureBox control array. Every control in VB has various event handlers built-in. These event handlers are sub routines that get called when their specific action occurs. For example, most controls have five distinct types of events related to mouse input - Click, DoubleClick, MouseDown, MouseMove and MouseUp. Each event carries with it properties of the mouse state, such as which button - left, middle or right, and even if Shift, Ctrl or Alt is pressed. Which means that responding to these sorts of things is simple, without having to make additional function calls to seek this information or explicit handlers for each combination.

Moving the PictureBox representing a card, would be a matter of responding to MouseDown, tracking the MouseMove, adjusting the XY coordinates and then stopping upon MouseUp. Responding to the MouseClick event would be of use when looking for target selection, or MouseClick(Right Button) for a context menu, or MouseClick(Shift Key) for tapping.....

I used an external DLL to perform the image transformations for size and rotation. It had a single function call, taking the picture handle of the PictureBox, and all the coordinates of the destination size and angles. It then magically modified the picture data that the handle referenced, so all I had to do was change the picture box size properties to match the new shape (a tapped card).

Having looked at the swing portion of Forge, and the GUI stuff using JBuilder, I don't get the impression that it's as easy as VB, even though it looks like it should be.

Anonymous said...

Hey Forge,

If you want some nice mana symbols, you can use the ones i made in illustrator:

Silly Freak said...

for me it's fairly easy. swing - and awt, on which swing is built - has very handy features.

to draw a transformed image, you basically make a subclass of JComponent and overwrite paintComponent, which is automatically called with an appropriate Graphics object. for the most transformations, you have to cast it to Graphics2D. with translate, scale, rotate and shear, you can get any style you want, though it's a little tricky to keep the picture in the visible bounds. and then you simply draw the image.
i have an example in one of my early posts in my blog:

event handling is more flexible than VB, since you can add your own listener objects even to components you have no access to, and more than one for different uses.
for example, the detail card component would listen for mouseEntered events on all cards to know when to render a new card, and the playing area would listen on mousePressed, mouseDragged and mouseReleased events to move the component around.

Forge said...

Nantuko is my new hero so I'll probably just use this version of MTG Forge user interface for version 2.