当ブログに掲載しているサンプルは、すべて利用者の自己責任という形でお願いします。
ただし、明らかな不具合がある場合、ご連絡いただければ、訂正記事を出します。
また、こちらのサンプルは、別のサイト等への公開、転載は一切禁止しています。
どうしてもと言う場合は、筆者にあらかじめご連絡ください。

テクてく Lotus 技術者 Slack に参加しよう!

2011年11月26日土曜日

おじさんSEが学ぶXPages(8)

本当は11/23に続きを書こうと思いましたが、気力が持ちませんでした・・・
ということで、続きです。


その前に、筆者の気力を回復させるボタンをクリックしてくださいね。
にほんブログ村 IT技術ブログへ





さて、前回は「蔵書」フォームをXPageのカスタムコントロールとして作成しました。
今回は、実際にXpageに組み込んで編集や表示が出来るようにしましょう。


基本的には、他のXPageと同じ方法になります。(今回の連載では、基本的な事を書きたいので、複数の方法については触れないようにします。他の方法は今後、Tipsと言う形で掲載するようにしますのでご了承ください。)

まず、「BookResource」Xpageを開きます。
何も記述されていない状態のはずなので、「コントロールビュー」の「カスタムコントロール」から「container」を選択してドラッグ&ドロップします。

「container」カスタムコントロールが画面上に表示されたら、編集可能領域である「contentData」の箇所に緑色のが表示されているのが分かりますね。

今度は、そこに向けて、同じく「コントロールビュー」の「カスタムコントロール」から「BookResource」を選択して、ドラッグ&ドロップします。
BookResourceを編集可能領域に追加

ここで、「BookResources」XPageを保存して閉じます。簡単ですね。

「container」カスタムコントロールには、「蔵書一覧」と「貸し出し一覧」のタブがあるので、そこをクリックする事で、それぞれのビューへと移動する事が出来ます。
しかし、画面遷移で示してあるような、「蔵書一覧」からこの「蔵書登録/編集画面」へのリンクがありません。

ということで、「蔵書一覧」の画面から蔵書登録が出来るようにしましょう。
「BooksCollectionView」カスタムコントロールを開きます。
蔵書一覧ビューが表示されているので、先頭でEnterキーを押して改行します。
※先頭に改行が挿入できないという方へ 画面を開いた直後に、Enterキーを押すとうまくいきます

改行で空いた箇所に、「ボタン」コントロールを選択してドラッグ&ドロップします。

蔵書登録用のボタンを配置

ボタンのラベルを「蔵書登録」に変更します。
次に「イベント」ビューを開きます。
シンプルアクションで「アクションの追加...」をクリックします。
「シンプルアクションの追加」ダイアログが表示されるので、内容を入力します(下図参照)。
シンプルアクションの追加

これだけで良いのですが、せっかくなのでボタンのデザインを変更してみましょう。

まずは、ボタンのフォントを変更します。
フォントタブ

次にボタンの背景を変更します。
背景タブ


他にも、ボタンの幅や高さを変更したり、 背景に色ではなく画像を選択したりする事も出来ます。
このようにCSSを使わなくても、ある程度はLotus DominoDesignerだけでもデザインを変更する事が出来ます。
もちろん、CSSでスタイルを設定する方が変更の自由度も高いので機会があればチャレンジしてください。


ここまで出来たら、「BooksCollectionView」カスタムコントロールを保存します。

ということで今回はこれで終わります。
次回は、「貸し出し画面」の作成をします。

やっと完成が見えてきましたね。
ではでは。


Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ

0 件のコメント: