mieki256's diary

◎ 環境構築その1。 :

◎ 環境構築の続き。複数のRubyバージョンを共存させる。 :

ruby hoge.rb

> irb
irb(main):001:0> require 'dxruby'
=> true
irb(main):002:0> DXRuby::VERSION
=> "1.5.19dev"
irb(main):003:0> exit

◎ DXRubyWSのサンプルを動かしてみる。 :

DXRubyWS-master.zip を解凍すると、sampleフォルダが入ってる。中に入って、一通り動かしてみる。

ruby minsample.rb

色んなウィジェット(GUI部品/コントロール)が出てきた。

• ボタン
• ラベル
• テキストボックス
• ドロップダウンリスト
• チェックボックス
• ラジオボタン
• リストボックス
• リストビュー

少なくとも、これだけのウィジェット種類が、用意されているのだな…。

各ウインドウは、位置変更のみならず、サイズ変更もできる。サイズ変更に追随しないレイアウトと、サイズ変更に追随するレイアウトが実現できているらしい。

ただし、一番大元の、背景色が黒のウインドウは、サイズ変更ができなかった…。

DXRubyを使ったスクリプトも、ウインドウサイズを変更すると中の描画がおかしくなる時があるので、DXRubyWSも似たような制限があるのかもしれない。が、それってつまり、デスクトップサイズに合わせてウインドウサイズを変更できない、作業しやすいウインドウサイズに変更できないということで、GUIアプリを作る場合は少々厳しい場面が出てくるような気もするのだけど、今はそのあたり考えないことにする。

ruby rubima.rb

ウインドウの中で、おそらくは60FPSのゲームが動いてる…。敵オブジェクトをクリックすると、そのオブジェクトが選択されて、右側のウインドウ内に敵の情報(HP)が表示される。自爆ボタンを押すと選択中の敵が爆発して画面から消えたので、ゲーム内のオブジェクトに対して外部から制御ができるよ、というデモなのかもしれない。

ruby rubima3.rb

ウインドウの中でゲームを動かしながら、BGの表示位置を別ウインドウ内に表示できている。しかも、タイルチップを選んで、真ん中のウインドウ内でBGマップに書き込むと、ゲーム内のBG表示もソレに合わせて変化する。

ゲームを動かしながら、リアルタイムでその見た目を変更できてしまうあたり、凄いというか、面白いというか。Unityも、ここまではできなかったような気がする。…と言っても、Unityは、GUIでかなりの設定・指定ができるあたりが売りだろうから、比べるのもおかしい気がするけど。提供してる便利さが、そもそも違うというか。

ruby soundblock.rb

音の波形っぽいものが出てきた。Playボタンを押すと音が鳴る。スライダー、スピンボタン(スピンボックス？)が表示されていて、それぞれを変更してからPlayボタンを押すと音が変化することが分かる。

ソース内には、「簡易FM音源」と書いてあった。FM音源…懐かしい…。いや、今もDTMの世界ではフツーに現役ですが。

ruby splitcontainertest.rb

もしかすると、コンテナを実現できているというデモだろうか…。「パネルE」と書かれてる部分はグループボックス？ ラベル付パネル？ なのかもしれない。パネルの中に、複数のウィジェットを配置できますよ、ということなのかな。

ruby statuswindow.rb

これは何のデモか分からなかった…。

ruby tabtest.rb

タブの表示ができていて、かつ、スクロールバーもついていて中身をスクロールできる。

ruby test_autolayout.rb

各ウインドウのサイズを変更すると、中のウィジェットのサイズもソレに合わせて追随する。自動レイアウトのデモだろうか。


てなわけで、既に色々なウィジェットが使えそうなことが伝わってきた。

長くなってきたので、続きは別記事に分けて書こう…。

◎ 最も簡単なコード。 :

_tuto01.rb

require_relative './lib/dxrubyws'

Window.loop do
  WS.update
end

真っ黒な画面が表示された。

要するに、DXRubyWS を使いたい時は、

• 最初のほうに、「require_relative './lib/dxrubyws'」と書いておく。
• 最後のほうで、「Window.loop do」「WS.update」「end」と書いておく。

としておけばいいんだよ、ってことなんだろう…。

◎ マウスに反応させてみる。 :

_tuto02.rb

require_relative './lib/dxrubyws'

font = Font.new(32)

WS.desktop.add_handler(:mouse_push) do
  # マウスボタンが押されたら(「:mouse_push」のシグナルが来たら)…
  
  # 画面に「click!」と表示する
  Window.draw_font(0, 0, "click!", font)
end

Window.loop do
  WS.update
end

マウスボタンを押すと、画面に「click!」と表示された。たしかに、マウスに反応している。

DXRubyWS は、 _イベントドリブン で書いていく、らしい。…イベントドリブンって何だ？ 何かのイベントが起きた時、そのイベントに対応した処理をするよ、ってこと。

例えば、このサンプルの場合は、「マウスボタンが押された」というイベントが発生したら、「画面に文字を描画する」という処理をしろや、と、WS.desktop.add_handler 〜 end のあたりで設定してある。だから、マウスボタンを押すと、画面に「click!」と表示されたわけで。

