GUIs for Video Games Comp Sci 4 GUIs

  • Slides: 17
Download presentation
GUIs for Video Games Comp. Sci 4 GUIs for Video Games 16. 1

GUIs for Video Games Comp. Sci 4 GUIs for Video Games 16. 1

The Plan v v v Layout suggestions Observer/Observable Steps to writing Observer/Observables Sample Code

The Plan v v v Layout suggestions Observer/Observable Steps to writing Observer/Observables Sample Code Practice Comp. Sci 4 GUIs for Video Games 16. 2

Layout Suggestions Game Here Score Here Controls Here Title Here Controls Here Comp. Sci

Layout Suggestions Game Here Score Here Controls Here Title Here Controls Here Comp. Sci 4 GUIs for Video Games 16. 3

Layout Suggestions Game Here Score Here Title Here Controls Here Use a Border. Layout

Layout Suggestions Game Here Score Here Title Here Controls Here Use a Border. Layout for the Frame Make the Title a JLabel Make the Controls and Score JPanels in different classes Controls Here Comp. Sci 4 GUIs for Video Games 16. 4

Observer/Observable Pattern v Observable q q q v Data that changes Used for the

Observer/Observable Pattern v Observable q q q v Data that changes Used for the model Alerts Observers of changes Observer q q q Depends on changing data Used for the view Responds to changes in the Observable Comp. Sci 4 GUIs for Video Games 16. 5

Why use Observer/Observable? v Separates model from view q q v Avoids polling q

Why use Observer/Observable? v Separates model from view q q v Avoids polling q q v Model is typically where the complexity is Changes in complex models is undesirable An alternative is to repeated check if data has changed Polling wastes processor time Enables flexibility of multiple views q Can even have multiple views open at once Comp. Sci 4 GUIs for Video Games 16. 6

More Motivation Consider tic-tac-toe: q q Model consisting of 9 variables telling board position

More Motivation Consider tic-tac-toe: q q Model consisting of 9 variables telling board position Full feature view for fast computers o 3 D Animation o Sound o Images q Scaled down version for slower computers o JButtons o Image. Icons q Control class to change letters of model Comp. Sci 4 GUIs for Video Games 16. 7

Benefits v v v Same model, different view Controller would enable networked game input.

Benefits v v v Same model, different view Controller would enable networked game input. Model easy to send across network, view is difficult. Separation enables simplicity and flexibility. Comp. Sci 4 GUIs for Video Games 16. 8

Steps to writing Observer/Observable 1. Write separate classes for the model and the view.

Steps to writing Observer/Observable 1. Write separate classes for the model and the view. 2. Make the model extend Observable. 3. Make the view implement Observer. 4. Connect the Observer and Observable using the add. Observer method. Comp. Sci 4 GUIs for Video Games 16. 9

Example: Score Board v Model q q q v Enemies left Hero's life left

Example: Score Board v Model q q q v Enemies left Hero's life left Timer View q q JPanel with JLabels Grid. Layout Comp. Sci 4 GUIs for Video Games 16. 10

Score. java import java. util. *; public class Score extends Observable { double ship.

Score. java import java. util. *; public class Score extends Observable { double ship. Score, enemy. Score, time; public void set. Ship. Score(double s) { ship. Score=s; set. Changed(); notify. Observers(); } public void set. Enemy. Score(double s) { enemy. Score=s; set. Changed(); notify. Observers(); } Comp. Sci 4 GUIs for Video Games 16. 11

public double get. Ship. Score() { return ship. Score; } Score. java public double

public double get. Ship. Score() { return ship. Score; } Score. java public double get. Enemy. Score() { return enemy. Score; } public void set. Time(double t) { if((int)time!=(int)t){ time=t; set. Changed(); notify. Observers(); } time=t; } } public double get. Time() { return time; } Comp. Sci 4 GUIs for Video Games 16. 12

Score. Panel. java import java. awt. *; import javax. swing. *; import java. util.

Score. Panel. java import java. awt. *; import javax. swing. *; import java. util. *; public class Score. Panel extends JPanel implements Observer { JLabel title; JLabel ship. Score; JLabel enemy. Score; JLabel time; public Score. Panel() { super(); make. Components(); make. Layout(); } Comp. Sci 4 GUIs for Video Games 16. 13

Score. Panel. java private void make. Components() { title=new JLabel("Score"); ship. Score=new JLabel("Ship: ");

Score. Panel. java private void make. Components() { title=new JLabel("Score"); ship. Score=new JLabel("Ship: "); enemy. Score=new JLabel("Enemy: "); time=new JLabel("Time: 0"); } private void make. Layout() { set. Layout(new Grid. Layout(4, 1)); add(title); add(ship. Score); add(enemy. Score); add(time); } } public void update(Observable obs, Object arg) { Score score=(Score)obs; ship. Score. set. Text("Ship: "+score. get. Ship. Score()); enemy. Score. set. Text("Enemy: "+score. get. Enemy. Score()); time. set. Text("Time: "+(int)score. get. Time()); System. out. println("repainting"); repaint(); } Comp. Sci 4 GUIs for Video Games 16. 14

Galaga. java import import java. awt. Border. Layout; javax. swing. *; java. awt. event.

Galaga. java import import java. awt. Border. Layout; javax. swing. *; java. awt. event. *; tipgame. *; public class Galaga extends JApplet implements Action. Listener { JFrame frame; JButton button; Galaga. Loop game; JLabel title; Score. Panel score. Panel; public Galaga() { make. Components(); layout. Components(); } Comp. Sci 4 GUIs for Video Games 16. 15

Galaga. java private void make. Components() { frame=new JFrame(); button=new JButton("Start"); button. add. Action.

Galaga. java private void make. Components() { frame=new JFrame(); button=new JButton("Start"); button. add. Action. Listener(this); game=new Galaga. Loop(new Dimension(500, 500)); title=new JLabel("Blast Those Professors!"); Font font=title. get. Font(); title. set. Font(font. derive. Font(32. 0 f)); score. Panel=new Score. Panel(); game. get. Score(). add. Observer(score. Panel); } private void layout. Components() { Container container=frame. get. Content. Pane(); container. set. Layout(new Border. Layout()); container. add(game. get. Canvas(), Border. Layout. CENTER); container. add(button, Border. Layout. SOUTH); container. add(title, Border. Layout. NORTH); container. add(score. Panel, Border. Layout. EAST); frame. pack(); frame. set. Resizable(false); } Comp. Sci 4 GUIs for Video Games 16. 16

Practice Write a program to count the number of clicks on a yes, no

Practice Write a program to count the number of clicks on a yes, no and maybe button. To do this, write three classes: Click. Count – keeps three integer instance variables to count the number of clicks Click. Count. Panel – observes Click. Count for changes and updates its components when an update occurs Click. GUI – contains three buttons and the count panel. Clicking on the buttons registers the click via Click. Count. Comp. Sci 4 GUIs for Video Games 16. 17