|
サイズ: 1233
コメント:
|
サイズ: 3419
コメント:
|
| 削除された箇所はこのように表示されます。 | 追加された箇所はこのように表示されます。 |
| 行 1: | 行 1: |
| == etoys入門１ == Smalltalk :: オブジェクト指向言語の元祖 Squeak :: オープンソースのSmalltalk Etoys :: Squeak上でGUIプログラミング |
#acl All: == etoysタートルグラフィックス == 基本的な使い方(前回の復習) . 起動と終了 . プロジェクトの作成と保存 . お絵かき ハロとビューアを使った操作(新しい内容) . オブジェクトの状態 . スクリプトの作成と実行 === 演習内容 === 絵を１つ描きます。 向きがはっきり分かる絵にすること。 描いた絵を動かすためのスクリプト（プログラム）を作成します。 |
| 行 9: | 行 22: |
| 起動したら<<Color(orange:↑はじめよう)>>が指している絵をクリックします。 | ---- === プロジェクトの作成 === <<Color(orange:↑はじめよう)>>が指している絵をクリックします。 |
| 行 11: | 行 26: |
| 名前が'''名無し'''になっていることを確認します。 | 画面がクリアされ、「はじめようEtoys4」の表示が無くなります。 . {{attachment:project.png}} プロジェクトに名前をつけておきます。 |
| 行 16: | 行 33: |
| 描き終ったら'''保存'''を押します。 | 描き終ったら'''ほぞん'''を押します。 |
| 行 18: | 行 35: |
| 描き終わった絵は自由に配置することができます。 . {{attachment:paint4.png}} 今回は絵を１つだけ描いてください。 向きがはっきり分かるものにすること。 . {{attachment:turtle01.png}} |
|
| 行 19: | 行 41: |
| === ハロ === 描き終わった絵は自由に配置することができます。(左ボタン) . {{attachment:paint4.png}} 中ボタンでクリックすると絵のまわりに'''ハロ'''が表示されます。 . {{attachment:paint5.png}} |
=== プロジェクトの保存 === z:ドライブのetoysフォルダの中に、'''プロジェクト名.連番.pr'''の名前で保存されます。 . {{attachment:start13a.png}} ---- === 名前の修正 === 中ボタンでクリックし'''ハロ'''を表示します。 部品(オブジェクトと呼びます)の名前は下中央に表示されます。 . 最初は'''スケッチ'''になっています。 . この部分をクリックし、新しい名前を入力します。 . {{attachment:turtle04.png}} . うさぎに変更しました。 ---- === 中心位置と移動方向の修正 === '''ハロ'''を表示すると オブジェクトの中心付近に'''青い丸'''と'''緑の矢印'''が表示されます。 . '''青い丸'''は回転するときの中心位置です。 . 移動にともなって線を引くときにも、この位置が使われます。 . 修正するにはシフトキーを押しながら青い丸をドラッグします。 . {{attachment:turtle02.png}} . '''緑の矢印'''は進むときの方向です。 . 修正するにはシフトキーを押しながら矢印の先をドラッグします。 . {{attachment:turtle03.png}} |
| 行 27: | 行 68: |
| . {{attachment:tile1.png}} ビューアからタイルを取り出してスクリプトを作成できます。 . {{attachment:tile2.png}} |
このボタンを押すとスクリプトが１回実行されます。 . {{attachment:usagi02.png}} . {{attachment:turtle05.png}} . {{attachment:turtle06.png}} . {{attachment:turtle07.png}} . {{attachment:turtle08.png}} . {{attachment:turtle09.png}} . {{attachment:turtle10.png}} . {{attachment:turtle11.png}} . {{attachment:turtle12.png}} . {{attachment:turtle13.png}} . {{attachment:turtle14.png}} . {{attachment:turtle15.png}} . {{attachment:turtle16.png}} . {{attachment:turtle17.png}} . {{attachment:turtle18.png}} . {{attachment:turtle19.png}} . {{attachment:turtle20.png}} . {{attachment:turtle21.png}} |
etoysタートルグラフィックス
基本的な使い方(前回の復習)
- 起動と終了
- プロジェクトの作成と保存
- お絵かき
ハロとビューアを使った操作(新しい内容)
- オブジェクトの状態
- スクリプトの作成と実行
演習内容
絵を１つ描きます。 向きがはっきり分かる絵にすること。
描いた絵を動かすためのスクリプト（プログラム）を作成します。
起動
スタートメニューからスクイークetoysを選びます。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=startmenu.png "[添付]"){kind=small}
プロジェクトの作成
↑はじめようが指している絵をクリックします。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=start1.png "[添付]"){kind=small}
画面がクリアされ、「はじめようEtoys4」の表示が無くなります。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=project.png "[添付]"){kind=small}
プロジェクトに名前をつけておきます。
お絵かき
このボタンを押すと絵を描く画面になります。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=paint1.png "[添付]"){kind=small}
描き終ったらほぞんを押します。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=paint2.png "[添付]"){kind=small}
描き終わった絵は自由に配置することができます。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=paint4.png "[添付]"){kind=small}
今回は絵を１つだけ描いてください。 向きがはっきり分かるものにすること。
プロジェクトの保存
z:ドライブのetoysフォルダの中に、プロジェクト名.連番.prの名前で保存されます。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99b.d27b0973d802605adcf31f2d5c70c488&target=start13a.png "[添付]"){kind=small}
名前の修正
中ボタンでクリックしハロを表示します。
部品(オブジェクトと呼びます)の名前は下中央に表示されます。
最初はスケッチになっています。
- この部分をクリックし、新しい名前を入力します。
- うさぎに変更しました。
中心位置と移動方向の修正
ハロを表示すると オブジェクトの中心付近に青い丸と緑の矢印が表示されます。
青い丸は回転するときの中心位置です。
- 移動にともなって線を引くときにも、この位置が使われます。
- 修正するにはシフトキーを押しながら青い丸をドラッグします。
緑の矢印は進むときの方向です。
- 修正するにはシフトキーを押しながら矢印の先をドラッグします。
スクリプト
目の形のハロをクリックすると画面右にビューアが表示されます。 このボタンを押すとスクリプトが１回実行されます。
![[添付]](/~masahiko/moin.cgi/etoys%E3%82%BF%E3%83%BC%E3%83%88%E3%83%AB%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%83%E3%82%AF%E3%82%B9?action=AttachFile&do=upload_form&ticket=006807a99c.9846d3bbfba4ce0812b8a18bb6ea8881&target=turtle21.png "[添付]"){kind=small}