もし、イベントドリブンでは無い書き方をするとしたら…。例えば DXRuby で同じ処理を書くとしたら、たぶんこうなる。

_tuto02_b.rb

require 'dxruby'

font = Font.new(32)

Window.loop do
  
  # マウスボタンが押されたか、毎フレームチェックし続けて
  if Input.mousePush?(M_LBUTTON)
    # ボタンが押されてたら、画面に「click!」と表示する
    Window.draw_font(0, 0, "click!", font)
  end
  
end

毎フレーム、毎フレーム、「マウスボタンが押されたか？」「マウスボタンが押されたか？」と、飽きもせず、毎回毎回、延々と監視し続けて、もし押されてたら…という感じになる。

まあ、おそらく内部的には、イベントドリブンとやらも似たようなことを ―― 何かしらをずっと監視し続けて、とかやってると思うのだけど。プログラムを書く人間様としては、「○○が起きた時に、○○せよ」てな感覚でソースを書いていったほうが分かりやすいところがあるので、イベントドリブンなる概念があるのだろうな、などと想像してみたり。人間様が分かるように、面倒臭いところを上手に隠して、分かりやすいところだけ提供するってのは、プログラミングにおいては大事。

◎ コントロールを作って、マウスで動かす。 :

コントロールって何だ？ GUI部品、ウィジェットのこと。ボタンとか、ラベルとか、チェックボックスとか、そういうGUI部品を、ウィジェットとかコントロールとか呼んだりする、のだと思います。たぶん。ちょっと自信ないけど。

require_relative './lib/dxrubyws'

control = WS::WSControl.new(200, 100, 100, 100)
control.image = Image.new(100, 100, C_WHITE)
WS.desktop.add_control(control)

Window.loop do
  WS.update
end

画面の真ん中に、白い何かが表示された。たぶん、この白い何かが、コントロール、なんだろう。

このサンブルの場合、

• WS::WSControl.new() でコントロールを作って、
• Image.new() で真っ白な画像を作り、ソレをコントロールが持ってる画像として設定して
• WS.desktop.add_control() で、画面に登録。

しているのだろうな…。

このコントロールを、マウスで動かしてみる。

_tuto03_b.rb

require_relative './lib/dxrubyws'

control = WS::WSControl.new(200, 100, 100, 100)
control.image = Image.new(100, 100, C_WHITE)

control.extend WS::Draggable
control.add_handler(:drag_move) do |obj, dx, dy|
  control.x += dx
  control.y += dy
end

WS.desktop.add_control(control)

Window.loop do
  WS.update
end

白い画像を、マウスドラッグで移動できるようになった。

そろそろ分からなくなってきた。以下が追加された部分。

control.extend WS::Draggable
control.add_handler(:drag_move) do |obj, dx, dy|
  control.x += dx
  control.y += dy
end

tutorial01.txt によると…。control.extend WS::Draggable てのが、サポートモジュールとやらを使う指定っぽい。名前からしてマウスドラッグ関係の何かなんだろうな。

:drag_move というシグナルが来たら(イベントが発生したら)、マウスカーソルの移動量を得られるから、それをコントロールの座標値に加算してやることで、コントロールの表示位置が変更できている、のだろう。

◎ ドラッガブル豆腐クラスを作る。 :

tutorial01.txt によると、この後、「ドラッガブル豆腐クラス」とやらを作ってみるよ、てことになってるのですが。ここで問題発生。

ちなみに、豆腐って何？ …DXRubyでは、例の白い画像を「豆腐」と呼んでることが多くて。要するに、「ドラッガブル豆腐」＝「マウスでドラッグできる白い画像」、なんだと思います。たぶん。

_tuto04.rb

require_relative './lib/dxrubyws'

module WS
  class DraggableTofu < WSControl
    include Draggable

    def initialize(x, y, width, height)
      super
      self.image = Image.new(width, height, C_WHITE)
      self.add_handler(:drag_move, self.method(:on_drag_move))
    end

    def on_drag_move(obj, dx, dy)
      self.x += dx
      self.y += dy
    end
  end
end

tofu = WS::DraggableTofu.new(200, 100, 100, 100)
WS.desktop.add_control(tofu)

Window.loop do
  WS.update
end

動かしてみたら、エラーが。

> ruby tuto04.rb

tuto04.rb:17:in `on_drag_move': wrong number of arguments (2 for 3) (ArgumentError)
        from C:/home/prg/ruby/test_dxruby/dxrubyws_test/lib/module.rb:132:in `on_mouse_move'
        from C:/home/prg/ruby/test_dxruby/dxrubyws_test/lib/core.rb:112:in `mouse_event_dispatch'
        from C:/home/prg/ruby/test_dxruby/dxrubyws_test/lib/dxrubyws.rb:118:in `update'
        from C:/home/prg/ruby/test_dxruby/dxrubyws_test/lib/dxrubyws.rb:165:in `update'
        from tuto04.rb:28:in `block in <main>'
        from tuto04.rb:27:in `loop'
        from tuto04.rb:27:in `<main>'

on_drag_move ってところで、何かを間違えてるっぽいけど…。

_Rubyのエラーメッセージwrong number of arguments (a for b)の意味 - Qiita によると、

