CMPT 270 Developing Object Oriented Systems PDF

CMPT 270 Developing Object Oriented Systems Graphics and Custom JComponents Jason T Bowey University of Saskatchewan Jason T Bowey CMPT 270 1/11  Learning Objectives Create custom JComponents Create primitive graphics Incorporate custom com...

CMPT 270 Developing Object Oriented Systems Graphics and Custom JComponents Jason T Bowey University of Saskatchewan Jason T Bowey CMPT 270 1/11  Learning Objectives Create custom JComponents Create primitive graphics Incorporate custom components into GUI Swing programs Jason T Bowey CMPT 270 2/11  Custom JComponents In previous lecture we saw how to create a custom JFrame Creating a custom JComponent is a similar process How do we do it? Jason T Bowey CMPT 270 3/11  Creating Custom JComponent 1. Create a class that inherits from JComponent 2. Override the paintComponent method 3. Write custom drawing code to customize how your component looks Jason T Bowey CMPT 270 4/11  paintComponent Method   1 public class MyCustomComponent extends JComponent 2 3 @Override 4 protected void paintComponent ( Graphics g ) { 5 // your drawing code goes here 6 } 7 }   This method is called automatically on creation and when the window resizes If you change something in your program that requires your component to be redrawn, you can call the repaint() method on the instance of your component Jason T Bowey CMPT 270 5/11  Graphics Object If you pay close attention to the paintComponent method, you will notice that it is passed a parameter of type Graphics This parameter is a Graphics Context It does a lot of useful things, but in this course we will keep it simple and just use it for drawing shapes Jason T Bowey CMPT 270 6/11  Using a Graphics Context Using a graphics context is kind of like drawing on paper You need to set the current colour (similar to picking up a crayon) and you will use that colour until you change it to a different colour All commands are done to the Graphics object Jason T Bowey CMPT 270 7/11  Some Drawing Commands g.setColor(Color) g.drawRect(int x, int y, int width, int height) g.fillRect(int x, int y, int width, int height) Several methods to drawImage Also draw/fill commands for oval, arc, polygon, roundRect Jason T Bowey CMPT 270 8/11  Example paintComponent   1 @Override 2 protected void paintComponent ( Graphics g ) { 3 g. setColor ( Color. red ); 4 g. fillRect (0 , 0 , 100 , 200); 5 6 g. setColor ( Color. black ); 7 g. drawOval (50 , 50 , 75 , 75); 8 }   Jason T Bowey CMPT 270 9/11  Exercise 1: Creating a Healthbar Create a functional healthbar for a video game UI Set up a Model-View-Controller Architecture to store player health The View class will contain a custom component called HealthbarComponent which will change size to reflect the player’s current health-maxHealth ratio Add two buttons that will ’damage’ and ’heal’ the player, to test that the healthbar is working Jason T Bowey CMPT 270 10/11  Summary Inherit from JComponent to create a custom UI widget/component Override the paintComponent to customize how the component looks Jason T Bowey CMPT 270 11/11