Visualforce 開発者ガイド
j$Resource を使用した静的リソースへの動的参照
静的リソースへの動的参照は、テーマその他の表示設定をサポートする場合に非常に便利です。
$Resource グローバル変数を使用して静的リソースを参照するには、式 {! $Resource[StaticResourceName] } で静的リソースの名前を指定します。たとえば、静的リソースとしてアップロードされる画像の名前を返す getCustomLogo メソッドの場合は、静的リソースを <apex:image value="{!$Resource[customLogo]}"/> のように参照します。
次の例では、2 つの異なる表示テーマの切り替え方法を示します。最初に、次のコードで ThemeHandler という名前のコントローラ拡張を作成します。
1public class ThemeHandler {
2
3 public ThemeHandler(ApexPages.StandardController controller) { }
4
5 public static Set<String> getAvailableThemes() {
6 // You must have at least one uploaded static resource
7 // or this code will fail. List their names here.
8 return(new Set<String> {'Theme_Color', 'Theme_BW'});
9 }
10
11 public static List<SelectOption> getThemeOptions() {
12 List<SelectOption> themeOptions = new List<SelectOption>();
13 for(String themeName : getAvailableThemes()) {
14 themeOptions.add(new SelectOption(themeName, themeName));
15 }
16 return themeOptions;
17 }
18
19 public String selectedTheme {
20 get {
21 if(null == selectedTheme) {
22 // Ensure we always have a theme
23 List<String> themeList = new List<String>();
24 themeList.addAll(getAvailableThemes());
25 selectedTheme = themeList[0];
26 }
27 return selectedTheme;
28 }
29 set {
30 if(getAvailableThemes().contains(value)) {
31 selectedTheme = value;
32 }
33 }
34 }
35}- コントローラ拡張にはデフォルトのコンストラクタがないため、コンストラクタは空です。
- アップロードした静的リソースファイルテーマの名前を getAvailableThemes メソッドに追加します。静的リソース、特に複数のファイルを含む zip アーカイブの作成とアップロードの詳細は、「静的リソースの使用」を参照してください。
- 最後の 2 つのメソッドでは、テーマの一覧と Visualforce フォームコンポーネントで使用するように選択されたテーマが提供されます。
ここで、このコントローラ拡張を使用する Visualforce ページを作成します。
1<apex:page standardController="Account"
2 extensions="ThemeHandler" showHeader="false">
3
4 <apex:form >
5 <apex:pageBlock id="ThemePreview" >
6 <apex:stylesheet
7 value="{!URLFOR($Resource[selectedTheme], 'styles/styles.css')}"/>
8
9 <h1>Theme Viewer</h1>
10 <p>You can select a theme to use while browsing this site.</p>
11
12 <apex:pageBlockSection >
13 <apex:outputLabel value="Select Theme: " for="themesList"/>
14 <apex:selectList id="themesList" size="1" value="{!selectedTheme}">
15 <apex:actionSupport event="onchange" rerender="ThemePreview"/>
16 <apex:selectOptions value="{!themeOptions}"/>
17 </apex:selectList>
18 </apex:pageBlockSection>
19
20 <apex:pageBlockSection >
21 <div class="custom" style="padding: 1em;"><!-- Theme CSS hook -->
22
23 <h2>This is a Sub-Heading</h2>
24
25 <p>This is standard body copy. Lorem ipsum dolor sit amet, consectetur
26 adipiscing elit. Quisque neque arcu, pellentesque in vehicula vitae, dictum
27 id dolor. Cras viverra consequat neque eu gravida. Morbi hendrerit lobortis
28 mauris, id sollicitudin dui rhoncus nec.</p>
29
30 <p><apex:image
31 value="{!URLFOR($Resource[selectedTheme], 'images/logo.png')}"/></p>
32
33 </div><!-- End of theme CSS hook -->
34 </apex:pageBlockSection>
35
36 </apex:pageBlock>
37 </apex:form>
38</apex:page>- ページでは標準取引先コントローラを使用しますが、取引先は関係ありません。コントローラ拡張を使用するには、コントローラを指定する必要があります。
- 最初の <apex:pageBlockSection> には、テーマ選択ウィジェットが含まれます。<apex:actionSupport> を使用して選択メニューを変更すると、<apex:pageBlock> 全体が再表示されます。これは、<apex:stylesheet> タグが、更新された selectedTheme を動的参照のために取得できるようにするものです。
- ここで選択したテーマ設定は、コントローラのビューステートにのみ保持されますが、これに代えてカスタム設定に保存し、永続的にすることが簡単に行えます。
- テーマごとのグラフィックとスタイルアセットが含まれる各 zip ファイルの構造と内容は一貫している必要があります。つまり、各テーマの zip ファイルには images/logo.png が存在する必要があります。
このページの $Resource グローバル変数への動的参照は 2 つのみですが、スタイルシートとグラフ��ックアセットの両方にアクセスする方法を示しています。動的参照は、ページのどの <apex:image> タグでも使用でき、デザインを完全に変えることができます。
$Label および $Setup は、組織の管理者またはユーザ自身が Salesforce に設定したテキスト値や保存した設定にアクセスできるという点で、$Resource に似ています。
- カスタム表示ラベルを使用すると、アプリケーション全体で一貫して使用可能なテキストメッセージを作成できます。表示ラベルテキストを翻訳し、自動的にユーザのデフォルト言語で表示することもできます。カスタム表示ラベルの使用方法についての詳細は、「カスタム表示ラベル」を参照してください。
- カスタム設定を使用すると、アプリケーションについて管理者またはユーザ自身が更新できる設定を作成できます。設定を階層化し、ユーザレベル設定でロールレベルまたは組織レベルの設定を上書きすることもできます。カスタム設定の使用方法についての詳細は、カスタム設定を参照してください。