VCSSL 2D Graphics Programming Guide
This guide explains how to work with two-dimensional graphics (2D graphics or 2DCG) in VCSSL.
Introduction
Graphics processing is a fundamental operation used across a wide range of fields. Common examples include drawing computer graphics (CG) on the screen, or processing image data loaded from files (image processing).
VCSSL provides basic graphics functionality to support these kinds of tasks when needed. For example, you can directly draw elements like points, lines, or images by calling drawing functions sequentially. Alternatively, you can register them as sprites and render them all at once at the appropriate timing. Sprites are particularly useful for animating multiple visual elements (such as characters) by moving their positions across the screen.
For more detailed graphics operations, you can also access and modify the color of each individual pixel in an image as numeric data within your program. However, since this kind of pixel-level processing can be computationally expensive and memory-intensive, it's not suitable for real-time animations. Instead, it's best used for tasks like specialized image analysis or processing that can't be handled by standard software.
In this guide, we'll focus on flat (2D) graphics operations -- what is commonly referred to as "2DCG" -- and how to perform them within VCSSL programs.
Now then, let's get started with 2DCG programming in VCSSL!
Table of Contents
![]() |
2D Computer Graphics Introduces the basics of 2D computer graphics. |
![]() |
Creating a Renderer Covers how to initialize a renderer (drawing engine). |
![]() |
Creating a Display Screen Explains how to set up the output screen for rendering. |
![]() |
Exporting to Image Files Describes how to export rendered graphics as image files. |
![]() |
Clearing the Screen and Setting the Background Color Discusses clearing the canvas and setting the background color. |
![]() |
Direct Drawing Covers the simplest method of drawing by issuing direct draw calls. |
![]() |
Sprite-Based Drawing Explains how to draw by creating and positioning sprites. |
![]() |
Controlling Sprites Shows how to modify or control sprites after placing them. |
![]() |
Pixel-Level Drawing Describes how to perform drawing operations at the pixel level. |
![]() |
Using the Framework Introduces a framework for automating steps like renderer and screen setup. |