2

GWT アプリケーションがあり、appBlueTheme.jar、appOrangeTheme.jar を作成し、プロジェクトの BuildPath に追加しました。私のmodule.gwt.xmlファイルには

 ....
<inherits name='appBlueTheme.appBlueTheme'/>
<inherits name='appOrangeTheme.appOrangeTheme'/>
 ...

しかし、私のアプリでは、GWT docが言うようにappBlueThemeの効果が見られます

「継承されたモジュールは、リストされている順序でカスケードされます」

ユーザーの反応に基づいてテーマを変更したい。どうすればこれを達成できますか?

4

1 に答える 1

3

「テーマ」がスタイリングを意味する場合、適切なアプローチは、テーマごとに個別の jar を作成するのではなく、代わりに CSS を使用することです。

A. CSSResource を使用する場合、条件付き CSS を使用できます。

https://developers.google.com/web-toolkit/doc/latest/DevGuideClientBundle#Conditional_CSS

B. 代わりに外部 CSS ファイルを使用する場合

.headerPanel {
    background: blue;
}

選択したテーマに基づいて別の背景を指定できます。

.orangeTheme .headerPanel {
    background: orange;
}
.blueTheme .headerPanel {
    background: blue;
}

コード (または Ui:Binder) は、クラス「headerPanel」のみをウィジェットに割り当てる必要があることに注意してください。アプリを起動するときに、デフォルトのテーマを最も外側のウィジェット (RootPanel に追加するもの) に割り当てます。たとえば、次のように設定します

myAppPanel.addStyleName("blueTheme");

これにより、「headerPanel」クラスを持つすべてのウィジェットの背景が青色になります。ユーザーが別のテーマを選択した場合は、「blueTheme」クラスを削除して「orangeTheme」クラスを追加します。ページが自動的に更新され (リロードする必要はありません)、すべてのスタイルが変更されます。

編集:

PopupPanel とダイアログを含むアプリ全体にテーマを適用する必要がある場合は、次のコードを使用してテーマを適用します。

Document.get().getBody().setClassName("blueTheme");
于 2012-10-09T09:35:48.337 に答える