140 likes | 155 Views
Learn how to create a find-a-word puzzle game in Java using JPanels, layout managers, strings, events, colors, fonts, arrays, and subclasses. Choose random words from a list, place them in a grid, and challenge players to find them. Reset the grid to start over.
E N D
Create a Find a Word Puzzle in Java By Keith Lynn Field Trip #26
JPanel • A JPanel is a lightweight container that can be placed inside of other containers • It can have its own layout • For this app, we will make the layout of a JPanel a grid
JApplet • A JApplet is a top-level container in Java • We will use the JApplet to contain two Jpanels • The first JPanel will contain letters • The second JPanel will contain words • In order to load a JApplet, we create an HTML document • The HTML document must contain an applet tag • The applet tag must contain the applet's name, width, and height
LayoutManager • A LayoutManager defines how components will be placed onto a screen • There are built-in layout managers in Java • FlowLayout will put components in a row • GridLayout will put components in a grid • In this app, we will create a Jpanel to hold letters in buttons and put the buttons in a grid
String • A String is a collection of individual characters • We can obtain the character at a certain position in a String with the method charAt(int) • The first character in a String is at position 0 • We can determine the length of the String with the length() method • We can concatenate characters to String with the += operator • We can compare the content of two Strings with the equals or equalsIgnoreCase methods
Character • A character is a single character • There is a special relationship between chars and ints in Java • If you treat a char like an int, it is converted to its ASCII equivalent
Events • Events can be detected and acted on by creating listeners • In this app, we will have three different kind of event listeners • We will attach an ActionListener to a single button that will start the puzzle • For each button in the grid, we will attach both a MouseListener and MouseMotionListener • The MouseListener will be use to determine when we let up on the mouse • The MouseMotionListener will be use to determine when we drag the mouse
Color • In this app, when a word has been found, we will change the background color of the button to red • We will change the text color to white
Fonts • Fonts allows us to change the appearance of text • We will display a list of words the user will find • When a user correctly finds one, the font of the word will be changed to strikethrough
Arrays • Arrays are a collection of elements of the same type • In this app, we will consider what is actually a 2 dimensional array • Java doesn't directly support 2 dimensional arrays so we will create an array of arrays • The array will hold all of the buttons • The buttons contain letters
Subclasses • In this app, we will also make use of the ability to create subclasses • If a class is not declared final, then we can create a new class called a subclass • We can add additional functionality to the subclass
The game • The idea behind the game to choose randomly words from a list • We create a grid of 400 letters and randomly choose locations to place those words in the grid • After we have placed those words, we fill the other buttons in with random letters • The words hidden are displayed in a list
The game, cont'd • The player will search through the grid trying to locate the words • When a player thinks they have found the word, they will hold down the mouse on the first letter and drag the mouse to the last letter • When the player begins dragging the mouse, a MouseMotionEvent is fired • We record the buttons that the user drags the mouse over
The game, cont'd • When the user lets up on the mouse, a MouseEvent is fired • We then collect the letters from the buttons the user selected • We create a String from the letters and check to see if it is in the list • If it is, then we change the font of the word to strikethrough • If the user wants to start over, we provide a button to reset the grid