We can seen how to create basic images. We can combine images using layouts methods to create more complex images. Try the following code. You should see a circle and a rectangle displayed beside one another, as shown below.

(, 200))).draw()

A circle beside a rectangle

Image contains many layout methods for combining images. Here are one we'll use to start with.

Try out these methods until you're sure you understand them.


Exercise: The Width of a Circle

Create the picture below using the layout methods and basic images we've covered so far.

The width of a circle

It's three small circles on top of a bigger circle, and we can just about state this as is in code.

// res0: Image = On(
//   t = Beside(
//     l = Beside(l = Circle(d = 60.0), r = Circle(d = 60.0)),
//     r = Circle(d = 60.0)
//   ),
//   b = Circle(d = 180.0)
// )