スタックコンテナ(dijit.layout.StackContainer) は、紙芝居のように画面が重なった形になっている。スタックコンテナを指定して back() 関数や forward() 関数を実行させると画面を切り替えることができる。下にサンプルプログラム stack_container.html のコードを示した。(ブログのセキュリティのため onClick はキャラクターコードを全角英数にしてあるのでコピペだけでは動作しない。その部分を半角英数に書き換える必要がある。)
これで、Dojoのレイアウトウィジェットで分かりやすいのはすべて紹介したが、これだけでも色々なアプリケーションができそうな気がする。また、ウィジェットはオブジェクト指向で設計されているようなので、スタックコンテナの画面を操作するには、スタックウィジェットにメッセージ forward() を送るだけになっている。Dojoは慣れてくるとかなりプログラムしやすい設計になっているのではないだろうか。日本語の入門書が出てくるのが待ち遠しい。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Stack Container Demo</title> <style type="text/css"> @import "http://o.aolcdn.com/dojo/1.0.0/dijit/themes/tundra/tundra.css"; @import "http://o.aolcdn.com/dojo/1.0.0/dojo/resources/dojo.css" </style> <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.0.0/dojo/dojo.xd.js" djConfig="parseOnLoad: true"></script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.StackContainer"); dojo.require("dijit.form.Button"); </script> </head> <body class="tundra"> <button id="previous" onClick="dijit.byId('mainTabContainer').back()"><</button> <button id="next" onClick="dijit.byId('mainTabContainer').forward()">></button> <div id="mainTabContainer" dojoType="dijit.layout.StackContainer" style="width: 50%; border:1px solid black; height: 300px;"> <div id="Page1" dojoType="dijit.layout.ContentPane" label="Page1"> <h1 align="center">Page 1</h1> <p align="center">mukasi mukasi ...</p> </div> <div id="Page2" dojoType="dijit.layout.ContentPane"> <h1 align="center">Page 2</h1> <p align = "center">arutokoro ni ...</p> </div> <div id="Page3" dojoType="dijit.layout.ContentPane" > <h1 align="center">Page 3</h1> <p align="center">ojiisan to obaasan ga sunde imasita</p> </div> </div> </body></html>
by tnomura9
| 2007-11-19 19:13
| Dojo
|
Comments(0)
|
カテゴリ
新型コロナウイルス 主インデックス Haskell 記事リスト 圏論記事リスト 考えるということのリスト 考えるということ ラッセルのパラドックス Haskell Prelude Ocaml ボーカロイド 圏論 jQuery デモ HTML Python ツールボックス XAMPP Ruby ubuntu WordPress 脳の話 話のネタ リンク 幸福論 キリスト教 心の話 メモ 電子カルテ Dojo JavaScript C# NetWalker ed と sed HTML Raspberry Pi C 言語 命題論理 以前の記事
最新のトラックバック
最新のコメント
ファン
記事ランキング
ブログジャンル
画像一覧
|
ファン申請 |
||