Last updated: 2015 -2014. Kajiyama                    [ 目次に戻る ]

コピペで 「直線と長方形を描画する」ソースファイルを作成・実行・保存


  1. キャンバスの2次元座標系

    ・キャンバスの二次元の表示画面には,

     それぞれのピクセル(画素)の位置にXY座標が与えられている.

    ・この座標系は,算数や数学で習ったものとは,

     Y軸の向きが違うので,注意が必要である.


  2. 操作画面の新規[New] ボタンをクリックし,新たに白紙の操作画面を表示する.


    
    
    統合開発環境
    
     ・ この操作画面の名前「sketch_150507c」は,
    
         今日の日付(sketch _年月日c)である.
    
     ・ この日付の名前が,新規作成するソースファイルの
    
         フォルダーとファイルの名になる.
    


  3. 次のプログラムを,白紙の操作画面にコピペする.

    ・次のソースファイルをコピーして,Processing開発環境のエディタ領域に貼り付ける.

    ・このソースファイルをデータフォルダー「Sketchbook」の中にファイル名を付けて保存する.

    ソースファイル
    //ファイル名:sketch_150507c.pde 
    //直線と長方形を描く
    
    void setup() {
      size(500, 500);//キャンバスの大きさ
      noFill( );//図形の内部を透明にする
      strokeWeight(10);//線の太さを10ピクセルに
    }
    
    void draw() {
    
    // 直線の始点(x1,y1)
    int x1 = 10;  // 始点のx1座標
    int y1 = 20;  // 始点のy1座標
    // 直線の終点(x2,y2)
    int x2 = 490; // 終点のx2座標
    int y2 = 480; // 終点のy2座標
    //線の色を赤に
    stroke(255,0,0);
       // 直線を描く関数 line() 
       line(x1, y1, x2, y2); 
    
    // 長方形の左時上部の点の座標(x,y)
    int x = 50;
    int y = 60;
    // 長方形の幅と高さ
    int width  = 200; // 幅
    int height = 300; // 高さ
    //線の色を赤に
    stroke(0,0,255);
        // 長方形を描く関数 line() 
        rect(x, y, width, height); 
     
    //save("drow_fig_03.jpg");// 実行結果を画像で保存する
    //noLoop();//繰返し処理を止める
    
    }
    
    
    エディタに貼付


  4. ソースファイルを実行[Run]すると「キャンバス」が現れる.

    ・ ソースファイルをコピペしたのを確認し,ツールバーの 実行[Run] ボタンをクリックする.

    ・ 実行結果が,新たに,別の場所で作成された「キャンバス(実行画面)」のなかに表示される.

    
    



  5. ソースファイルの保存と確認

    ・ 保存[Save] ボタンをクリックし,ソースファイルをデータフォルダ「Sketchbook」の中に保存する.

    ・ 保存した[sketch_150507c]フォルダを確認するために,メニュー「Sketch」->「Show Sketch Folder」を選択する.

    ・ 「ドキュメント」->「Processing」フォルダーに[sketch_150507c]フォルダと内容が示される.

    ・ [sketch_150507c]フォルダには2つのデータがあり,ソースファイル「sketch_150507c.pde」と実行結果の画像一枚を確認できる.




  6. ソースファイルをWindows版の実行ファィルで公開

    ・ ツールバーの 出力[Export Application] を選択し,出力用の設定画面を表示する.

    ・ 設定画面にチェックを入れ,出力「Export」をクリックする..

    ・ 作成した[sketch_150507c.pde]の実行ファイルを確認するために,メニュー「Sketch」->「Show Sketch Folder」を選択する.

    ・ windows用の32ビット版と64ビット版が作成されたか確認する.

    
    
    出力用設定画面
    
    
    

[ 目次に戻る ]