Published Date : 2020年5月20日14:26

Android Studioで簡単なProcessingのSketchを作成する方法
How to create a simple Processing Sketch in Android Studio

This blog has an English translation

YouTubeにアップした動画、「How to create a simple Processing Sketch in Android Studio:Android Studioで簡単なProcessingのSketchを作成する方法」の補足説明の記事です。

Here's a little more about the 「How to create a simple Processing Sketch in Android Studio:Android Studioで簡単なProcessingのSketchを作成する方法」 video I uploaded to YouTube.

前回の動画ではProcessingのSketchをAndroid Studioを使ってエミュレーターや実機で動かす方法を紹介しました。 今回の動画では簡単なProcessingのSketchを二つほど作ってAndroid StudioでAndroid端末で動かせるように遊んでみましょう。

In the last video, I showed you how to run Processing Sketch on an emulator or a real machine using Android Studio. In this video, we're going to build a couple of simple Processing Sketches and play with them so they can run on Android devices in Android Studio.


It's a video that can be understood in a short period of time even when you're busy, without any unnecessary explanation.


Table of Contents

Downloading Processing and Moving Sketch


Let's download Processing to quickly see how Sketch works. Enter [] in the browser to search for it.

Responsive image

Responsive image


Download the appropriate Processing for your OS.

Responsive image


Extract the downloaded ZIP file.

Responsive image


Open the expanded folder and double-click [executable file of Processing] to start Processing.

Responsive image

Responsive image


To change the font format or size of characters, select [File] -> [Settings].

Responsive image

Responsive image


Write a simple Sketch and run it.

Responsive image

Android StudioでいくつかSketchを作って動かす
Creating and Running Some Sketches in Android Studio

Android Studioを起動します。

Start Android Studio.

Responsive image

Android StudioとProcessingライブラリを連携させた前回のプロジェクトを使います。

Use the previous project that combined Android Studio with the Processing library.

Responsive image

ProcessingのSketchをAndroid Studioの[]にコピペしていきます。

Copy and paste the Sketch from Processing into [] in Android Studio.

Responsive image

ProcessingのSketchとAndroid Studioの[]の書き方の違いは「画面サイズ」の設定だけです。

The only difference in how to write [] between Processing Sketch and Android Studio is in the setting of "screen size".

Responsive image


If you want to change the orientation of the right emulator, click the Rotate button in the small red box on the right.

Responsive image


When the screen size is set to fullScreen(), Sketch will fill the screen to fit the device.

Responsive image


You can also directly replace the mousePressed() function. (However, you need to add a Java access modifier such as public.)

Responsive image

このように「void settings()」以外はほぼ全てがProcessingと同じ書き方で大丈夫です。

Thus, you can write almost everything like Processing, except for [void settings()].

Responsive image

別のSketchを直接Android Studioの「」に書いていきます。ボールが画面の中を跳ね返るだけのSketchです。

Write another Sketch directly in [] in Android Studio. This is a Sketch that only bounces the ball around the screen.

Responsive image

Responsive image


I added functions such as 「When the ball bounces, it randomly changes its color」 and 「The ball randomly reappears on the screen when you click the mouse」 to Sketch.

Responsive image

Responsive image
package (your package name);

import processing.core.PApplet;

public class Sketch extends PApplet {
    float r = 150;
    float x = 1;
    float y = 1;
    float xa = 30;
    float ya = 60;

    public void settings() {

    public void setup() {

    public void draw() {
        if ((x > width + 1) || (x < -1)) {
            xa = xa * -1;
            fill(random(255), random(255), random(255));
        if ((y > height + 1) || (y < -1)) {
            ya = ya * -1;
            fill(random(255), random(255), random(255));
        ellipse(x, y, r, r);
        x = xa + x;
        y = ya + y;

    public void mousePressed(){
        x = random(width-1);
        y = random(height-1);



That's all. Thank you for your hard work.

後はAndroid端末をパソコンに繋げます。そしてAndroid StudioでSketchをAndroid端末にデプロイすれば実機でも操作できるようになります。

After that, connect your Android phone to your computer. When you deploy Sketch to an Android device in Android Studio, you can work with the sketch on your own machine.

See You Next Page!