2.3.9 Nested Views Codehs -

// 3. Text nested inside Header var headerText = new Text("My App"); headerText.setColor("white"); headerText.setPosition(header.getX() + 15, header.getY() + 32); headerText.setFont("18pt Arial"); add(headerText);

var titleText = new Text("Dashboard"); titleText.setColor("white"); titleText.setPosition(headerView.getX() + 10, headerView.getY() + 30); titleText.setFont("16pt Arial"); add(titleText); Now, add a larger content view below the header. 2.3.9 nested views codehs

// 4. Nested Child 2: Content Box var content = new Rectangle(260, 280); content.setColor("#FFFFFF"); content.setBorderWidth(1); content.setBorderColor("#CCCCCC"); content.setPosition(parent.getX() + 20, parent.getY() + 90); add(content); Nested Child 2: Content Box var content =

By following the step-by-step code above—creating a parent, adding children with relative offsets, and nesting text inside those children—you will not only pass 2.3.9 but also build a strong foundation for future projects like building calculators, to-do lists, or even small games on CodeHS. function start() { // 1

var infoText = new Text("Welcome to nested views!"); infoText.setColor("black"); infoText.setPosition(contentView.getX() + 10, contentView.getY() + 30); add(infoText); Here is the full, runnable solution. Copy and paste this into the CodeHS editor for 2.3.9.

function start() { // 1. Parent View (the main container) var parent = new Rectangle(300, 400); parent.setPosition(100, 100); parent.setColor("#E0E0E0"); // Light gray parent.setBorderWidth(2); parent.setBorderColor("black"); add(parent); // 2. Nested Child 1: Header Bar var header = new Rectangle(260, 50); header.setColor("#4A90E2"); // Blue header.setPosition(parent.getX() + 20, parent.getY() + 20); add(header);

// 6. Another nested element: a simulated button (rectangle + text) var button = new Rectangle(100, 30); button.setColor("#4CAF50"); // Green button.setPosition(content.getX() + 15, content.getY() + 60); add(button);