3D Tictactoe GUI

Need help with GUIs

Page 1 of 1

8 Replies - 6705 Views - Last Post: 07 January 2009 - 07:13 PM Rate Topic: -----

#1 robyn9876  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 24-December 08

3D Tictactoe GUI

Post icon  Posted 06 January 2009 - 08:44 AM

I have written a working 3d tic tac toe application that receives user input as an ordered triplet (plane, row, col) to record a move in a 3-dim array board[4][4][4]. I anticipate no problem merging the logic of my application into this applet.

The program plays at three levels. My problem is that I know next to nothing about GUIs and am trying to display a grid of buttons which will be four 4 by 4 grids with some space between each of these 4by4 grids of buttons.
I have some code which produces a much too large grid of 64 buttons arranged in 16 rows and 4 columns. I would like an applet that has this grid (much smaller in the left portion of the applet and allows me to add a textfield and a label and a start button.

I will (shamefully) share my first attempt (I am using Eclipse).

 package tic;
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class ThreeDTic extends JApplet implements ActionListener {
	JButton pick[][][] = new JButton [4][4][4];
	private int i,j,k;
	public void init() {
//Container contentPane = getContentPane();
//contentPane.setLayout(new GridLayout(4,4));
//contentPane.setPreferredSize(new Dimension(40,40));
setLayout( new GridLayout( 16, 4 ) );
setSize(200,200);
for (i=0; i < 4; i++)
	for (j=0; j < 4; j++)
		for (k=0; k <4; k++){
			pick[i][j][k] = new JButton("?");
			pick[i][j][k].addActionListener(this);
			pick[i][j][k].setSize(10, 10);
			pick[i][j][k].setName("" + i +"" +j +"" +k);
			pick[i][j][k].setPreferredSize(new Dimension(10,10)); 
			pick[i][j][k].setMaximumSize(new Dimension(10,10)); 
			pick[i][j][k].setMinimumSize(new Dimension(10,10)); 
			//Rectangle r= new Rectangle(i,j*10,10+i,10+j);
			//pick[i][j][k].setBounds(r);
			//pick[i][j][k].setBorder(null);
			//contentPane.add(pick[i][j][k]);
			add(pick[i][j][k]);
		}
			
}
	
	
	public void actionPerformed(ActionEvent ae) {
	   // what woke me up?
	   JButton thisOne= (JButton)ae.getSource();
	   System.out.println(thisOne.getName());
	}
	}


This post has been edited by robyn9876: 06 January 2009 - 08:57 AM


Is This A Good Question/Topic? 0
  • +

Replies To: 3D Tictactoe GUI

#2 gl3thr0  Icon User is offline

  • D.I.C Regular

Reputation: 19
  • View blog
  • Posts: 319
  • Joined: 27-October 07

Re: 3D Tictactoe GUI

Posted 06 January 2009 - 05:30 PM

.. confused.. a 3D tictactoe game...

draw a pic and upload it?
Was This Post Helpful? 0
  • +
  • -

#3 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1147
  • View blog
  • Posts: 7,134
  • Joined: 07-September 06

Re: 3D Tictactoe GUI

Posted 06 January 2009 - 06:08 PM

Okay, so we are talking an X,Y,Z plane here for the board, are you using all of the available spaces (including the center one: (2,2,2))? Or are you just using the faces that are visible from the outside?

Don't worry about being ashamed of your code, it is always worth an attempt, who knows, you may have had the right idea about it and just made a simple mistake somewhere in implementation.

Hope we can help :)
Was This Post Helpful? 0
  • +
  • -

#4 BigAnt  Icon User is offline

  • May Your Swords Stay Sharp
  • member icon

Reputation: 101
  • View blog
  • Posts: 2,392
  • Joined: 16-August 08

Re: 3D Tictactoe GUI

Posted 06 January 2009 - 06:39 PM

Quote

I have written a working 3d tic tac toe.....
which will be four 4 by 4 grids


Never heard of 3D tic tac toe?
Isn't tic tac toe done on 3*3 grids?
Was This Post Helpful? 0
  • +
  • -

#5 robyn9876  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 24-December 08

Re: 3D Tictactoe GUI

Posted 06 January 2009 - 07:59 PM

View PostBetaWar, on 6 Jan, 2009 - 05:08 PM, said:

Okay, so we are talking an X,Y,Z plane here for the board, are you using all of the available spaces (including the center one: (2,2,2))? Or are you just using the faces that are visible from the outside?

Don't worry about being ashamed of your code, it is always worth an attempt, who knows, you may have had the right idea about it and just made a simple mistake somewhere in implementation.

