【第8回】ノーツアプリ作成～カテゴリビューの作成と、フォームの拡張～

皆様、こんにちは!!

ノーツコンソーシアムのオープンセミナーを来週に控え、まだ発表準備ができていない萩原です。
今週はそちらに集中しようかと思ったのですが、来週のほうが厳しいということで、がんばってみます!

さて前回はフォームの体裁を整えましたが、ひとつ簡単に拡張できるフィールド項目の拡張を行ってみたいと思います。

拡張するのは、フィールド【カテゴリ】を選択肢化するというものです。

カテゴリのような項目は、ある程度限られた選択肢として利用されるものであるため、手入力するよりも選択肢として提供することで、ユーザーの利便性を向上することができます。
加えて例えば「カテゴリ」と「ｶﾃｺﾞﾘ」では別のものとして扱われてしまうような事例から回避するためにも有効な手段となります。


それでは早速ですが、【カテゴリ別】というビューを新しく作ってみましょう。

デザイナーのビューを開いて頂き、【新規ﾋﾞｭｰ】ボタンをクリックします。
ビューの作成ダイアログが開きますので、
・ビュー名に【カテゴリ別|bycategory】と入力します。

新規ビューをいちから作成してもいいのですが、既に【氏名カナ順】というビューがありますので、こちらの設計を元にビューを作成してみます。
【コピーするスタイル】の右にある【コピー元】ボタンをクリックします。

【コピーするスタイル】ダイアログが開きますので、【氏名カナ順】を選択し、【OK】。

さらにビューの作成ダイアログも【OK】してください。

新しく【カテゴリ別】のビューが作成されました。

※デザイナーのビュー一覧で、【氏名かな順ビュー】を選択し、Ctrl+Cでコピーし、同じ位置にCtrl+Vで貼り付け、F2で名前を変更しても同じ結果が得られます。

デザイナーで【カテゴリ別】を開いて頂くと、

【氏名カナ順】と全く同じ設計の状態となっていることがわかります。

今回は新たに1列目に【カテゴリ】を追加します。

1列目選択し、【作成】⇒【列の挿入】をクリックするか、1列目の列タイトルを右クリックし、【列の挿入】をクリックします。

1列目が選択された状態で、下部の【フィールド】から【category】を選択します。

続いて列のプロパティを表示し、
タイトル・・・[空白]
幅・・・1
とし、【展開できる行に三角アイコンを表示する】にチェックします。

続いて【ソート】タブに移動し、
ソート・・・昇順
種類・・・カテゴリ別

を選択します。


ノーツでプレビューすると、

カテゴリ別で内容がソートされていることがわかります。


次に、メインフォームの【category】フィールドの設定を変更します。

メインフォームを開き、【category】フィールドを選択し、プロパティを開きます。
種類を【テキスト】から【ダイアログリスト】に変更します。

続いてひとつ右の「制御」タブを選択し、下記を設定します。
【式で選択肢を設定】
【@DbColumn("":"nocache"; ""; "bycategory"; 1)】

式について、詳しくはノーツのヘルプで【@DbColumn】を見ていただくとして、簡単な意味合いは
@DbColumn(  class  :  cache  ;  server  :  database  ;  view  ;  columnNumber  ) 

cache部分を【nocache】とすることで、キャッシュを使用せずに、現在の選択肢をピックアップします。
viewにカテゴリ別ビュー【bycategory】とし
※ビュー名を"で囲むことに注意
columNumberで抽出する選択肢の列番号である【1】を設定します。

つまりカテゴリ別ビューの1列目の値を取得するということになります。

ノーツでプレビューし、【カテゴリ】フォームの右にある▼をクリックすると、【キーワードの選択】ダイアログが表示され、キーワードとして過去に登録のあるキーワードが表示されます。

このままですと、カテゴリは既存のものしか使用できないため、新規のカテゴリを受け付けるように設定します。

もう一度【category】フィールドの制御タブで、【リストにない値も可】のチェックボックスをONにします。

再度ノーツでプレビューすると、このように下部に「新しいキーワード」が入力できるように変更されました。

今回はひとつ、式(ノーツでは@式[アットマーク式])というものを利用してみましたが、ちょっとした設定で使いやすいデータベースに仕上がることが理解頂けたかと思います。


さて次回は少し息抜きに、ノーツコンソーシアムのオープンセミナーに関して書ければと考えております。

長文にお付き合い、ありがとうございました。

【第7回】ノーツアプリ作成～フォームの調整～

皆様、こんにちは!!

10月も下旬に差し掛かり、そろそろオープンセミナーの準備も詰めなければと焦っております。
そんな中、ノーツ・しこく・フェスタ 2016 － 人工知能(AI) × IoT × クラウド活用術の案内もあり、現在休暇を取って、強行日程での参加をたくらんでおります。

