狠狠撸

狠狠撸Share a Scribd company logo
【A-3】サイドバー用アプリを
XPages で開発してみよう!

株式会社ソルクシーズ
吉田 武司
2013年11月6日

1
サイドバーって?(1)
? Notes 8.X の Standard 版で利用可能になった右
側のプラグインやウィジェットの表示領域
– 標準では、以下の機能が表
示されます
? Sametime 連絡先
? フィード
? 1日の予定

– 他にもいろいろ利用できます
? IBM Connection
? Google ガジェット
? Web サイト
等々
2
サイドバーって?(2)
? 最近のPCはワイドになったけれど全画面表示で使うには横
に広すぎる???その余った部分を有効活用してみませんか?
? メインの画面を作業中の状態のまま
で使える
– 現在の作業を閉じずに済む。
– 見比べたりできる。
? 作業中でも画面端に表示されている
ので他の作業中でも気づける

この部分!
3
サイドバーって?(3)
? 詳しい説明は、ブログ(ノーツと。。。)にまとめてい
ます。ぜひいろいろと試してみてください!
– サイドバーを使ってみよう(1)
紹介 http://p.tl/b7bI

– サイドバーを使ってみよう(2)
RSS Feed Generator についての補足 http://p.tl/8kVV

– サイドバーを使ってみよう(3)
マイ?ウィジェット?パネルの表示 http://p.tl/ZQuR

– サイドバーを使ってみよう(4)
ノーツのビューをサイドバーへ登録 http://p.tl/2XBH
4
なぜサイドバーアプリケーション?
③ サイドバーア
プリは単機能で
よい
② とは言っても何か
目的を持って勉強し
ないとやり辛い

① 複雑なアプリ
開発はまだ不安

④ 時間もあまりな
いし???

⑤ サイドバー
アプリは規模も
小さい

5
というわけで???
? XPages の学習を始める時、最初からワークフローな
ど複雑なアプリケーションを開発するのは大変です。
? そこでサイドバー用の小さなアプリケーション開発を
通じて少しずつ学習していってはどうでしょうか?との
提案です。
? 今回は以下を中心にご説明します。
– サイドバーアプリケーションのアイデア
– よく使うコントロールの説明

? 環境は、Notes/Domino 9.0 です。
6
サイドバーを使用する際の注意点
? 画面が狭い。特に幅が???
– その為、ダイアログなどが表示できない

画面に
表示しきれない!
7
サイドバーアプリケーションの例
ミニメール
伝言メモ
ニュース配信
マスターやマニュ
アル、ヘルプ
? グラフ
? Web サービス

?
?
?
?

? ポータル
8
例1
? ミニメールアプリケーション
– 作業中の画面はそのままですぐにメ
ールが送れる
– 宛先はダイアログが使えないので入
力補完機能(タイプアヘッド)で実装

9
「メールの送信」シンプルアクション
– Notes/Domino 9.0 から
XPages にもメール送信のシン
プルアクションが追加されまし
た。簡単にメール送信の機能
が実装できて大変便利です!
– この機能の練習にミニメールア
プリケーションはちょうどよいか
と思います

10
例2
? 伝言メモなどのメールアプリケーション
– メールを伝言メモなどに特化させる
のもよいかも?

11
例3
? プロフィール風?ニュース配信アプリケーション
– ノーツの文書(ニュース)をビューから
取得(投稿日付の降順でソート)
– XPages(Web)ならノーツのビューと
違って顔写真や画像も表示可能

プロフィールほどリアルタイム性は必要ではな
いけれど、様々な情報を手軽に発信したい!

12
メール受信DBへのニュース投稿
– メール受信 DB にしておけば既存システムにメール投稿
機能を追加するだけで手軽にニュースを投稿可能

部門掲示板DB
部門掲示板DB

サイドバー用
ニュース配信DB

通達DB

13
例4
? マスターやマニュアル、ヘルプなどの参照系
アプリケーション
– 顧客情報や商品マスター、
業務でよく使うマニュアルや
ヘルプなど参照することが多
い情報をサイドバーから素早
く検索して表示

14
例5
? グラフ
– 営業の成績や商品の在庫、
プロジェクトの進捗状況など
をグラフで表示

15
例6
? Web サービス
– 社内、社外で利用できる Web サー
ビスと組み合わせる
? 社外の Web サービスを利用する場合
使用料などが発生することがあります。
ご利用サイトの規約をよく確認上ご注
意下さい。(Google Maps など)