Hope we can help :)

I am using all the positions (i,j,k) for 0<i,j,k<4. In the version I wrote I ask the user for the plane, row and column and then mark that postion with an X, the computer is O. I displayed a grid of ? as placeholders. Now I would like them to be clickable. That is essentially all.

Thanks
Was This Post Helpful? 0
  • +
  • -

#6 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5800
  • View blog
  • Posts: 12,636
  • Joined: 16-October 07

Re: 3D Tictactoe GUI

Posted 07 January 2009 - 07:08 AM

I love 3D Tic Tac Toe! I'd create four panels with a 2d grid in each. It's much easier to brain.

This amused me enough that I did a mock up of it. Hope it's not giving too much away.

import java.util.*;
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;

// I know you did an applet
// it's easier to just do a panel, test in a form
// then throw it in an applet later
public class ThreeTic extends JPanel implements ActionListener {
	public static final int PANELS = 4;
	
	private SingleBoard [] boards = new SingleBoard[PANELS];
	private char currentPlayer = 'X';  
	
	// want to store some extra data in our button
	// so we can access it later
	class BoardButton extends JButton {
		public int row, col, plane;
		public BoardButton(int row, int col, int plane) {
			this.row = row;
			this.col = col;
			this.plane = plane;
			this.setText("   ");
		}
		public String toString() {
			return "(" + row + "," + col + "," + plane + ") = " + this.getText();
		}
	}
	
	// A panel for rows and cols
	class SingleBoard extends JPanel {
		public static final int ROWS = 4;
		public static final int COLS = 4;
		
		// I hate 2d arrays
		private BoardButton [] items = new BoardButton[ROWS*COLS];  
		
		public SingleBoard(int plane, ActionListener listener) {
			setLayout( new GridLayout( ROWS, COLS ) );
			for (int row=0; row<ROWS; row++) {
				for (int col=0; col<COLS; col++) {
					BoardButton b = new BoardButton(row, col, plane);
					b.addActionListener(listener);
					add(b );
					items[row*COLS+col] = b;
				}
			}
		}
		
		// at this level, allow a button value to be changed
		// given a row and col
		// see, you never need 2d arrays
		public char getValue(int row, int col) {
			String s = items[row*COLS+col].getText();
			return (s==null || s.length()==0) ? ' ' : s.charAt(0);
		}
		
		public void setValue(int row, int col, char val) {
			items[row*COLS+col].setText(String.valueOf(val));
		}

	}
	
	
	public ThreeTic() {
		// now we just place the boards
		setLayout( new GridLayout( 2, 2, 10, 10 ) );
		for(int panel=0; panel<PANELS; panel++) {
			SingleBoard sb = new SingleBoard(panel, this);
			boards[panel] = sb;
			add(sb);
		}
	}
	
	// we can get and set knowing a panel number
	// the let the panel method do the work
	public char getValue(int row, int col, int plane) {
		return boards[plane].getValue(row, col);
	}

	public void setValue(int row, int col, int plane, char val) {
		boards[plane].setValue(row, col, val);
	}

	
	public void actionPerformed(ActionEvent evt) {
		BoardButton b = (BoardButton)evt.getSource();
		// we could set this directly
		// but we want to validate through setValue
		//b.setText("X");
		setValue(b.row, b.col, b.plane, currentPlayer);
		b.setEnabled(false);
		currentPlayer = (currentPlayer=='X') ? 'O' : 'X';
		System.out.println(b );
	}
	
	
	public static void test() {
		JFrame frm = new JFrame("Layout Test"); 
		frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frm.getContentPane().setLayout(new BorderLayout());
		frm.getContentPane().add(new ThreeTic(), BorderLayout.CENTER);
		frm.pack();
		frm.setVisible(true);
	}
	
}



edit: bloody syntax highlight smilies

This post has been edited by baavgai: 07 January 2009 - 07:09 AM

Was This Post Helpful? 0
  • +
  • -

#7 robyn9876  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 24-December 08

Re: 3D Tictactoe GUI

Posted 07 January 2009 - 07:00 PM

View Postbaavgai, on 7 Jan, 2009 - 06:08 AM, said:

I love 3D Tic Tac Toe! I'd create four panels with a 2d grid in each. It's much easier to brain.

This amused me enough that I did a mock up of it. Hope it's not giving too much away.

import java.util.*;
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;

// I know you did an applet
// it's easier to just do a panel, test in a form
// then throw it in an applet later
public class ThreeTic extends JPanel implements ActionListener {
	public static final int PANELS = 4;
	
