Flags with Stars Tutorial

From Progzoo
Jump to: navigation, search

Drawing flags: reusing shapes.

Vietnam

Flagvietnam.png

The flag of Vietnam has a yellow five pointed star on a red background. This star is a popular device on many flags, we define the star once and use it many times in later flags.

The given star has a radius of 50, it is centred on 0,0 which is the wrong place. We must translate to put it in the right place. We can use the translate method to move the star to the right location.

The translate call is to the wrong location (50,50) - it should be at (100,75).


[Font] [Default] [Show] [Resize] [History] [Profile]

Panama

The flag of Panama requires two stars. We can draw the same star twice.

Flagpanama.png


[Font] [Default] [Show] [Resize] [History] [Profile]

Bosnia and Herzegovina

The flag of Bosnia and Herzegovina includes 9 white stars. Each star is 38 right and 38 below the previous star.

Flagbosnia.png


Following the final

fillPolygon we translate then fillPolygon again.

g.translate(38,38);
g.fillPolygon(star);

To make the lines smoother we can insert the following before doing any drawing or filling. This makes rendering slower, but better.

g.setRenderingHint(
RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);



[Font] [Default] [Show] [Resize] [History] [Profile]

Democratic Republic of Congo (formerly Zaire)

  • The large star has a radius of 100
  • The 6 smaller stars have a radius of 10.
  • The background color is rgb: 173,216,230

Flagcongo.png


You can copy the large star from the Vietnam example. To draw the smaller stars we can translate to the right place, then scale to the right size. The scale method makes following fill and translate actions smaller of bigger depending on the value given.

For example the following draws the star half size.

g.scale(0.5,0.5);
g.fillPolygon(star);

Beware that the scale operation effects accumulate and any translate following a scale will be effected.



[Font] [Default] [Show] [Resize] [History] [Profile]