さて前回はノーツのビューを少し見やすく設定してみましたが、今回は手付かずのフォームを触ってみたいと思います。

現在の設定ですと、下記のようにかなり間延びした表示になっています。

それではデザイナーで「メインフォーム」を開いてください。

まずは各行のタイトルの幅が長いので、短くします。

表のプロパティを開きたいので、表の中をクリックすると、ツールバーに【表のプロパティ】アイコンが表示されます。

もしくは表内を右クリックし、【表のプロパティ】をクリックしても同じです。

この表のプロパティにて幅や高さ、色などを設定します。

まず幅ですが、調整したい列(今回は1列目)をクリックし、プロパティの【幅】を3cmの【固定幅】にしてみましょう。

ノーツでプレビューすると、

実に簡単ですよね。

せっかくなので、2列目の設定を確認しておきましょう。

2列目をクリックしていただくと、

※もしプロパティが【表】以外になってしまいましたら、右側の▼をクリックして、【表】を選択してください。

幅は私の端末では【22.373cm】になっています。

こちらはその上の【表】幅の設定として、【マージンに合わせる】・・・余白に合わせる・・・が選択されており、【固定幅】にチェックがされていないため、ディスプレイ幅に合わせた値が自動で設定されます。

つまり表示するディスプレイの余白にあわせて、自動で列幅が変更されます。

※逆に常に幅を固定したい場合は、表の【幅】で【固定幅】を選択することで可能になります。

続いて内容の最重要項目を分かりやすくするため、氏名と会社名の文字サイズを変更します。

まず表の1行目を選択、プロパティを【文字】に切り替えます。

【サイズ】を"14"、【スタイル】に"太字"を選択します。

同様に3行目を選択し、【サイズ】を"12"、【スタイル】に"太字"を選択します。

あわせて行のタイトル列の文字を別の色に変更してみてください。

ノーツでプレビューすると(ノーツ文書を開いた例もあわせてます)

以上、少しの設定で、それなりに見やすいフォームになります。

もちろん色やサイズはお好みで自由に設定頂けます。

さて次回は新しいビューとして、【カテゴリ別】というものを作成します。

またこのカテゴリ別のビューを利用し、フォームのカテゴリをチューンナップします。

【第6回】ノーツアプリ作成～ビューの調整～

皆様、こんにちは!
10月に入り、一気に涼しくなったと思いきや、今日は夏日・・・。
残暑というには遅いような気がするのですが・・・。

本題に入る前にひとつ宣伝させてください!!

弊社も参加させて頂いておりますノーツコンソーシアムですが、11月9日(水)にオープンセミナーが開催されます。
どなたでも参加できるイベントで、たくさんのセッションやハンズオン等が企画されており、見所満載です!!

はずかしながら私も1セッション頂いているのですが・・・。

お時間ございましたら、ぜひ参加お申込ください!!
特に人気セッションはお早めに!


さて、前回は「カナ順」ビューが表示されるところまで完成しました。
もちろんこの状態でも問題なく使用できるのですが、実際に利用者から見てみると、「カナ」や「会社カナ」は補助的な項目でしかなく、「氏名」や「会社名」に目がいくかと思います。

そこで、このビューをもう少しユーザー目線で修正してみましょう。

まず「カナ」です。
もちろん「カナ順」のビューですので、「カナ」そのものは必須なのですが、すべての文字列が表示されている必要はありません。
そこで、今回は50音順「ア・カ・サ・タ・ナ・・・」に分類することにしてみます。


それではデザイナーで「カナ順」ビューを開いてください。

今回は「カナ」の50音を集約しますので、「カナ」の列タイトルが選択されていることを確認し、「ビューに列を挿入」ボタンもしくは[作成]メニューから[列の挿入]をクリックします。
この列をクリックし、「式」を選択し、下記式を記入もしくはコピペしてください。


KANAA:=@Left(kana;1);
@If(@Contains("アイウエオ";KANAA);"ア";
@Contains("カキクケコガギグゲゴ";KANAA);"カ";
@Contains("サシスセソザジズゼゾ";KANAA);"サ";
@Contains("タチツテトダヂヅデド";KANAA);"タ";
@Contains("ナニヌネノ";KANAA);"ナ";
@Contains("ハヒフヘホバビブベボパピプペポ";KANAA);"ハ";
@Contains("マミムメモ";KANAA);"マ";
@Contains("ヤユヨ";KANAA);"ヤ";
@Contains("ラリルレロ";KANAA);"ラ";
@Contains("ワヲ";KANAA);"ワ";
"他")

式の意味ですが、
1行目で"KANAA"という変数にフィールド"kana"の1文字目を当てはめています。
2行目から11行目で"KANAA"を判断し、「アイウエオ」のいずれかなら「ア」を、
「カキクケコガギグゲゴ」のいずれかなら「カ」を・・・表示するように定義しています。


