四角形（Rectangle)メモ
back
「落書きとマスクで遊ぶ」を作ってるときにRectangleがらみのあたりで
めちゃくちゃ混乱しちゃったので、ちょっと復習というかメモでごんす。
ソースコードを順番にドゥ〜イットしてみてください。
Alt + d ( Cmd + d )
■準備でする
トランスクリプトを出しておきましょう。
画面の左下あたりに移動しておいて下され。
（画面左上は四角形などを表示するんで・・・）
--------------------------------------------
Transcript open.
--------------------------------------------
まずは四角形の表示してこの各位置の関係を見ていくです。
--------------------------------------------
rect1 _ 100@100 extent: 150@100.
Display border: rect1 width: 1.
--------------------------------------------
■
「origin」
「origin」を取得＆表示。
--------------------------------------------
pt _ rect1 origin.
(Form dotOfSize: 5) displayAt: pt.
--------------------------------------------
■
「corner」
「corner」を取得＆表示。
--------------------------------------------
pt _ rect1 corner.
(Form dotOfSize: 5) displayAt: pt.
--------------------------------------------
■
「center」
「center」を取得＆表示。
--------------------------------------------
pt _ rect1 center.
(Form dotOfSize: 5) displayAt: pt.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「topLeft/bottomLeft/bottomRight/topRight」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「topLeft/bottomLeft/bottomRight/topRight」を取得＆表示。
--------------------------------------------
p1 _ rect1 topLeft.
p2 _ rect1 bottomLeft.
p3 _ rect1 bottomRight.
p4 _ rect1 topRight.
(Form dotOfSize: 5) displayAt: p1.
(Form dotOfSize: 5) displayAt: p2.
(Form dotOfSize: 5) displayAt: p3.
(Form dotOfSize: 5) displayAt: p4.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「leftCenter/rightCenter/topCenter/bottomCenter」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「leftCenter/rightCenter/topCenter/bottomCenter」を取得＆表示。
--------------------------------------------
p1 _ rect1 leftCenter.
p2 _ rect1 rightCenter.
p3 _ rect1 topCenter.
p4 _ rect1 bottomCenter.
(Form dotOfSize: 5) displayAt: p1.
(Form dotOfSize: 5) displayAt: p2.
(Form dotOfSize: 5) displayAt: p3.
(Form dotOfSize: 5) displayAt: p4.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「extent」
「extent」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: rect1 extent.
--------------------------------------------
■
「width」
「width」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: rect1 width.
--------------------------------------------
■
「height」
「height」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: rect1 height.
--------------------------------------------
■
「boundingBox」
「boundingBox」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: rect1 boundingBox.
--------------------------------------------
■
「corners」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「corners」を取得＆表示。
--------------------------------------------
pts _ rect1 corners.
pts do: [: p | (Form dotOfSize: 5) displayAt: p].
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「innerCorners」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「innerCorners」を取得＆表示。
--------------------------------------------
pts _ rect1 innerCorners.
pts do: [: p | (Form dotOfSize: 5) displayAt: p].
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「area」
「area」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: rect1 area.
--------------------------------------------
■
「insetBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「insetBy」を取得＆表示。
--------------------------------------------
r _ rect1 insetBy: 20.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「insetOriginBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「insetOriginBy」を取得＆表示。
--------------------------------------------
r _ rect1 insetOriginBy: 10 cornerBy: 30.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「expandBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「expandBy」を取得＆表示。
--------------------------------------------
r _ rect1 expandBy: 20.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「extendBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「extendBy」を取得＆表示。
--------------------------------------------
r _ rect1 extendBy: 20.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「outsetBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「outsetBy」を取得＆表示。
--------------------------------------------
r _ rect1 outsetBy: 20.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「adjustTo」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「adjustTo」を取得＆表示。
--------------------------------------------
r _ rect1 adjustTo: (0@0 extent: 30@30) along: #right.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「flipBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「flipBy」を取得＆表示。
--------------------------------------------
r _ rect1 flipBy: #vertical centerAt: rect1 center + 10.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「rotateBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「rotateBy」を取得＆表示。
--------------------------------------------
r _ rect1 rotateBy: #left centerAt: rect1 center.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「scaleBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「scaleBy」を取得＆表示。
--------------------------------------------
r _ rect1 scaleBy: 2.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「scaleFrom」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「scaleFrom」を取得＆表示。
--------------------------------------------
rect2 _ 150@150 extent: 150@100.
r _ rect1 scaleFrom: rect1 to: rect2.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「translateBy」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
「translateBy」を取得＆表示。
--------------------------------------------
r _ rect1 translateBy: 10.
Display border: r width: 2.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
もうひとつ四角を追加して２つの四角形の関係を見ていくです。
--------------------------------------------
Display border: rect1 width: 1.
--------------------------------------------
--------------------------------------------
rect2 _ 150@150 extent: 150@100.
Display border: rect2 width: 1.
--------------------------------------------
■
「intersect」
「intersect」を取得＆表示。
--------------------------------------------
mRect _ rect1 intersect: rect2.
Display border: mRect width: 3.
--------------------------------------------
画面をお掃除
--------------------------------------------
Display restore.
--------------------------------------------
■
「intersects」
「intersects」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: (rect1 intersects: rect2).
--------------------------------------------
■
「merge」
四角形を表示しなおす。
--------------------------------------------
Display border: rect1 width: 1.
Display border: rect2 width: 1.
--------------------------------------------
「merge」を取得＆表示。
--------------------------------------------
mRect _ rect1 merge: rect2.
Display border: mRect width: 3.
--------------------------------------------
■
「containRects」
「containRects」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: (rect1 containsRect: rect2).
--------------------------------------------
■
「containPoint」
「containPoint」を取得＆トランスクリプトに表示。
--------------------------------------------
Transcript cr; show: (rect1 containsPoint: 120@120).
--------------------------------------------
下の入力ボックスに書き込んで
”add to the page”
ボタンで登録出来ます。
修正したい場合はページ左のアイコンの
”edit”
で出てくる画面で編集可能です。
ページ左のアイコンの
”uploads”
で画像（JPEG,GIF,PNG）のアップロードもできます。
Link to this Page
Techo+Scamperで遊ぶ
last edited on 20 October 2014 at 10:08:28 am by localhost
