« Hello Worldをつくる2 | トップページ | ラーメンタイマーを作る1 »

2009年4月25日 (土)

Hello Worldをつくる3

ボタンを押してイベントを拾ってHello Worldの出力ができたので、今度は入力部分を扱ってみたいとおもいます。
入力フィールドを作って、ボタンを押すと出力用のフィールドに文字列が出るようにしてみます。

画面はこんな感じに作ってみました。

01_2

新しくFlexGridSizerというSizerを使ってみました。通常のBoxSizerだとExpand&Stretchしたとき均等に延ばされて配置されたりして見た目がヘンになったりします。

FlexGridSizerを使うと、その名の通りフレキシブルな部分とそうでない部分を混在させてレイアウトできるようになります。
今回は出力フィールド(上側の部分)を大きく取りたかったのでこの部分をWx:TextCtrlで作ってBoxSizerへ配置、これをさらにFlexGridSizerの中へ入れ子で配置。同様に入力フィールドの部分もBoxSizerに入れてからFlexGridSizerの中へ入れて、rows、colsで縦に並ぶようにします。FlexGridSizerのgrowablerows、growablecolsがフレキシブルにする場所の指定になるので0にセット。

02_2

できたXRCファイルはこんなかんじです。

  1. <?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
  2. <resource xmlns="http://www.wxwindows.org/wxxrc" version="2.3.0.1">
  3.   <object class="wxFrame" name="MyFrame1" subclass="Test3">
  4.     <style>wxDEFAULT_FRAME_STYLE|wxTAB_TRAVERSAL</style>
  5.     <size>500,300</size>
  6.     <title></title>
  7.     <object class="wxPanel" name="m_panel1">
  8.       <style>wxTAB_TRAVERSAL</style>
  9.       <object class="wxFlexGridSizer">
  10.         <rows>2</rows>
  11.         <cols>1</cols>
  12.         <vgap>0</vgap>
  13.         <hgap>0</hgap>
  14.         <growablecols>0</growablecols>
  15.         <growablerows>0</growablerows>
  16.         <object class="sizeritem">
  17.           <option>1</option>
  18.           <flag>wxEXPAND</flag>
  19.           <border>5</border>
  20.           <object class="wxBoxSizer">
  21.             <orient>wxVERTICAL</orient>
  22.             <object class="sizeritem">
  23.               <option>1</option>
  24.               <flag>wxALL|wxEXPAND</flag>
  25.               <border>5</border>
  26.               <object class="wxTextCtrl" name="m_textOutput">
  27.                 <style>wxTE_MULTILINE|wxTE_READONLY</style>
  28.                 <value></value>
  29.                 <maxlength>0</maxlength>
  30.               </object>
  31.             </object>
  32.             <object class="sizeritem">
  33.               <option>0</option>
  34.               <flag>wxEXPAND | wxALL</flag>
  35.               <border>5</border>
  36.               <object class="wxStaticLine" name="m_staticline1">
  37.                 <style>wxLI_HORIZONTAL</style>
  38.               </object>
  39.             </object>
  40.           </object>
  41.         </object>
  42.         <object class="sizeritem">
  43.           <option>1</option>
  44.           <flag>wxEXPAND</flag>
  45.           <border>5</border>
  46.           <object class="wxBoxSizer">
  47.             <orient>wxHORIZONTAL</orient>
  48.             <object class="sizeritem">
  49.               <option>1</option>
  50.               <flag>wxALL</flag>
  51.               <border>5</border>
  52.               <object class="wxTextCtrl" name="m_textInput">
  53.                 <value></value>
  54.                 <maxlength>222</maxlength>
  55.               </object>
  56.             </object>
  57.             <object class="sizeritem">
  58.               <option>0</option>
  59.               <flag>wxALL</flag>
  60.               <border>5</border>
  61.               <object class="wxButton" name="m_button1">
  62.                 <label>Input</label>
  63.                 <default>0</default>
  64.               </object>
  65.             </object>
  66.           </object>
  67.         </object>
  68.       </object>
  69.     </object>
  70.   </object>
  71. </resource>
  72.  

これを元にxrciseからコード生成。

  1.  
  2. # This class was automatically generated from XRC source. It is not
  3. # recommended that this file is edited directly; instead, inherit from
  4. # this class and extend its behaviour there. 
  5. #
  6. # Source file: Test3.xrc
  7. # Generated at: Sat Apr 25 16:22:35 &#26481;&#20140; (&#27161;&#28310;&#26178;) 2009
  8.  
  9. class Test3 < Wx::Frame
  10.  
  11.   attr_reader :m_panel1, :m_textoutput, :m_staticline1, :m_textinput,
  12.               :m_button1
  13.  
  14.   def initialize(parent = nil)
  15.     super()
  16.     xml = Wx::XmlResource.get
  17.     xml.flags = 2 # Wx::XRC_NO_SUBCLASSING
  18.     xml.init_all_handlers
  19.     xml.load("Test3.xrc")
  20.     xml.load_frame_subclass(self, parent, "MyFrame1")
  21.  
  22.     finder = lambda do | x |
  23.       int_id = Wx::xrcid(x)
  24.       begin
  25.         Wx::Window.find_window_by_id(int_id, self) || int_id
  26.       # Temporary hack to work around regression in 1.9.2; remove
  27.       # begin/rescue clause in later versions
  28.       rescue RuntimeError
  29.         int_id
  30.       end
  31.     end
  32.  
  33.     @m_panel1 = finder.call("m_panel1")
  34.     @m_textoutput = finder.call("m_textOutput")
  35.     @m_staticline1 = finder.call("m_staticline1")
  36.     @m_textinput = finder.call("m_textInput")
  37.     @m_button1 = finder.call("m_button1")
  38.     if self.class.method_defined? "on_init"
  39.       self.on_init()
  40.     end
  41.   end
  42. end
  43.  
  44.  

ボタンを押したときの処理部分です。リファレンスでWx:TextCtrlを見てみると、書き込みはwrite_text、読み込みはget_valueで出来そうです。こんな風に書いてみました。

  1. require 'rubygems'
  2. require 'wx'
  3. require 'Test3.rb'
  4.  
  5. class Hello_World3 < Test3
  6.   def initialize(parent = nil)
  7.     super()
  8.     evt_button(m_button1.get_id()) {|event| on_buttonClick(event)}
  9.   end
  10.  
  11.   def on_buttonClick(event)
  12.     @m_textoutput.write_text(@m_textinput.get_value)
  13.   end
  14. end
  15.  
  16.  
  17. class App < Wx::App
  18.   def on_init
  19.     f =  ::Hello_World3.new
  20.     f.show
  21.   end
  22. end
  23. App.new.main_loop
  24.  

動作結果はこんな感じでうまくいきました。

03_2

|

« Hello Worldをつくる2 | トップページ | ラーメンタイマーを作る1 »

Hello Worldをつくる」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/1201593/29276706

この記事へのトラックバック一覧です: Hello Worldをつくる3:

« Hello Worldをつくる2 | トップページ | ラーメンタイマーを作る1 »