Codeskulptor How to Draw a Black Circle

Course Home
Announcements
Reflections

Video Lessons

• Development Environments
• Start Programming
• Functions
• CodeSkulptor Viz Mode
• Logic and Conditionals
• Interactive Applications
• Classes
• Lists
• Refactoring
• Another edge behavior: wrapping
• Collsion Detection
• Go button
• Keyboard Input
• Images
• Pong

Related Links

Online Development

• CodeSkulptor
• CodeSkulptor Viz Mode

Lessons

• CodeAcademy, Python Track
• Google's Python Class

Reference

• Python Programming Language—Official Website
• Code Style: Python Guide
• Google Python Style Guide

eBooks

• Think Python: How to Think Like a Computer Scientist
• The Art and Craft of Programming
• Learn Python The Hard Way
• A Byte of Python
• Dive Into Python
• Code Like a Pythonista
• Python Programming

Interactive Applications

MicroWorlds and CodeSkulptor both provide frameworks for event-driven programming.

Interactive Applications, Part 1: Event-driven programming

Interactive Applications, Part 2: The Event Queue

Interactive Applications, Part 3: Global and Local Variables

Interactive Applications, Part 4: Simplegui

Interactive Applications, Part 5: More simplegui

Interactive Applications, Part 6: The structure of a MicroWorlds program

Interactive Applications, Part 7: The structure of a simplegui program

Interactive Applications, Part 8: Coordinate systems in MicroWorlds and CodeSkulptor

Interactive Applications, Part 9: Programming edge behaviors

Frames

In CodeSkulptor, the frame is the window that holds the control panel (or control area), status information, and canvas. You can add buttons, text input fields, and labels to the control panel.

The status area holds information about keyboard and mouse input. You can add handlers for buttons, input fields, key down events, key up events, mouse click events, and mouse drag events.

Graphics are drawn on the canvas.

---

---

The CodeSkulptor frame is similar to the MicroWorlds Main Window. One difference is that in CodeSkulptor, you have to create a frame and add its objects and handlers in your code. In MicroWorlds, you already have a Main Window when you start up your project, and you can add objects to it by using the menu or the tool bar.

Another difference is that in CodeSkulptor, control objects and graphics are in separate areas of the window, while MicroWorlds controls and graphics are all together in the Main Window.

There is also a difference in the controls themselves. In CodeSkulptor, you can program a handler for an input field that fires when the use presses Enter. In MicroWorlds, there is no such thing as a Rules tab for text boxes. CodeSkulptor allows you to write event handlers for both mouse click events and mouse drag events, while MicroWorlds only handles mouse click events (with OnClick in the Rules tab or with color detection for mouse clicks).

Another difference is that in CodeSkulptor you register a draw handler to handle draw events. The draw handler runs about 60 times each second. Everything that appears in the canvas must be drawn by the draw handler or a helper function that is called by the draw handler.

In MicroWorlds, you usually start a game with a button that says something like "everyone [clickon]". In CodeSkulptor, you start a game by asking the frame to start. This is done with a function call that looks like frame.start().

Examples

• Timer example 1
• Timer example 2
• First frame example
• Drawing Text
• Frame and Timer
• Changing text with a button
• Drawing a Circle
• Ball
• Image example 1
• Image example 2

CodeSkulptor Exercises

You've seen examples of drawing circle, and examples of changing text with buttons. Try writing a program to change circles with buttons. Here are some things you can change:

• The color of the circle.
• The color of the circle's outline.
• The position of the circle.
• The size of the circle. You change this by changing its radius.
• The width of the line that outlines the circle.

You can use this template to start yourself off.

Extra challenges

• Look up the documentation on other controls, such as Text Input Control, Mouse Input Controls and Keyboard Input Controls. See if you can figure out ways to use these controls to change a circle on the screen.
• Look in the documentation to see what other shapes you can draw. Write programs for these different shapes and use input controls to change them in different ways.

About the Center for Talent Development

Center for Talent Development (CTD), housed at Northwestern University's School of Education and Social Policy, is an accredited learning center and research facility that identifies, educates and supports gifted students and their families and serves as a leader in gifted education. Learn more about the Center for Talent Development.

Codeskulptor How to Draw a Black Circle

Source: https://www.tjleone.com/bits-and-blocks2-logo-and-python-interactive-applications.htm

Share this post