これだけですと、ビューの1列目に先頭文字が何行なのかが表示されただけですので、同じ行をまとめて見やすくします。

列のプロパティダイアログの1番目の「列情報」タブで、「幅」を"1"に、「展開できる行に三角アイコンを表示する」にチェックします。

続いて、2番目の「ソート」タブで、「昇順」「カテゴリ別」を選択します。
※単に「カテゴリ別」を選択すると、勝手に「昇順」がデフォルトで選択されます。

続いて「カナ」列をクリックし、プロパティダイアログ右端のタブ「詳細」をクリックします。
その中で「列を非表示」を選択します。

同じように「会社カナ」も「列を非表示」にしてください。

その状態で、[設計]-[IBM Notesでプレビュー]してみると、

いかがですか?
かなりすっきりした感じになりましたよね。

もちろんこのままでもかまいませんが、データが増えてくると各行が折りたたまれていると見やすいかもしれませんので、開いたときに折りたたまれた状態になるよう設定してみます。

プロパティボックス上部の▼をクリックし、「ビュー」に切り替えます。

2番目の「オプション」タブにて、
「データベースを最初に開くときすべてを省略する」をチェックし、【開くとき】を「最初の行へ」に変更します。

先にプレビューを開いているようでしたら、一度閉じて、再度[設計]-[IBM Notesでプレビュー]を行うと、

すべて畳まれた状態でビューが開きました。


今回は以上です。

次回は【メインフォーム】の見栄えを少し触ってみます。

【第5回】ノーツアプリ作成～ビューの項目追加～

皆様、こんにちは!

できれば週1で投稿したかったのですが、兼任業務に追い回されてしまい、先週サボってしまいました・・・。


気を取り直して、今回は前回1列のみで作成したビューについて、さらに項目を増やしてみたいと思います。

まずどのような項目を利用者が一覧として見たいのかを、フォームに配置した一覧からピックアップします。
【第3回】で記載しましたが、【リッチテキストフィールド】はビューに表示することができません。

従って、表示できる項目としては、
氏名、カナ、会社名、会社カナ、カテゴリ、部署、役職、FAX番号、郵便番号、性別
となります。

全てをビューに表示させても構いませんが、できればモニター幅に収まる程度が好ましいため、今回は
氏名、カナ、会社名、会社カナ
と、個人を識別できる基本項目のみと致します。
※ビューに表示していない内容は、文書を開くことですべて表示されるため、ビューでの必要性が低い項目は、追加しないほうが見やすくなる場合があります。

それでは早速ですが、ビューに列を追加しましょう。

ビューに列を追加するには、列タイトルの右側(下記、赤い部分)をダブルクリックするか、

ツールバーの「ビューに列を挿入」もしくは「ビューに列を追加」のいずれかのボタンをクリックします。
※挿入した場合、選択された列の左側に新規列が挿入されます。追加の場合は、一番右端に追加されます。

今回は「ビューに列を追加｣ボタンをクリックしてみます。
既に「カナ」列は作成済みのため、3回クリックし、新規の列をみっつ追加してください。

次に各列の設定を行います。

まず2列目[空白]の列タイトルをクリックし、プロパティボックスで【タイトル】に「氏名」と入力します。
続いて画面下半分の【列の値】にて、【表示】で「フィールド」を選択し、「name」をクリックします。

「カナ」の左に、「ビューの更新」ボタンが表示されますので、クリックしてみましょう。

2列目に氏名が表示されました。(3,４列目は未設定ですので、「ビューの#」が表示されます)

同じように３列目に「会社カナ(company_kana)」、4列目に「会社名(company_name)」を設定してください。

このように表示ができるようになりました。
但しこのままですと、「会社カナ」や「会社名」の列幅が狭く、見にくい状態です。
そこでこの2列について、列幅を修正してみましょう。

列幅の設定方法はふたつ。
●列タイトルの境界線をドラッグする
●プロパティ画面の【幅】で値を設定する

いずれを使って頂いてもいいですが、いずれも画面に表示されるよう設定してみてください。
下記は「会社カナ」を【15】、「会社名」を【20】としています。

以上で一度ビューを保存してください。

せっかくなので、もう数件テストデータを作成してください。
(同じ会社のテストデータも作成しておいてください。)
もし列幅を超えたデータが発生した場合は、再度列幅の設定を変更してください。
※このように臨機応変に見た目を安易に修正できる部分などはノーツの強みになります。

私のほうで作成したデータは下記のようになりました。

カナに「昇順」設定を行っておりますので、そのように並んで表示されます。


今回はここまでとさせて頂きます。

次回は引き続きこの「カナ順」ビューをさらに見やすくしたり、ちょっとした機能追加を行ってみたいと思います。