16
例7
? ポータルアプリケーション
– 様々な情報
? 日々の営業情報
? 通達
? 個人の購読情報

等々

– よく使うアプリケーションへのリンク
? ワークスペースからアイコンを探すのに
苦労している方は楽になるかな?

今回はこのアプリケーションで使用し
ているコントロールを中心にご紹介
17
?注目して欲しい情報をトップに表示
?今回のアプリケーションでは「Dojo の
Chart」を使ってグラフを表示
?「セクション」を使って閉じることが可能

上段

中段
?通達やホームページの情報などを「Dojo
アコーディオン」と「繰り返し」を使って表示
?折り畳めるアコーディオンはサイドバーに
も最適
?画像を表示したり記事へのリンクを配置
下段
?普段よく利用するアプリケーションへのリ
ンクを配置
?「タブ付き」で画面を切り替え
18
Demo

19
よく使うレイアウト系の
コントロールの説明
? サイドバーは狭い領域なのでレイアウト系のコントロ
ールを使う必要があります
– セクション(ノーツと同じ)
– タブ付きパネル
– アコーディオン(数種類あり)

20
セクションの説明
? ノーツのセクションと設計方法はほぼ同じ

省略

展開

? デザインは、オプションのセクションタイプで設定可能

21
タブ付きパネルの説明(1)
? タブをクリックしてコントロールを配置

? タブの順番を入れ替えたいときはオプションで設定

22
タブ付きパネルの説明(2)
? タブを挿入、追加したい場合は、コントロールの上で
右クリック!「タブを挿入」「タブの追加」メニューが表
示されます。
– プロパティからはできないのでどこ
で設定すればよいのか最初は迷い
ます???削除はプロパティからでき
るのに???
Wiki はこちら↓
http://p.tl/s5-E
23
アコーディオンの説明(1)
? メニュー作成に便利なアコーディオンには2種類あります
– 1) 「Dojo レイアウト」の「Dojo アコーディオンコンテナ」と「
Dojo アコーディオンペイン」
? コンテナの配下にペイン(複数)を配置します
? ペインの中に表示するコントロールを配置します。ラベルやリンク以外
にもイメージなど様々なコントロールが配置できます
? コントロールの配置や確認はアウトラインビューで行うのが楽です

24
アコーディオンの説明(2)
– 2) 「拡張ライブラリ」の「アコーディオン」
? 「Dojo アコーディオン」とは違って、1つのコントロールで表現します
? 「すべてのプロパティ」の「基本」の「treeNodes」でリンクなどを設定
します

Wiki はこちら↓
http://p.tl/f-RQ
25
アコーディオンの説明(3)
? アコーディオンではないけど工夫次第では似たよう
な使い方ができるコントロール
– 3) 「拡張ライブラリ」の「ウィジェットコンテナ」
?
?
?
?

アコーディオンと同様に展開/省略が可能
複数領域を展開/省略可能
タイトルバー右端にプルダウンメニューを表示可能
注意
– 配置する場合、上下の外側の余白を 0 に設定
– 省略/展開可能のオプション「collapsible」を「true」に設
定
– アプリケーションのテーマを「OneUI V2.1」に設定

26
アコーディオンの説明(4)
? まとめ
– リンク以外の様々なコンテンツを表示したい場合は、
1) 「Dojo レイアウト」の「Dojo アコーディオンコンテナ」と「Dojo アコ
ーディオンペイン」

– シンプルなメニューを表示したい場合は、
2) 「拡張ライブラリ」の「アコーディオン」

– 複数の領域を自由に展開/省略、タイトバーにメニューを
表示したい場合は、
3) 「拡張ライブラリ」の「ウィジェットコンテナ」
27
その他によく使う
コントロールや機能(1)
? 「ビュー」コントロール
– ノーツのビューを XPages で表現するには定番!
– 「繰り返し」や「データ表」コントロールでも同じようなことが
可能

? 「スクリプトの出力」コントロール
– クライアント JavaScript を記述したい場合に利用
– dojo Chating などもここで記述

? 今回のアプリケーションではその他に「ラベル」「リン
ク」「イメージ」 「計算結果フィールド」 「ページの組
み込み」を使っています。
28
その他によく使う
コントロールや機能(2)
? notes URLリンク
–
–
–
–

