独自コントロールの作り方

例えば、こんなインタフェースはよくみる。

UpDown付きEdit

これって、LabelとEditとUpDownという3つのコントロールを組み合わせている*1

この3つのコントロールをいちいち位置合わせするのはあほらしいよね。こういうときは複数のコントロールを組み合わせて、自分で 新しいコントロールを定義しよう。こんな感じで使えるとかっこいい。

  edit = EditWithUpDown.new(form, :edit_01, "最大日時")
  edit.label.width = 100
  edit.text = "5"
  

コントロール定義の基本的な考え方

複数のコントロールをまとめておくために、パーツとなるコントロールをPanelでまとめてしまう。そうすれば、新定義のコントロールを 外から見るとPanelのように見えるから、left,rightなどの位置合わせ系の制御もできる。もちろん、子コントロールはコンテナとしての Panel内に入っているから、Panelといっしょに移動してくれる。これはつまり、ひとつのコントロールのように見えるということだ。

もちろん、Panelそのものを使うのではなく、Panelを継承して作ってしまえば、Panelが持つ機能はすべて引き継ぎながら、自分のメソッドも 定義できる。これだけでは不便極まりないが、これだけでもそれなりに動作するからたいしたもんだ。

  class EditWithUpDown < Phi::Panel
    def initialize(parent,ctrl_symbol,label_caption="")
      super(parent,ctrl_symbol)
      self.caption = ""  # なぜかコレがいるんだよね
  
      # パーツの生成
      @label = Label.new(self,:label,label_caption)
      @edit = Edit.new(self, :edit)
      @updown = UpDown.new(self, :up_down)
  
      # パーツの位置合わせ
      @label.width = 50
      @label.top = 4
      @edit.left = @label.right+1
      @edit.width = 50
      @updown.left = @edit.right+1
      @updown.height = @edit.height
      @updown.width = 10
      @updown.associate = @edit  # UpDownとEditを結び付け
      self.width = @label.width + @edit.width + @updown.width + 1
      self.height = @updown.height
      #self.bevel_inner = BV_NONE
      self.bevel_outer = BV_NONE
    end
  end
  

こんな感じで使う。

  require 'phi'
  include Phi
  
  # ここに上記のEditWithUpDownのクラス定義を組み込んで
  
  form = Phi.form.new
  edit_updown = EditWithUpDown.new(form, :edit_updown, "入力")
  form.show
  Phi::mainloop()
  

出力結果


戻る


*1もしかして僕が知らないだけで、ちゃんとこういう コントロールがあるのかもしれない。