The Green Shoes Manual 1.1.357

Element Creation

アプリケーションをそのままにして並列で実行するアニメーションタイマーを開始します。 fpsは秒ごとのフレームの数です。 この数は付属するブロックが1秒に何回呼ばれるのかを決定します。

このブロックはframeの数が与えられます。 frameの数はゼロから始まり、そのブロックが何フレームのアニメーションを表示したのかを 教えます。

 Shoes.app do
   counter = para "STARTING"
   animate 24 do |frame|
     counter.replace "FRAME #{frame}"
   end
 end

上記のアニメーションは1秒間に24回表示されます。 数が与えられないなら、fpsのデフォルトは10です。

色（またはパターン）を指定して背景（Background）要素を描きます。 パターンは色、グラデーションまたは画像です。色と画像は背景全体に敷き詰めます。 グラデーションは背景を塗りつぶすように伸びます。

注意してください: 背景は実際には要素であり、スタイルではありません。 HTMLは背景をスタイルのようにあつかいます。 それはすべての箱は一つの背景だけを持てることを意味します。 Green Shoesは背景の要素を重ねることができます。

 Shoes.app do
   background black
   background white, width: 50
 end

上記の例は二つの背景を塗ります。 まず、黒い背景がアプリケーションの表面のエリア全体に塗られます。 そして、50ピクセルの白い縞が左側にそって塗られます。

バナー（Banner）のテキストブロックを作成します。 Green Shoesは自動的に48ピクセルの大きさにテキストを整形します。

色（またはパターン）を指定して枠線（Border）の要素を描きます。 パターンは色、グラデーションまたは画像です。色と画像は枠線全体に敷き詰めます。 グラデーションは背景を塗りつぶすように伸びます。

注意してください: 背景のように、枠線は実際には要素であり、スタイルではありません。 HTMLは背景や枠線をスタイルのようにあつかいます。 それはすべての箱は一つの枠線だけを持てることを意味します。 Green Shoesはテキストブロック、画像、他のすべてのものにそって、枠線や背景の要素を 重ねることができます。

表面にわたってメッセージテキスト（text）の書かれた押しボタンを追加します。 ボタンが押されたときに呼ばれる、任意のブロックを取り付けることができます。

キャプション（Caption）テキストブロックを作成します。 Green Shoesは14ピクセルの大きさにこのテキストを整形します。

チェックボックスを追加します。

コード（Code）のテキストの一部を作成します。 このテキストはデフォルトで等幅フォントになります。

デフォルトで中央に1本の棒線を引いてテキストを削除した、 削除された（Del）（"deleted"の省略形）テキストの一部を作成します。

（まさに windowメソッドを実効したように）新しいアプリケーションのウィンドウを 開きますが、そのウィンドウはダイアログボックスの外観を与えられます。

注意: Green Shoesはdialogメソッドをサポートしていません。

スロットに大きなマルチラインのテキストエリアを追加します。 このtextはオプションでこの箱の開始時に与えられる文字列です。 オプションのブロックをここに取り付けることができ、これはボックスのテキストに対するどんな種類の ユーザの変更でも呼び出されます。

accepts_tabにtrueを設定するとタブが挿入できます。 accepts_tabにfalseを設定するとタブによるフォーカス移動ができます。 デフォルトはfalseです。

 Shoes.app do
   edit_box
   edit_box text: "HORRAY EDIT ME"
   edit_box text: "small one",
     width: 100, height: 160
 end

スロットに一行のテキストボックスを追加します。 このtextはオプションでこの箱の開始時に与えられる文字列です。 オプションのブロックをここに取り付けることができ、これはボックスのテキストに対するどんな種類の ユーザの変更でも呼び出されます。

Em（"emphasized"の省略形）テキストの一部を作成し、これはデフォルトでイタリック体で 整形されます。

animateメソッドとよく似たタイマーですが、より非常に遅いです。 このタイマーは与えられた数の秒（seconds）で、取り付けられたブロックを実行します。 そのため、例えば5秒毎にwebサイトを確認する必要があるなら、実際にwebサイトにpingを 打つコードを含むブロックと共にevery(300)を呼び出します。

フロー（flow）はGreen Shoesの要素を配置できる目に見えない箱（または"スロット"）です。 フローとスタックのどちらもメインのSlotsのページでとても詳細に説明されます。

フローは要素を水平にまとめます。ものを垂直に積み重ねたままにするために stackを利用するところで、フローはそのコンテンツをページの端から端にわたって 配置します。いったんページの最後に到達したら、フローは要素の新しい行を開始します。

写真を表示するためにImageの要素を作成します。 PNG、JPEGそしてGIFのフォーマットが許されます。

