tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:Summer'15のApp Builderを使ってLightning Pagesを作成してみました

f:id:tyoshikawa1106:20150424234248p:plain

Summer'15 Pre-Release環境で最新版のAppBuliderが利用できるようになっていたので、どんなことができるか確認してみました。設定のLightning アプリケーションビルダーから新規作成画面を表示できるようになっています。

ステップ1

f:id:tyoshikawa1106:20150424234435p:plain

ステップ2

f:id:tyoshikawa1106:20150424234509p:plain

ステップ3

f:id:tyoshikawa1106:20150424234559p:plain

App Bulider

f:id:tyoshikawa1106:20150424234953p:plain


レイアウトはPhoneとTabletを選択できます。
f:id:tyoshikawa1106:20150424235649p:plain


デフォルトで設置できるコンポーネントは以下のとおりです。
f:id:tyoshikawa1106:20150425000433p:plain:w300

リッチテキスト

リッチテキストは任意のラベルを表示できます。リッチテキストエリアと同じように太字やフォントサイズのカスタマイズなどが可能になっています。

f:id:tyoshikawa1106:20150425000800p:plain

レポートグラフ

任意のレポートグラフを表示できます。対象のグラフは選択リストで指定できます。また、ラベルや更新ボタンの有無など多少のカスタマイズもできるみたいです。

f:id:tyoshikawa1106:20150425000856p:plain

最近使ったデータ

最近使ったデータを表示できます。表示ラベルや一度に表示するレコード件数も指定できるみたいです。

f:id:tyoshikawa1106:20150425001214p:plain


表示するオブジェクトは任意のオブジェクトを選択できるみたいです。

f:id:tyoshikawa1106:20150425001143p:plain

条件リスト

リストビューの条件に一致するレコードを表示できるみたいです。

f:id:tyoshikawa1106:20150425001338p:plain

有効化

保存ボタンの隣にある有効化ボタンから有効化できます。ナビゲーションバーへの追加や表示位置の調整などもこのタイミングで行うことができます。

f:id:tyoshikawa1106:20150425001526p:plain

Salesforce1ページからアクセス

作成したLightning PagesはSalesforce1からアクセスできます。

f:id:tyoshikawa1106:20150425001716p:plain


Lightning Pagesはレスポンシブデザインに対応しています。

f:id:tyoshikawa1106:20150425001829p:plain:w300

アクションの追加

アクションを追加するとLightning Pagesでアクションバーを表示することができます。

f:id:tyoshikawa1106:20150425002051p:plain


アクションによっては表示できる画面の条件みたいなものがあるようです。

f:id:tyoshikawa1106:20150425002212p:plain:w300


Lightning Pagesには1列表示, 2列表示などのテンプレートが用意されていますが、このテンプレートは作成後は変更不可となるみたいです。

f:id:tyoshikawa1106:20150425002415p:plain:w300

2列表示

f:id:tyoshikawa1106:20150425002527p:plain

2列表示のテンプレートで表示列数を2つまで追加できます。

f:id:tyoshikawa1106:20150425003230p:plain


画面サイズ幅が小さくなると自動で一列表示に変更されます。

f:id:tyoshikawa1106:20150425003307p:plain

2列表示 (3Regions)

f:id:tyoshikawa1106:20150425003529p:plain

2列表示の別パターンもあるみたいです。

f:id:tyoshikawa1106:20150425004621p:plain

3列表示

f:id:tyoshikawa1106:20150425004742p:plain


Tablet (LandSpace)というのが3列表示するときのプレビューサイズみたいです。

f:id:tyoshikawa1106:20150425005018p:plain


ダッシュボード的な画面を作成したい場合は3列表示が便利そうです。

f:id:tyoshikawa1106:20150425005131p:plain


今回確認できた内容はだいたいこんな感じです。この他にもVisualforceやLightning Componentを表示したりできるみたいです。Lightning Pagesは基本的にSalesforce1で使用することになるみたいなので、AppBuilderで使用するためのLightning Componentsを開発するときはSalesforce1スタイルに合うように開発するのがよさそうです。


ちなみにAppBuilderから作成したページのタブはLightning Pagesタブのところに表示されます。
f:id:tyoshikawa1106:20150425005818p:plain