To make your drawing more appealing, fill your shapes with colors. The LZX application in Listing 10.7 displays a rectangle and an oval that are filled with different colors.
<canvas height="200"> <drawview height="200" width="600"> <method event="oninit"> this.rect(10, 10, 100, 30); this.stroke(); this.moveTo(60, 20); this.fillStyle = 0x00ee00; this.fill(); this.beginPath(); this.oval(350, 100, 75, 10); this.stroke(); this.moveTo(150, 100); this.fillStyle = 0x330000; this.fill(); </method> </drawview> </canvas> |
Note that you need to move the brush to a coordinate inside the shape before calling fill. Also, call beginPath before start drawing the next shape.
To test the application in Listing 10.7, use this URL.
http://localhost:8080/lps-4.0.x/app10/fillTest1.lzx
Figure 10.7 shows the colorful shapes