W2262 Filled Paths

From Coder Merlin
Within these castle walls be forged Mavens of Computer Science ...
— Merlin, The Coder



Paths may be filled with either a solid color (described in this experience) or gradients, described in W2263 Gradients.

Filling Paths[edit]

Paths may be filled with a solid color with three steps:

  1. . Create the color (using either standard CSS names or creating your own color via RGB)
  2. . Create a fill style using the color
  3. . Specify the fill mode of the path

For example:

// Set up color

let solidColor = Color(.orange)

let fillStyle = FillStyle(color:solidColor)

// Create path

let path = Path(fillMode:.fillAndStroke)


canvas.render(fillStyle, path)

Key Concepts[edit]


  • Create a new project, W2262, using W2261 as a starting point.
  • Fill the background (sky) with a blue color.
  • Fill all other objects with various, solid colors. You must use a total of at least eight different colors (excluding black and white).

Getting started:

john-williams@codermerlin:~/Projects$ git clone https://github.com/TheCoderMerlin/IgisShellD W2262

john-williams@codermerlin:~/Projects$ cd W2262/Sources/IgisShellD

john-williams@codermerlin:~/Projects$ cp ../../../W2261/Sources/IgisShellD/main.swift .

To compile:

john-williams@codermerlin:~/Projects/W2262$ ./make.sh

To execute:

john-williams@codermerlin:~/Projects/W2262$ ./run.sh

Your associated url will be: http://www.codermerlin.com/users/john-williams/dyn/index.html