News Center

Current Location:Home page  <  Product Tutorials
[Creator weapon] draw simple graphics with Processing
2019-09-26

     Processing is a revolutionary and forward-looking emerging computer language whose concept is to introduce programming languages in the context of electronic art. It is an extension of the Java language and supports many existing Java language architectures, but is much simpler in syntax and has many intimate and user-friendly designs. Processing can be used on Windows, MAC OS X, MAC OS 9, Linux and other operating systems. The latest version is Processing 3. Works completed with Processing can be played on the personal side of the game, or exported to the network in the Java Applets mode.

    Although the graphical user interface (GUI) became mainstream 20 years ago, the teaching of basic programming languages is still dominated by the command line interface. Why is it so boring to learn programming languages? The human brain is good at spatial recognition. The graphical user interface takes advantage of this advantage. It also provides a variety of real-time and vivid image feedback, which can greatly shorten the learning curve and help understand the abstract logic. For example, a pixel on a computer screen is a visual representation of the value of a variable. Processing simplifies the syntax of Java and "sensory" its results, allowing users to quickly enjoy interactive multimedia works with both sound and light. The source code for Processing is open, and like the popular Linux operating system, Mozilla browser, or Perl language, users can freely tailor the most appropriate usage mode according to their needs. Processing is very versatile, and they all comply with open source regulations, which greatly increase the interactivity and learning efficiency of the entire community. Here's how to use Processing to draw simple graphics.


First, you need to download and run the Processing software.

Download address: https://processing.org/download/, you need to choose Processing software according to your computer's system.

1.png


The downloaded file is a compressed file, directly unzipped, and you can open the software by double-clicking the .exe executable in the extracted file. After opening, the effect is as shown below:

2.png

If you don't know much about the operation of the Processing software, you can take a look at this article: http://www.alsrobot.cn/article-883.html

We said that to use Processing to draw simple graphics, is it really necessary to draw? Of course not, we are going to use the code to "draw" the graphics, let's get started!

1, draw a window

Use the command: size(x,y)

3.png

As shown, the code runs as a window with a pixel of 480 * 120.


2, draw a point on the window

Use the command: point(x,y)

4.png

As shown in the figure, the result of the code is to create a pixel with a pixel of 1 in the window.


3, draw a straight line

Use the command: line(x1, y1, x2, y2)

5.png

As shown in the figure, the result of the code run is to create a line in the window, x1, y1 and x2, y2 are the coordinates of the two endpoints of the line respectively.


4, draw a rectangle
Use the command: rect(x,y,width,height);

6.png

As shown in the figure, the program runs as a rectangle created in the window, length 220, width 40, fixed point coordinates (180, 60)


5, draw an ellipse

Use the command: ellipse(x,y,width,height);

7.png

As shown in the figure, the effect of the program running is to draw three circles in the window. Note that if the size of the circle is large, the part beyond the scope of the window will not be displayed.


6, draw an arc
Use the command: arc(x, y, width, height, start, stop);

8.png


    As shown in the figure, the program runs as an arc that draws different angles in the window.


    Basic basic drawing statements in Processing are basically these, have you learned? With these instructions, we can also create relatively complex graphics and try them together!



Create source maker, creative from ALSROBOT