Sencha.com—Japanese

Sencha Themer

Ext JSアプリの外観をSassコードを記述することなくビジュアルに定義

Sencha Themerを用いれば、Ext JS 6アプリの外観をブラッシュアップできます。グラフィカルツールを用いてカスタムテーマを容易に作成可能。コーディングは不要です。Themerは、Ext JSコンポーネントとインスペクションツールへのアクセスにより、きめ細かいスタイルの設定が可能です。作成したスタイルからは、動的スタイルシートによるテーマパッケージを作成できます。

Themerの先進的なカラーパレット機能により、異なるコンポーネントセットに対して、異なるカラーコンビネーションを容易に割り当てることができます。カラーパレットは、base、body background、font colorについて、明るい色から徐々に暗い色へとバリエーションを提示します。カラーパレットは、マテリアルデザインから色を選択するのにも役立ちます。Themerのフォント管理オプションを用いると、GoogleフォントによるWebフォントを容易に追加できます。

作成済のテーマを利用可能

Theme with a Pre-Built App

Sencha Themerでは、テーマとして使用できる多くのExt JSコンポーネントが含まれたサンプルが提供されています。選択したツールキットをベースとして、Material、Triton、iOSを含む任意のExt JSテーマをカスタマイズできます。base color、background color、font、gradientなど、さまざまなグローバル変数を容易にテーマ化することが可能です。

独自のスタイルも作成可能

Ext JSコンポーネントには、コンポーネントのビジュアル表現を複数種類生成するためのUIミックスイン設定が用意されています。Themerは、グリッド、リスト、タブパネル、タイトルバー、フォームなどの数多くのコンポーネントのUI作成とスタイル化を容易にします。Themerを用いれば、すべてのSass変数にアクセスでき、アプリケーションコンポーネントの外観のカスタマイズや新規定義が可能です。

アプリのスタイルを検査しテーマ化

Themerを用いれば、何百ものSass変数を調べることなく、ビジュアルにコンポーネントのスタイルを確認できます。Themerには、コンポーネントの状態を固定し、スタイルをロックするユニークなインスペクトモードが用意されています。これを使うと、hover、pressed、selectedなどの異なるコンポーネントの状態に対して、異なるスタイルを容易に適用することができます。インスペクトモードを使うと、アプリケーションのコンポーネントツリーにアクセスし、アプリケーション内のコンポーネントのナビゲート、選択、スタイル設定を効率的に行えます。

テーマをエクスポート/共有

テーマが作成できたら、ワンクリックでExt JSパッケージとしてエクスポート可能。他のユーザーと共有したり、ワークスペースに追加することができます。また、任意のExt JSアプリ向けに公開したり、Sencha Architectへインポートすることもできます。

Ext JSは、デスクトップ、タブレット、スマートフォン向けのデータ集約型のWebアプリケーションを構築するための最も堅牢かつ完全なJavaScriptフレームワークです。高機能でカスタマイズ可能な数多くのコンポーネントは、シームレスに連携可能。Themerにより、一貫性のある洗練されたルック&フィールを適用し、卓越したユーザーエクスペリエンスの実現を可能とします。

Themerは、Ext JS Pro および Enterpriseに含まれています。Sencha Themerを試すには、Ext JS トライアル版をご利用ください。トライアル版ダウンロード時に送信されるメールには、ThemerのダウンロードURLが記載されていますので、既にExt JSをダウンロードしている場合には、これを追加ダウンロードして試用してください。

関連情報

クイックスタートガイド(英語)
ビデオ:新規テーマの作成(英語)
トレーニングにサインアップ

サポート・サブスクリプション

最新バージョン:
Themer 1.3.1

サポートフレームワーク

  • Ext JS 6.0以上

その他のリソース

ライセンスについて

Exit mobile version