	private SingleBoard [] boards = new SingleBoard[PANELS];
	private char currentPlayer = 'X';  
	
	// want to store some extra data in our button
	// so we can access it later
	class BoardButton extends JButton {
		public int row, col, plane;
		public BoardButton(int row, int col, int plane) {
			this.row = row;
			this.col = col;
			this.plane = plane;
			this.setText("   ");
		}
		public String toString() {
			return "(" + row + "," + col + "," + plane + ") = " + this.getText();
		}
	}
	
	// A panel for rows and cols
	class SingleBoard extends JPanel {
		public static final int ROWS = 4;
		public static final int COLS = 4;
		
		// I hate 2d arrays
		private BoardButton [] items = new BoardButton[ROWS*COLS];  
		
		public SingleBoard(int plane, ActionListener listener) {
			setLayout( new GridLayout( ROWS, COLS ) );
			for (int row=0; row<ROWS; row++) {
				for (int col=0; col<COLS; col++) {
					BoardButton b = new BoardButton(row, col, plane);
					b.addActionListener(listener);
					add(b );
					items[row*COLS+col] = b;
				}
			}
		}
		
		// at this level, allow a button value to be changed
		// given a row and col
		// see, you never need 2d arrays
		public char getValue(int row, int col) {
			String s = items[row*COLS+col].getText();
			return (s==null || s.length()==0) ? ' ' : s.charAt(0);
		}
		
		public void setValue(int row, int col, char val) {
			items[row*COLS+col].setText(String.valueOf(val));
		}

	}
	
	
	public ThreeTic() {
		// now we just place the boards
		setLayout( new GridLayout( 2, 2, 10, 10 ) );
		for(int panel=0; panel<PANELS; panel++) {
			SingleBoard sb = new SingleBoard(panel, this);
			boards[panel] = sb;
			add(sb);
		}
	}
	
	// we can get and set knowing a panel number
	// the let the panel method do the work
	public char getValue(int row, int col, int plane) {
		return boards[plane].getValue(row, col);
	}

	public void setValue(int row, int col, int plane, char val) {
		boards[plane].setValue(row, col, val);
	}

	
	public void actionPerformed(ActionEvent evt) {
		BoardButton b = (BoardButton)evt.getSource();
		// we could set this directly
		// but we want to validate through setValue
		//b.setText("X");
		setValue(b.row, b.col, b.plane, currentPlayer);
		b.setEnabled(false);
		currentPlayer = (currentPlayer=='X') ? 'O' : 'X';
		System.out.println(b );
	}
	
	
	public static void test() {
		JFrame frm = new JFrame("Layout Test"); 
		frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frm.getContentPane().setLayout(new BorderLayout());
		frm.getContentPane().add(new ThreeTic(), BorderLayout.CENTER);
		frm.pack();
		frm.setVisible(true);
	}
	
}



edit: bloody syntax highlight smilies


I just got a chance to look over what you did. Wow! I didn't expect that much effort. I really appreciate it. I cut and pasted into Eclipse. It was a bloody mess since it came in as one line. After unravelling with a zillion returns, it compiles clean. However, I can't seem to run it.

I tried something simple to testit using your default constructor for the class but nothing happened. I really haven't had a chance to study your coding but it sure looks impressive. I will need to understand better so as to merge it with my 3D tictactoe program logic. In the interim, could you be so kind as to point in the right direction so that I can view the output of your code. I wrote the following test: (I assume that I need to do more).

Thanks again!

package tryit;

public class TestIt {

	/**
	 * @param args
	 */
	public static void main(String[] args) {
	
		ThreeTic t= new ThreeTic();
	}

}


Was This Post Helpful? 0
  • +
  • -

#8 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5800
  • View blog
  • Posts: 12,636
  • Joined: 16-October 07

Re: 3D Tictactoe GUI

Posted 07 January 2009 - 07:08 PM

The simplest way to test it should be:
public class TestIt {
	public static void main(String[] args) {
		ThreeTic.test();
	}
}



The best way to grab the code is to hit reply on message you want. You'll then have some nice plain text you can copy and paste without worry.
Was This Post Helpful? 0
  • +
  • -

#9 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1147
  • View blog
  • Posts: 7,134
  • Joined: 07-September 06

Re: 3D Tictactoe GUI

Posted 07 January 2009 - 07:13 PM

Eclipse also has a nice function that will auto stylize your code for you (so you don't have to worry about getting everything broken up correctly). What makes it even better is that you can set how ti does the stylizing!

Here is how to use it:
Source -> Format
OR:
Ctrl+Shift+F

Just my quick tip :)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1