ExtJS【メモ】
2478 ワード
ExtJS
ExtJSの開始
2.1 ExtJS取得
adapter:Extがサポートする下位ライブラリにサードパーティの下位ライブラリ(Extが付属する下位ライブラリを含む)をマッピングします.build:圧縮されたextのすべてのソースコード(中に分類されて保存されています).docs:APIヘルプドキュメント.exmaples:ExtJsテクノロジーを使用した小さなインスタンスを提供します.resources:Ext UIリソースファイルディレクトリ、例えばCSS、ピクチャファイルはすべてここに保存されます.ソース:圧縮なしExtすべてのソースコード(中に分類して保存)はLesser GNU(LGPL)オープンソースのプロトコルに従います.Ext-all.js:圧縮されたExtのすべてのソースコード.ext-all-debug.js:圧縮されていないExtのすべてのソースコード(デバッグ用).ext-core.js:圧縮されたExtのコアコンポーネントで、sources/coreの下のすべてのクラスを含む.ext-core-debug.js:圧縮Extのないコアコンポーネント、sources/coreの下のすべてのクラスを含む.
2.2 ExtJSの適用
extjsを適用するには、resources/css/extallのスタイルおよびextjsライブラリファイルをページに導入する必要がある.css,extjsのjsライブラリファイルは主に2つあり,adapter/ext/ext-base.jsおよびext-all.js、ext-base.jsはフレームワークベースライブラリ、ext-allを表す.jsはextjsのコアライブラリです.ExtJSフレームワークを使用するページには、一般的に次の文が含まれます.
ExtJSライブラリファイルおよびページコンテンツのロードが完了すると、ExtJSはExt.onReadyで指定された関数を実行するので使用できますが、一般的には各ユーザのExtJSアプリケーションはExt.onReadyから始まり、ExtJSアプリケーションを使用するコードは大体次のようになります.fnは匿名関数の形式に書くこともできますので、上記のコードは以下の形式に変更できます.
2.3 ExtJS版のHelloWorld
さらに、次のようなウィンドウをページに表示できます.
ExtJSの開始
2.1 ExtJS取得
adapter:Extがサポートする下位ライブラリにサードパーティの下位ライブラリ(Extが付属する下位ライブラリを含む)をマッピングします.build:圧縮されたextのすべてのソースコード(中に分類されて保存されています).docs:APIヘルプドキュメント.exmaples:ExtJsテクノロジーを使用した小さなインスタンスを提供します.resources:Ext UIリソースファイルディレクトリ、例えばCSS、ピクチャファイルはすべてここに保存されます.ソース:圧縮なしExtすべてのソースコード(中に分類して保存)はLesser GNU(LGPL)オープンソースのプロトコルに従います.Ext-all.js:圧縮されたExtのすべてのソースコード.ext-all-debug.js:圧縮されていないExtのすべてのソースコード(デバッグ用).ext-core.js:圧縮されたExtのコアコンポーネントで、sources/coreの下のすべてのクラスを含む.ext-core-debug.js:圧縮Extのないコアコンポーネント、sources/coreの下のすべてのクラスを含む.
2.2 ExtJSの適用
extjsを適用するには、resources/css/extallのスタイルおよびextjsライブラリファイルをページに導入する必要がある.css,extjsのjsライブラリファイルは主に2つあり,adapter/ext/ext-base.jsおよびext-all.js、ext-base.jsはフレームワークベースライブラリ、ext-allを表す.jsはextjsのコアライブラリです.ExtJSフレームワークを使用するページには、一般的に次の文が含まれます.
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
ExtJSライブラリファイルおよびページコンテンツのロードが完了すると、ExtJSはExt.onReadyで指定された関数を実行するので使用できますが、一般的には各ユーザのExtJSアプリケーションはExt.onReadyから始まり、ExtJSアプリケーションを使用するコードは大体次のようになります.fnは匿名関数の形式に書くこともできますので、上記のコードは以下の形式に変更できます.
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script>
function fn()
{
alert(‘ExtJS ’);
}
Ext.onReady(fn);
</script>
2.3 ExtJS版のHelloWorld
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script>
Ext.onReady(function()
{
Ext.MessageBox.alert("hello","Hello,easyjf open source");
});
</script>
</head>
<body>
</body>
</html>
さらに、次のようなウィンドウをページに表示できます.
<script>
Ext.onReady(function()
{
var win=new Ext.Window({title:"hello",width:300,height:200,html:'<h1>Hello,easyjf open source</h1>'});
win.show();
});
</script>