Small Steps II — Making Things

Adding colors and text

Add colors and text.

What you will learn

rgb makes a color by mixing the intensities of red, green, and blue. Each value ranges from 0 to 255.

Try it

void small_main()
{
    Window window;
    window.open(640, 480);

    Color orange = rgb(255, 140, 0);

    window.clear(White);
    window.fill_rectangle(60, 80, 180, 120, orange);
    window.draw_rectangle(60, 80, 180, 120, Black);
    window.draw_text(80, 110, "Small C++", Blue, 24);
    window.show();

    while (window.is_open())
        window.show();
}

Color is the type that stores a color; rgb is a function that creates and returns one.

fill_rectangle takes the top-left x and y and the width and height. draw_rectangle draws only the outline. draw_text takes x, y, a string, a color, and a font size. Check that the text appears over the orange rectangle.

Exercise

Draw a simple face with circles and lines. Include two eyes and a mouth. Choose any colors and positions.

void small_main()
{
    Window window;
    window.open(500, 500);

    window.clear(White);

    // Draw your face here.

    window.show();
    while (window.is_open())
        window.show();
}

Hint

Make a face with one large fill_circle, then add two small circles and a draw_line.

void small_main()
{
    Window window;
    window.open(500, 500);

    window.clear(White);
    window.fill_circle(250, 250, 160, Yellow);
    window.fill_circle(195, 210, 18, Black);
    window.fill_circle(305, 210, 18, Black);
    window.draw_line(190, 315, 310, 315, Black);
    window.show();

    while (window.is_open())
        window.show();
}