pathはファイルのパスまたはURLです。すべての画像はメモリに一時的にキャッシュされ、 リモートの画像はローカルのユーザの個人的なShoesディレクトリにもキャッシュされます。 リモートの画像はバックグラウンドでロードされます；ブラウザと同様に、画像はすぐには 表示されませんが、それらがロードされたときに表示されます。

注意: Green Shoesは上述のローカルのユーザの個人的なShoesディレクトリへの キャッシュをサポートしていません。

画像の幅と高さを素早く手に入れます。 画像はキャッシュにロードされず表示もされません。

緊急の注意：このメソッドはリモートの画像（ハードディスクドライブからではなくHTTPにより ロードされた）には利用できません。

一本の下線のGreen Shoesスタイルである、Ins（"inserted"の省略形）テキストの一部を 作成します。

題名（Inscription）のテキストブロックを作成します。 Green Shoesは10ピクセルの大きさにこのテキストを整形します。

一本の下線を持ち線の色を#06E（青色）に整形したリンクテキストブロックを作成します。 デフォルトのリンクホバースタイルは一本の下線を持ち線の色を#039（ダークブルー）に整形します。

この形式でもリンクテキストブロックを作成できます。 この場合、ユーザがリンクテキストをクリックするとブロック内のコードが実行されます。

itemsの配列のすべてのエントリを含むドロップダウンリストボックスを追加します。 オプションでブロックを取り付けることができ、これはユーザがボックスの項目を選択したら 呼び出されます。

 Shoes.app do
  stack  margin: 10 do
   para "Pick a card:"
   list_box items: ["Jac", "Ace", "Jok"] do |item|
    @p.text = "#{item} was picked!"
   end
   @p = para
  end
 end

選択された文字列をを得るためにListBox#textを呼び出します。 より多くのヘルプはリストボックス（ListBox）のセクションのネイティブコントロールを見てください。

プログレスバーを追加します。

12ピクセルの大きさに整形する、Para（"paragraph"の省略形）テキストブロックを作成します。

ラジオボタンを追加します。グループ名（group name）が与えられたら、ラジオボタンは グループの一部だとみなされます。同じグループのラジオボタンのうちで、 1つだけをクリックすることができます。（もしグループ名が与えられなければ、そのラジオボタンは 同じスロットの他のすべてのラジオボタンとグループ化されます）

デフォルトでスタイル付けされていない、Spanテキストの一部を作成します。

 Shoes.app do
   tagline "\n", 'hello ' * 5, 
     span(em('Green Shoes'), size: 8, rise: 15)
 end

新しいスタックを作成します。スタックはスロットの一種です。 （スタックとフローの完全な説明はメインのSlotsのページを見てください。）

要するに、スタックは要素を配置するための目に見えない箱（"スロット"）です。 スタックにボタンや画像などを追加して、それらは垂直に積み上げられます。 そう、それらは重なります。

デフォルトで太字に整形された、Strongテキストの一部を作成します。

デフォルトでテキストは10ピクセル（位置を）下げられx-smallフォントに整形された、 Sub（"subscript"の省略形）テキストの一部を作成します。

サブタイトル（Subtitle）テキストブロックを作成します。 26ピクセルの大きさにこのテキストを整形します。

デフォルトでテキストは10ピクセル（位置を）上げられx-smallフォントに整形された、 Sup（"superscript"の省略形）テキストの一部を作成します。

タグライン（Tagline）テキストブロックを作成します。このテキストを18ピクセルの大きさに整形します。

1回だけのタイマーです。少しの秒（または分、時）後にいくらかのコードの実行をスケジュールしたい なら、ここにブロックとしてコードを取り付けることができます。

今から5秒後にアラートボックスを表示するためには：

 Shoes.app do
   timer 5 do
     alert "Your five seconds are up."
   end
 end

タイトル（Title）テキストブロックを作成します。これらの要素を34ピクセルの大きさに整形します。

動画を埋め込みます。音声を再生します。

新しいアプリケーションウィンドウを開きます。 このメソッドは初めにアプリケーションを開始するために使われるShoes.appメソッドと ほとんど同一です。違いはwindowメソッドは新しいウィンドウのownerプロパティを 設定することです。（普通のShoes.appはそのownerをnilに設定します。）

そのため、新しいウィンドウのownerはウィンドウを開始したShoes::Appに設定されるでしょう。 この方法により子のウィンドウが親を呼べます。

 Shoes.app title: "The Owner" do
  button "Pop up?" do
   window do
    para "Okay, popped up from [#{owner.inspect}]."
   end
  end
 end

Next: Events