Implement "Log" Component

Summary

A “Log” refers to a GUI component, often used in roguelike games to display information to the user about a variety of events.

A dedicated “Log” Component would be a useful way to easily provide this functionality in a GUI.

Example

The Orc’s attack hits! The Orc attacks you! You missed… You attacked the Orc!

Work Around

The current work around is to use a TextImage:

1. Create TextImage for your preferred size
2. Draw a box around it via BoxBuilder
3. Update TextImage with each of your log messages via TextImage’s putText() method

For Example

public class Playground {

    public static void main(String[] args) {
        final Terminal terminal = TerminalBuilder.newBuilder()
                .font(CP437TilesetResource.REX_PAINT_20X20.toFont())
                .initialTerminalSize(Size.of(10, 5))
                .build();

        final TextImage img = TextImageBuilder.newBuilder()
                .size(Size.of(10, 5))
                .build(); // we create a new image to draw onto the terminal

        img.setForegroundColor(ANSITextColor.WHITE);
        img.setBackgroundColor(ANSITextColor.BLUE); // `putText` will use these

        BoxBuilder.newBuilder()
                .boxType(BoxType.DOUBLE)
                .size(Size.of(10, 5))
                .style(StyleSetBuilder.newBuilder()
                        .foregroundColor(ANSITextColor.CYAN)
                        .backgroundColor(ANSITextColor.BLUE)
                        .build())
                .build()
                .drawOnto(img, Position.DEFAULT_POSITION); // we create a box and draw it onto the image

        final List<String> logElements = new ArrayList<>();
        logElements.add("foo");
        logElements.add("bar"); // our log entries

        for(int i = 0; i < logElements.size(); i++) {
            img.putText(logElements.get(i), Position.OFFSET_1x1.withRelativeRow(i)); // we have to offset because of the box
        }

        terminal.draw(img, Position.DEFAULT_POSITION); // you have to draw each time the image changes

        terminal.flush();
    }
}

[William-Lake]

Hi All! Just saw the post on /r/roguelikedev and am so excited to see this control in Zircon! I know I’m preaching to the choir here but, great work- on everything!

[adam-arold]

Thanks, you can now use it!