ノーツのデータベースをクライアントで開くのに利用
「notes://」で始まる URL
文書のプロパティの「ヘッダー情報」の「識別子」の欄で確認
XPages 以外でも使用可能。ノーツ以外のシステムからノー
ツクライアントを起動して特定の文書などを開くことが可能

29
サイドバーへの登録方法(1)
? <ファイル>-<設定>から[ウィジェット]を開き、「
ウィジェット?ツールバーおよびマイ?ウィジェット?パ
ネルを表示」を有効にする
? この操作は初回のみ

30
サイドバーへの登録方法(2)
? 画面を表示してからツールバーの「現在のコンテキ
ストからウィジェットを構成…」をクリックします。

31
サイドバーへの登録方法(3)
? [ウィジェットの動作を選択]
– 「この XPages を開く]

? [ウィジェット名]
– 任意

? [ウィジェットに対する処理の
選択]
– 「パネルとして表示」
32
サイドバーへの登録方法(4)
? メールで配信
– ウィジェットを選択して、右クリックメニューから「E メールの送信」

? メールを受け取ったユーザーは、サイドバーのマイウィジェッ
トに添付ファイルをドラッグ&ドロップするだけで登録完了!
33
サイドバーへの登録法(5)
? 全社的に運用する場合の配信方法
– 「ウィジェットカタログ」と「デスクトップポリシー」が使えます
– ウィジェットカタログに登録したカテゴリを指定してポリシー設
定可能。

34
補足(1)
? 問1:パネルを閉じてしまった!
– マイ?ウィジェット?パネルから該当ウィジェットを再度パネ
ルで開くことができます。

右クリックメニューから
<開く>-<パネル>
35
補足(2)
? 問2:サイドバーをマウスで開くのは面倒!
– ショートカットがあります。
? 開く
– Ctrl + 9
? 閉じる
– Ctrl + 0
? アイコン表示
– Ctrl + 8
36
補足(3)
? 問3:サイドバーって実際に使っているユーザ
ーはいるの?
– XPages では無くノーツのビューやフォームを利用しての
開発ですがあります!
「BPnet SPECIAL 連載企画 三浦奈保子が IBM
Notes/Domino の活用事例をレポート」
? http://p.tl/5tWR

37
まとめ
? 癖があるサイドバーですが、ちょっとした工夫が活
かせる場所です。
? スタンダード版のクライアントを導入しているなら使
わないのは勿体ない!
? いろいろなアイデアを試してみてください!

XPages が苦手な方はまずノーツのビューやフォームを
使ったアプリ作成にチャレンジするのも手かも?
38
XPages Extension Library
Japan プロジェクト
? OpenNTF.org の Xpages Extension Library を日
本に展開するためのプロジェクト
– http://bit.ly/WS5FTP
? サンプルアプリケーション、コントロールの日本語化
? 開発者向け日本語ドキュメントの整備
? 日本市場に特化した機能の実装

– 5月末にリリース1(8.5.3版)を公開
– 現在リリース2(9.0版)のβ1を公開中

39
おまけ:DOMINO-SSO 認証(1)
? ウィジェット登録時に Web ページとして登録する場
合、SSO の仕組みが無いと起動時にパスワードを
入力する必要が出てきます。
? その際は、DOMINO-SSO 認証を利用するのも一
つの方法です。
– サーバー文書の[インターネットプロトコル]-[Domino
Web Engine]の[HTTPセッション]のセッション認証が「複
数サーバー(SSO)」である必要があります。

40
おまけ:DOMINO-SSO 認証(2)
? <ファイル>-<設定>から
[アカウント]を開き、新規アカ
ウントを追加します。
? これでクライアント認証時に
ドミノサーバへも認証される
ようになります。

41
参考文献(Xpages 開発初級者向け)
? 【developerWorks】
一週間で学ぶ XPages 開発入門 (初級編)
? ノーツ技術者の方がはじめて XPages での開発を体験するのに
最適です。簡単なノーツの掲示板アプリケーションを難しいロジッ
クは用いずにとりあえず Xpages 化することを主目的にしていま
す。
? http://p.tl/ys4k

42
ご清聴ありがとうございました!

43

More Related Content

サイドバー用アプリを XPages で開発してみよう!

Editor's Notes

  1. せっかくStandard版を導入しても利用していない方も多いかと思います。 かく言う私も使うのはSametimeくらいで長い間積極的に利用していませんでした。