tuto04.rb:17:in `on_drag_move': wrong number of arguments (2 for 3) (ArgumentError)

てのは、3つ引数が来るはずなのに、2つ来たよ、という意味なのかな…。

つまり、def on_drag_move(obj, dx, dy) は、obj, dx, dy の、3つの引数が書いてあるけど、この名前のメソッドは、本当は2つしか引数が無いはずやで？ 間違えてるで？ みたいな？

lib/module.rb を開いて、on_drag_move で検索してみたり。

    def on_drag_move(tx, ty)
      signal(:drag_move, tx, ty)
    end

うむ。引数は2つですね。なら、2つに修正すればいいのかな。

_tuto04_b.rb

require_relative './lib/dxrubyws'

module WS
  class DraggableTofu < WSControl
    include Draggable

    def initialize(x, y, width, height)
      super
      self.image = Image.new(width, height, C_WHITE)
      self.add_handler(:drag_move, self.method(:on_drag_move))
    end

    # def on_drag_move(obj, dx, dy)
    def on_drag_move(dx, dy)
      self.x += dx
      self.y += dy
    end
  end
end

tofu = WS::DraggableTofu.new(200, 100, 100, 100)
WS.desktop.add_control(tofu)

Window.loop do
  WS.update
end

動いた。豆腐をマウスでドラッグできてる。

要するに、こんな感じでコントロール(ウィジェット/GUI部品)を、クラスとして作って増やしていけますよ、ということなのかな…。

これで _tutorial01.txt の内容は一通り試せた。

_tutorial02.txt では標準GUIの使い方が説明されているらしい。明日、眺めてみることにしよう…。

◎ 最も簡単なコード。 :

_tuto21.rb

require_relative './lib/dxrubyws'
require_relative './lib/standardgui'

WS.desktop.add_control(WS::WSWindow.new(100,100,300,200,"TutorialWindow"))

Window.loop do
  WS.update
end

ウインドウが表示された。マウスでドラッグ移動、サイズ変更ができるし、閉じるボタンを押せばウインドウを閉じることもできる。

標準GUIを使う時は、

require_relative './lib/standardgui'

を、最初のほうに書いておくものらしい。

WS::WSWindow.new() でウインドウを作って、WS.desktop.add_control() で画面に登録しているのかな。たぶん。

◎ ボタンを配置して、ボタンを押したら反応させる。 :

まずは、ボタンを配置。

_tuto22.rb

require_relative './lib/dxrubyws'
require_relative './lib/standardgui'

# ウインドウを生成
window = WS::WSWindow.new(100,100,300,200,"TutorialWindow")

# 画面に登録
WS.desktop.add_control(window)

# ボタンを生成
button = WS::WSButton.new(10,10,100,20,"TutorialButton")

# ウインドウ(のクライアント領域)に登録
window.client.add_control(button)

Window.loop do
  WS.update
end

ボタンを表示することができた。

tutorial02.txt には…。

• WSWindowオブジェクトはコンテナの集合体。タイトルバーとクライアント領域に分かれてる。
• ユーザがコントロールを配置するのはクライアント領域のほう。
• クライアント領域は、WSWindow#clientでアクセスすることができる。

と書いてある。

ボタンに反応させてみる。

_tuto23.rb

require_relative './lib/dxrubyws'
require_relative './lib/standardgui'

window = WS::WSWindow.new(100,100,300,200,"TutorialWindow")
WS.desktop.add_control(window)

button = WS::WSButton.new(10,10,100,20,"TutorialButton")
window.client.add_control(button)

# ボタンをクリックしたときに呼ばれる処理を登録
button.add_handler(:click) do
  # ボタンの表示位置を、右下に10ドット変更する
  button.x += 10
  button.y += 10
end

Window.loop do
  WS.update
end

ボタンを押すと、ボタンの表示位置が変わっていく。たしかに、ボタンが反応してる。

ボタンがクリックされたら ―― :click シグナルが来たら、処理がされるように設定されてる。

◎ TutorialWindowクラスを作ってみる。 :

_tuto24.rb

require_relative './lib/dxrubyws'
require_relative './lib/standardgui'

module WS
  class TutorialWindow < WSWindow
    def initialize(*args)
      super
      button = WS::WSButton.new(10,10,100,20,"TutorialButton")
      client.add_control(button, :btn)
      button.add_handler(:click, self.method(:on_click))
    end

    def on_click(obj, tx, ty)
      client.btn.x += 10
      client.btn.y += 10
    end
  end
end

window = WS::TutorialWindow.new(100,100,300,200,"TutorialWindow")
WS.desktop.add_control(window)

Window.loop do
  WS.update
end

tuto23.rb と同じことを、クラスを作ることで実現できた。

これで、 _tutorial02.txt の内容を一通り試せた。

◎ 画像ボタンを1つだけ表示。 :

_sample/minsample.rb を眺めると、WS::WSImageButton なるものがあるらしい。おそらくコレが、名前からして、画像ボタンなのだろう…。

_lib/StandardGUI/button.rb の中に、WSImageButton の定義がある。ソレによると…。

WS::WSImageButton.new(tx, ty, image, width, height, caption)

x : 表示位置 x
y : 表示位置 y
image : 画像オブジェクト(DXRuby の Imageオブジェクト)
width : 横幅。nil なら自動調整
height : 縦幅。nil なら自動調整
caption : キャプション文字列

こんな感じなのだろう。たぶん。おそらく。

サンプルソースを書いてみることにしよう。以下の画像を使って、画像ボタンを表示してみる。この画像は、CC0 / Public Domain ってことで。

_imagebutton_test.rb

# ImageButton(画像ボタン)を表示してみる

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  # 画像ボタンを表示してみるウインドウのクラス
  class ImageButtonWindow < WSWindow

    # コンストラクタ。初期化処理
    def initialize(*args)
      super

      # 画像を用意する。アイコンが、8x3個、並んでる
      imgs = Image.loadTiles("toolbar.png", 8, 3)

      # 画像ボタンを生成
      # 引数として、(x, y, Imageオブジェクト, ボタン横幅, ボタン縦幅, caption) を渡す
      # 横幅、縦幅の指定が nil なら、画像サイズ＋αで調整してくれる
      x, y = 10, 10
      w, h = nil, nil
      imgbtn = WS::WSImageButton.new(x, y, imgs[1], w, h, "Open")

      # 画像ボタンをクライアント領域に追加
      client.add_control(imgbtn, :btn)

      # ボタンが押された時の処理を設定
      imgbtn.add_handler(:click, self.method(:on_click))
    end

    # ボタンを押した時の処理
    def on_click(obj, tx, ty)
      # ファイル選択ダイアログを開いてみる
      filter = [
        ["PNGファイル(*.png)", "*.png"],
        ["すべてのファイル(*.*)", "*.*"]
      ]
      filepath = Window.openFilename(filter, "ファイルを選択してください")

      unless filepath
        # キャンセルされた
        puts "Cancel."
      else
        # ファイルが選ばれた
        puts filepath
      end
    end
  end
end

# ウインドウを生成
window = WS::ImageButtonWindow.new(8, 8, 320, 96, "ImageButtonWindow")

# 画面に追加
WS.desktop.add_control(window)

Window.loop do
  WS.update
end

画像ボタンが表示できた。

マウスカーソルをボタンの上に持ってくると、説明のためのバルーン表示(?)までしてくれるのだな…。素晴らしい。

けど、マウスカーソルでバルーン表示が隠れちゃって、文字が読めないから、イラッとするのだな…。微妙に残念。バルーンの表示位置については、改善が必要な予感。

◎ 画像ボタンをたくさん表示。 :

画像ボタンが表示できたので、ツールバーだか、ツールボックスだか、そんな感じのウインドウも表示してみたい。

_imagebutton_test2.rb

# ImageButton(画像ボタン)を表示して、ツールボックスっぽく並べてみる

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  # ツールボックスっぽく表示してみるウインドウクラス
  class ToolBoxWindow < WSWindow

    # コンストラクタ。初期化処理
    def initialize(*args)
      super

      # アイコン画像を読み込む。アイコンが、8x3個、並んでる
      imgs = Image.loadTiles("toolbar.png", 8, 3)

      # アイコン種類を定義
      icon_list = [
        # 画像番号, caption, 押された時の処理名
        [0, "New", :create_new_data],
        [1, "Open", :load_data],
        [2, "Save", nil],
        [3, "Export", nil],

        [11, "Zoom +", nil],
        [12, "Zoom -", nil],
        [13, "Brush Size +", nil],
        [14, "Brush Size -", nil],

        [17, "Swap Fg/Bg Color", nil],
        [16, "Grid on/off", nil],
        [15, "Undo", nil],

        [4, "Pen", nil],
        [5, "Erase", nil],
        [6, "Line", nil],
        [7, "Rectangle", nil],

        [8, "Rectangle Fill", nil],
        [9, "Fill", nil],
        [10, "Text", nil],
      ]

      # アイコンの数だけループする
      x = 0
      y = 0
      i = 0
      icon_list.each do |d|
        idx, caption, job_sym = d

        # マウスカーソルでバルーン表示が隠れてしまうので、少し修正
        caption = "    " + caption + " "

        # 画像ボタンを生成
        # 引数として、(x, y, Imageオブジェクト, ボタン横幅, ボタン縦幅, caption) を渡す
        # 横幅、縦幅の指定が nil なら、画像サイズ＋αで調整してくれる
        imgbtn = WS::WSImageButton.new(x, y, imgs[idx], nil, nil, caption)

        # 画像ボタンをクライアント領域に追加
        client.add_control(imgbtn, :btn)

        if job_sym != nil
          # ボタンが押された時の処理を設定
          imgbtn.add_handler(:click, self.method(job_sym))
        end

        i += 1

        # 次のボタンの表示位置を決める
        if i % 11 == 0
          x = 0
          y += imgbtn.height
        else
          x += imgbtn.width
        end
      end
    end

    # Newボタンを押した時の処理
    def create_new_data(obj, tx, ty)
      puts "create new data"
    end

    # Openボタンを押した時の処理
    def load_data(obj, tx, ty)

      # ファイル選択ダイアログを開いてみる
      filter = [
        ["PNGファイル(*.png)", "*.png"],
        ["すべてのファイル(*.*)", "*.*"]
      ]
      filepath = Window.openFilename(filter, "ファイルを選択してください")

      unless filepath
        # キャンセルされた
        puts "Cancel."
      else
        # ファイルが選択された
        puts filepath
      end
    end
  end
end

# ツールボックスウインドウを生成
window = WS::ToolBoxWindow.new(8, 8, 320, 96, "ToolBoxWindow")

# 画面に追加
WS.desktop.add_control(window)

Window.loop do
  WS.update
end

それらしい表示ができた。

ウインドウのサイズを、値を直接指定して決めてるあたりが、なんだかダサイ…。

• ボタンをずらずら並べていったら、自動でウインドウサイズも変わってほしいし、
• 逆に、ウインドウサイズを変更したら、ボタンが横に並ぶ個数も自動で変わったりしてほしい。

けど、そのあたりの処理は、今後の課題ってことで。

WS::WSCheckBox.new(tx, ty, width, caption)

tx : 表示位置 x
ty : 表示位置 y
width: 横幅
caption : キャプション文字列

• checked てのが、チェックされてるかされてないかを保持している変数らしい。
• 状態が変化すると(チェックが入れられたり外されたりすると)、:change というシグナルが来るっぽい。

# DXRubyWSでチェックボックスを表示してみるテスト

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  # チェックボックスを表示してみるウインドウクラス
  class CheckBoxWindow < WSWindow

    # コンストラクタ。初期化処理
    def initialize(*args)
      super

      @chkbox = []

      chkbox_list = [
        "Character",
        "Fg Color",
        "Bg Color",
      ]

      x, y = 8, 8
      w, h = 0, 0
      chkbox_list.each do |caption|

        # チェックボックスを生成
        # (x, y, width, caption) を渡す
        cb = WS::WSCheckBox.new(x, y, 120, caption)

        # あらかじめチェックを入れておく
        cb.checked = true

        # クライアント領域に追加
        client.add_control(cb, :chkbox)

        # 状態が変更された時の処理を登録
        cb.add_handler(:change, self.method(:on_change))

        # 後で参照するかもしれないから一応記憶しておく
        @chkbox.push(cb)

        # 次の表示位置を求める
        y += cb.height + 4
      end
    end

    # 状態が変更された時の処理
    def on_change(obj, checked)
      puts "#{obj.caption}, #{checked}"
    end
  end
end

# ウインドウを生成して画面に登録
window = WS::CheckBoxWindow.new(8, 8, 120, 120, "CheckBoxWindow")
WS.desktop.add_control(window)

Window.loop do
  WS.update
end

wget http://www.zdziarski.com/blog/wp-content/uploads/2010/02/mod_evasive_1.10.1.tar.gz
tar zxvf mod_evasive_1.10.1.tar.gz
cd mod_evasive

# /usr/bin/apxs -i -a -c mod_evasive20.c

mkdir /var/log/mod_evasive

# この行は自動で追加されているはず
LoadModule evasive20_module   /usr/lib/apache2/modules/mod_evasive20.so

# 同一ページに2秒間で3回アクセスされたら、
# あるいは、同一サイトに1秒間で30回アクセスされたら、
# 180秒間ブロックする例
<IfModule mod_evasive20.c>
    DOSHashTableSize 3097
    DOSPageCount 3
    DOSSiteCount 30
    DOSPageInterval 2
    DOSSiteInterval 1
    DOSBlockingPeriod 180
    DOSWhitelist 127.0.0.1
    DOSWhitelist 192.168.1.*
    DOSLogDir "/var/log/mod_evasive"
    DOSEmailNotify "-s 'DoS Alert' hoge@fuga.com"
</IfModule>

# apache2 -t
Syntax OK

# service apache2 restart

◎ テストスクリプトが動かない。 :

# test.pl: small script to test mod_dosevasive's effectiveness

use IO::Socket;
use strict;

for(0..100) {
    my $response;

    my $SOCKET = new IO::Socket::INET( Proto => "tcp",
                                       PeerAddr => "127.0.0.1:80");

    if (! defined $SOCKET) { die $!; }

    print $SOCKET "GET /?$_ HTTP/1.0\n\n";
    $response = <$SOCKET>;
    print $response;
    close($SOCKET);
}

# DXRubyWSでテキストボックスを表示してみるテスト

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  class TextBoxWindow < WSWindow

    def initialize(*args)
      super

      # テキストボックスを生成して追加
      x, y = 16, 16
      w, h = 200, 24
      @txtbox = WS::WSTextBox.new(x, y, w, h)
      client.add_control(@txtbox)

      # テキストボックスの内容を設定
      @txtbox.text = "320"

      # ボタンを生成して追加
      x += @txtbox.width
      w, h = 80, 24
      @btn = WS::WSButton.new(x, y, w, h, "Button")
      client.add_control(@btn)

      # ボタンが押された時の処理を登録
      @btn.add_handler(:click, self.method(:on_click))
    end

    # ボタンが押された時の処理
    def on_click(obj, tx, ty)
      # メッセージボックスを生成して画面に登録
      msgbox = WS::WSMessageBox.new("Message", "TextBox = #{@txtbox.text}")
      WS.desktop.add_control(msgbox)
    end

  end
end

window = WS::TextBoxWindow.new(8, 8, 360, 96, "TextBoxWindow")
WS.desktop.add_control(window)

Window.loop do
  WS.update
end

WS::WSTextBox.new(tx, ty, sx, sy)

◎ 2016/01/15追記。 :

• ゲーム画面を描画するための RenderTarget を生成して、グローバル変数に入れておく。
• ゲーム画面への描画は、そのグローバルなRenderTargetに対して行う。
• メインループの中で、そのグローバルな RenderTarget を、ゲーム画面用ウインドウのクライアントのイメージに対して描画してやる。

# DXRubyWSのウインドウ内に、60FPSで動くゲーム画面を表示してみるテスト
# sample/rubima.rb を参考に作成

require 'dxruby'
require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

# ----------------------------------------
# ゲーム画面用クラス
# ゲーム画面内で画像がバウンドするだけの処理
class GameMain

  attr_accessor :width, :height, :image

  # 初期化
  def initialize
    @x, @y = 100, 100
    @dx, @dy = 8, 4

    @width = 360
    @height = 480

    @image = Image.new(64, 64, C_WHITE)
  end

  # 更新
  def update

    # 座標に速度を加算
    @x += @dx
    @y += @dy

    # 画面外に出そうなら速度の向きを反転させる
    @dx *= -1 if (@x <= 0 and @dx < 0) or ((@x + @image.width) >= @width and @dx > 0)
    @dy *= -1 if (@y <= 0 and @dy < 0) or ((@y + @image.height) >= @height and @dy > 0)
  end

  # 描画
  def draw
    # グローバルなRenderTargetに対して描画してる
    $rt.draw(@x, @y, @image)
  end
end

# ----------------------------------------
# ウインドウシステム用のクラス定義
module WS

  # ----------------------------------------
  # ゲーム画面が表示されるウインドウ
  class GameWindow < WSWindow

    def initialize(*args)
      super
    end

    # サイズ変更されたら再描画
    def resize(*args)
      super
      self.client.image.draw(0, 0, $rt)

      # ゲーム画面サイズも変更しておく
      $gamemain.width = self.width
      $gamemain.height = self.height - 32
    end

    # 描画
    def draw
      super
    end
  end

  # ----------------------------------------
  # ゲーム画面ではないほうのウインドウ
  class DetailWindow < WSWindow

    def initialize(*args)
      super

      # ラベル生成と登録
      x, y, w, h = 8, 8, 100, 16
      @label = WSLabel.new(x, y, w, h, "TEST")
      self.client.add_control(@label)

      # ボタン生成と登録
      x, y, w, h = 8, 32, 150, 20
      button = WSButton.new(x, y, w, h, "画像読み込み")
      self.client.add_control(button)

      # ボタンが押された時の処理を登録
      button.add_handler(:click, self.method(:on_click))

      @count = 0
    end

    # 状態更新
    def update
      # カウントアップをラベルで表示してみる
      @label.caption = @count.to_s
      @count += 1
      super
    end

    # ボタンが押された時の処理
    def on_click(obj, tx, ty)
      # ファイル選択ダイアログを開く
      filter = [
        ["PNGファイル(*.png)", "*.png"],
        ["すべてのファイル(*.*)", "*.*"],
      ]
      filepath = Window.openFilename(filter, "画像ファイルを選択")
      if filepath
        # ゲーム画面用クラスの画像を差し替える
        $gamemain.image = Image.load(filepath)
      end
    end
  end
end


# ----------------------------------------
# ここから、ゲームのメイン処理

font = Font.new(24) # フォント生成

Window.width, Window.height = 800, 600 # 画面サイズ変更

# ゲーム画面を描画するための RenderTarget を生成して
# グローバル変数に入れておく
$rt = RenderTarget.new(360, 480, [0, 0, 0])

# ゲーム画面クラスを生成
$gamemain = GameMain.new()

# ゲーム画面用ウインドウを生成して画面に登録
gamewindow = WS::GameWindow.new(50,100,360,480)
WS::desktop.add_control(gamewindow, :gamewindow)

# ゲーム画面ではないウインドウを生成して画面に登録
detailwindow = WS::DetailWindow.new(450,100,200,200)
WS::desktop.add_control(detailwindow, :detailwindow)

# メインループ
Window.loop do
  break if Input.key_push?(K_ESCAPE) # Esc キーで終了

  # ここでゲームの処理をする
  $gamemain.update
  $gamemain.draw

  # ここまで来れば、グローバルなRenderTargetに、
  # ゲーム画面の内容が描画されてるはず

  # ゲーム画面用ウインドウに、グローバルなRenderTargetの内容を描画する
  WS.desktop.gamewindow.client.image.draw(0, 0, $rt)

  WS.update # ここで WS.update を呼んでる

  # 各種情報を画面に出力
  s = "CPU : #{Window.get_load.to_i} %"
  Window.draw_font(0, 0, s, font, :z => 100)
end

◎ ツールチップとバルーンって何が違うんだろう。 :

◎ viのカーソル移動について。 :

# 画像を読み込んで表示してみるテスト

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  # 画像選択ウインドウクラス
  class ImageSelectWindow < WSWindow

    # コンストラクタ。初期化処理
    def initialize(*args)
      super

      # ボタンを生成して登録
      x, y, w, h = 4, 4, 120, 24
      @btn = WSButton.new(x, y, w, h, "画像読み込み")
      client.add_control(@btn)
      @btn.add_handler(:click, self.method(:on_click))

      # タイトルバー上の閉じるボタンを無効化
      self.window_title.close_button = false

      # ESCキーで閉じないようにする
      @key_handler.delete(K_ESCAPE)

      # 次のウインドウ発生位置
      @x_pos = self.x
      @y_pos = self.y + self.height
    end

    # ボタンを押した時の処理
    def on_click(obj, tx, ty)
      # ファイル選択ダイアログを開いてみる
      filters = [
        ["画像ファイル(*.png;*.jpg;*.bmp)", "*.png;*.jpg;*.bmp"],
        ["すべてのファイル(*.*)", "*.*"]
      ]
      filepath = Window.openFilename(filters, "画像ファイルを選択")
      create_image_window(filepath) if filepath
    end

    # 画像を表示するウインドウを生成して画面に追加
    def create_image_window(filepath)
      img = Image.load(filepath)
      w, h = img.width, img.height
      bsname = File.basename(filepath)

      wdw = WS::ImageWindow.new(@x_pos, @y_pos, w + 48, h + 48, bsname)
      WS.desktop.add_control(wdw)
      wdw.image = img

      @x_pos += 32
      @y_pos += 32
    end
  end

  # 画像を表示するだけのウインドウクラス
  class ImageWindow < WSWindow

    attr_accessor :image

    def initialize(*args)
      super
      @image = nil
    end

    def draw
      x = (client.image.width - @image.width) / 2
      y = (client.image.height - @image.height) / 2
      client.image.draw(x, y, @image) if @image
      super
    end
  end

end

Window.width, Window.height = 1024, 600

wdw = WS::ImageSelectWindow.new(8, 8, 200, 56, "ImageSelectWindow")
WS.desktop.add_control(wdw)

Window.loop do
  WS.update
end

◎ ウインドウのタイトルバーの閉じるボタンを無効にしたい。 :

  # タイトルバー上の閉じるボタンを無効化
  self.window_title.close_button = false

  # ESCキーで閉じないようにする
  @key_handler.delete(K_ESCAPE)

# 画像を読み込んで表示してみるテスト
# スクロールバーを追加してみる

require_relative 'lib/dxrubyws'
require_relative 'lib/standardgui'

module WS

  # 画像選択ウインドウクラス
  class ImageSelectWindow < WSWindow

    # コンストラクタ。初期化処理
    def initialize(*args)
      super

      # ボタンを生成して登録
      x, y, w, h = 4, 4, 120, 24
      @btn = WSButton.new(x, y, w, h, "画像読み込み")
      client.add_control(@btn)
      @btn.add_handler(:click, self.method(:on_click))

      # タイトルバー上の閉じるボタンを無効化
      self.window_title.close_button = false

      # ESCキーで閉じないようにする
      @key_handler.delete(K_ESCAPE)

      # 次のウインドウ発生位置
      @x_pos = self.x
      @y_pos = self.y + self.height
    end

    # ボタンを押した時の処理
    def on_click(obj, tx, ty)
      # ファイル選択ダイアログを開いてみる
      filters = [
        ["画像ファイル(*.png;*.jpg;*.bmp)", "*.png;*.jpg;*.bmp"],
        ["すべてのファイル(*.*)", "*.*"]
      ]
      filepath = Window.openFilename(filters, "画像ファイルを選択")
      create_image_window(filepath) if filepath
    end

    # 画像を表示するウインドウを生成して画面に追加
    def create_image_window(filepath)
      img = Image.load(filepath)
      w, h = img.width, img.height
      bsname = File.basename(filepath)

      wdw = WS::ImageWithScrollBarWindow.new(@x_pos, @y_pos, 320, 240, bsname)
      wdw.set_image(img)
      WS.desktop.add_control(wdw)

      @x_pos += 32
      @y_pos += 32
    end
  end

  # 画像を表示するだけのウインドウクラス
  class ImageWithScrollBarWindow < WSWindow

    attr_accessor :image

    def initialize(*args)
      super
      @v_pos = 0
      @h_pos = 0
      @image = Image.new(512, 512)

      w, h = self.width, self.height

      # 縦スクロールバー
      vsb = WSVScrollBar.new(w - 20, 0, 16, h)
      client.add_control(vsb, :vsb)

      vsb.total_size = 512 + 16 # 全体サイズ
      vsb.shift_qty = 32 # ボタンを押した時に動く量
      vsb.view_size = client.height # 表示範囲

      # スライダーを動かした時の処理
      vsb.add_handler(:slide) { |obj, pos| @v_pos = pos }

      # 横スクロールバー
      hsb = WSHScrollBar.new(0, h - 20, w - 16, 16)
      client.add_control(hsb, :hsb)

      hsb.total_size = 512 + 16 # 全体サイズ
      hsb.shift_qty = 32 # ボタンを押した時に動く量
      hsb.view_size = client.width # 表示範囲

      # スライダーを動かした時の処理
      hsb.add_handler(:slide) { |obj, pos| @h_pos = pos }

      # 画像
      wsimg = WSImage.new(0, 0, 512, 512)
      wsimg.image = RenderTarget.new(512, 512)
      client.add_control(wsimg, :wsimg)

      # リサイズされた時の処理
      wsimg.add_handler(:resize) do
        wsimg.image.resize(wsimg.width, wsimg.height)
        hsb.view_size = client.width
        vsb.view_size = client.height
      end

      # マウスホイール入力時の処理
      wsimg.add_handler(:mouse_wheel_up) {  vsb.slide(-32 * 3) }
      wsimg.add_handler(:mouse_wheel_down) {  vsb.slide(32 * 3) }

      # オートレイアウトで画像表示部やスクロールバーを調整してもらう
      client.layout(:vbox) do
        # 縦方向に並べる
        layout(:hbox) do
          # 横方向に並べる
          add wsimg, true, true # 横サイズも縦サイズも可変
          add vsb, false, true # 横サイズは固定、縦サイズは可変
        end
        add hsb, true, false # 横サイズは可変、縦サイズは固定
      end
    end

    # 画像を設定
    def set_image(img)
      @image = img

      # スクロールバーに与える全体サイズ値を更新
      client.hsb.total_size = img.width + 16
      client.vsb.total_size = img.height + 16
    end

    # renderをオーバーライドすれば描画されるが、
    # drawをオーバーライドすると描画されない
    def render
      client.wsimg.image.draw(-@h_pos, -@v_pos, @image)
      super
    end
  end

end

Window.width, Window.height = 1024, 600

wdw = WS::ImageSelectWindow.new(8, 8, 200, 56, "ImageSelectWindow")
WS.desktop.add_control(wdw)

Window.loop do
  WS.update
end

• WSHScrollBar と WSVScrollBar が、スクロールバーらしい。
• スクロールバーは、total_size、shift_qty、view_size を持つ。
• total_size は、スクロールバーでスクロールさせる何か、の幅を指定するらしい。例えば画像の縦幅が512ドットだったら、total_size も512を指定する、のではないか。たぶん。
• shift_qty は、上ボタンや下ボタンをクリックしたときにスクロールさせる量。
• view_size は、ちょっとわからなかった。とりあえず、client.width や client.height を与えておくものらしい。
• スクロールバーのスライダーを動かすと、:slide シグナルが来るらしい。
• スクロールバー.slide(数値) で、与えた数値分、スクロールバーを動かせる模様。
• オートレイアウトで、スクロールさせたい何かとスクロールバーをレイアウトできる。
• オートレイアウトは、入れ子にできるらしい。上記のサンプルでは、横方向に、画像と縦スクロールバーを並べ、更にソレを縦に並べて、横スクロールバーが下に並ぶように指定してるつもり。

◎ DVD-Rドライブが使えないと報告が。 :

• OS: Windows10 x64
• CPU: AMD A8-3850
• M/Bチップセット: AMD A75 (GIGABYTE GA-A75M-UD2H)
• USB接続 5.25インチ外付けケース: サイズ 鎌蔵2 5IDE KMZ2-5IDE-BK (IDE接続)
• DVDドライブ: IO-DATA DVR-AN20GL (Sony Optiarc AD-7203A, IDE接続)

ディスクへの書き込み中に問題が発生しました

ディスクは正常に書き込まれませんでした。コンピューターを再起動して、再試行してください。

• Windows10 x64の不具合。Windows10 x64 はCD-Rの書き込み機能にバグがある。とか。
• M/Bの不具合。A75チップセットのUSB周りの不具合。
• 親父さんPC固有の不具合。

• 電源は、ぶっとい電源コードで供給してるし。
• 自分のメインPCに繋いだらフツーに焼けたし。
• そもそも親父さんPCでも、DVD-Rなら焼けるのだから…。

• ソレなら、DVDの書き込みも失敗しそうなものだけど、DVD-Rは焼けてるし。
• また、USB接続の他のアレコレでも不具合が起きそうでもあるけれど、コレと言った症状は出てないし。
• そもそも、同じUSB接続をしているポータブルDVDドライブならスンナリとCD-Rが焼けたというのが謎。

◎ 仮想PC上のWindows10 x64 で試してみた。 :

◎ 一応ドライババージョンのスクリーンショットをメモ。 :

◎ 体調悪い。 :

◎ ATX機の消費電力を測ってみた。 :

◎ BD-RドライブとUSB3.0増設ボードの型番を調べた。 :

◎ tlpをインストールして試したり。 :

◎ ATIビデオカードのドライバを入れる方法が分からない。 :

$ lspci | grep VGA
01:00.0 VGA compatible controller: Advanced Micro Devices, Inc. [AMD/ATI] RV770 [Radeon HD 4850]

◎ ログイン画面の設定でハマったり。 :

[SeatDefaults]
user-session=Lubuntu

greeter-session=unity-greeter

◎ Ubuntu 15.10をインストールしてみた。 :

◎ sshでログインできない。 :