Archive for 10 月 20th, 2009
Ext JS Designer 1.0.5 (Preview)
Ext JS Designerの最新プレビューが公開されています。
Ext JS DesignerはExtjS + AIRで作られたExtJSのUI構築アプリです。
ExtJS本家のブログにスクリーンキャストが載っています。
http://www.extjs.com/blog/2009/10/08/ext-js-designer-preview/
ExtJS Designer の 画面
Mac OSでいうInterface Builderに似ています。ただしUIをこのアプリケーションで構築して書き出すことはできません。見るだけです。将来的に書き出せるようになるということです。今回はEditerGridやSlider等追加されたようですUndo/Redoもついてアプリらしくなりつつあります。
新機能でスクリーンショットを撮る機能もついているので地味に使えそうです。
Ext JS Designerのスクリーンショット機能
レイアウトの確認など、ざっくりとしたモックを作るのには最適かもしれません。日本語も入力できます。
色々箇所にバグがたくさんありますが今後に期待です。
佐竹 裕行
1982年生まれ。滋賀→はこだて→名古屋→大垣→名古屋。
2006年名古屋学芸大学映像メディア学科卒、その後IAMAS卒(Studio2、6期生)。2009年にsus4に入社。学生時代はMax/MSP JitterやGainerばっかり使っていたが、現在社内では主にExtとモバイル開発、動画サービスのバックエンドを担当。知る人ぞ知るアノ鍵の人。
Ext JS入門2 Ext JSでHello, Worldを作ってみる
HTMLを用意する。
まずHTMLファイルを作成して、Ext JSの読み込みます。ext-base.jsは必須のファイルです。ext-all.jsはExt JSのクラスを全て読み込みます。ext-all.jsを使うと実際に使っていないJSファイルまで読み込んでしまいますが、普段はこちらを使うようにします。ext-all.jsを読み込むことでExt JSの機能をフルで使うことができるので、こちらを読み込んで全部Ext JSでExt JSの機能をバリバリ使いましょう。
ext-all.cssはExt JSのデフォルトのスタイルが定義されています。ボタンやパネルなどのExtJSのユーザーインターフェース（UI）はこのスタイルシートに依存しているため、ExtのUIを使う場合は必ず読み込むようにします。自分で作ることもできるようですが、大変なのでこれも全て読み込んで使うことにします。アイコンなども既に定義されているので別途自分で用意しなくても大丈夫です。(あえてCSSをはずすことでExtJSがどのようなDOMを構築しているかを見ることもできます。)
以下が典型的なHTMLのファイルの形になります。ExtJSのファイルを読み込んだあとで自分のアプリケーションのファイルを読み込みます。下の例ではmyApp.jsになっています。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Hello, World 2 Ext JS</title>
<!--Ext JS CSS-->
<link rel="stylesheet" href="../js/ext/resources/css/ext-all.css" type="text/css" />
<!--Ext JS-->
<script type="text/javascript" src="../js/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../js/ext/ext-all.js"></script>
<!--My App Root JS-->
<script type="text/javascript" src="../js/myApp.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<div class="body">
</div>
</body>
</html>
Viewportを使ったアプリケーションの場合は、ほとんどこのHTMLと同じようになります。
佐竹 裕行
1982年生まれ。滋賀→はこだて→名古屋→大垣→名古屋。
2006年名古屋学芸大学映像メディア学科卒、その後IAMAS卒(Studio2、6期生)。2009年にsus4に入社。学生時代はMax/MSP JitterやGainerばっかり使っていたが、現在社内では主にExtとモバイル開発、動画サービスのバックエンドを担当。知る人ぞ知るアノ鍵の人。
