ページビューの合計

2016年10月24日月曜日

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

皆様、こんにちは!!

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

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

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



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


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

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


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


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

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


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


実に簡単ですよね。

せっかくなので、2列目の設定を確認しておきましょう。
2列目をクリックしていただくと、
※もしプロパティが【表】以外になってしまいましたら、右側の▼をクリックして、【表】を選択してください。


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

つまり表示するディスプレイの余白にあわせて、自動で列幅が変更されます。
※逆に常に幅を固定したい場合は、表の【幅】で【固定幅】を選択することで可能になります。

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

まず表の1行目を選択、プロパティを【文字】に切り替えます。
【サイズ】を"14"、【スタイル】に"太字"を選択します。


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

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


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


以上、少しの設定で、それなりに見やすいフォームになります。
もちろん色やサイズはお好みで自由に設定頂けます。

さて次回は新しいビューとして、【カテゴリ別】というものを作成します。
またこのカテゴリ別のビューを利用し、フォームのカテゴリをチューンナップします。

2016年10月18日火曜日

【第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でプレビュー]を行うと、


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


今回は以上です。

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

2016年10月11日火曜日

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

皆様、こんにちは!

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


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

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

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

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

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

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


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


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

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

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


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


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

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


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

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

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

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

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

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


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


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

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

2016年9月26日月曜日

【第4回】ノーツアプリ作成~ビューの作成~

皆様、こんにちは!
3月決算の会社様は半期決算前のお忙しい時期かと思います。
弊社も同じく、バタバタしておりますが、なんとか記事が間に合いました。



前回はフォームに作成した表の中に、フィールドを作成する手順を記載しました。
今回はテストデータを1件入力し、ビューを作成してみましょう。

テストデータを先に作成する必要はないのですが、ビューでの表示を確認しながら作ることができますので、今回は先に作成します。


まずはデザイナー画面で、前回作成中の「メインフォーム」を開きます。
前回最後にプリビューした手順、メニューから[設計]-[IBM Notes でプリビュー]をクリックし、ノーツクライアントでフォームを開きます。


こちらにテストデータを入力します。
内容は適当で構いませんが、できれば文字数などは実データに近いほうが後の手直しが少なくて済みます。
名刺画像については、先般説明させて頂きましたが、ビューで表示することができませんので、今回は不要です。


今回はテストデータですので、カナ項目については、全半角も意識せずに入力頂いて構いません。
名刺画像を除く、すべてのデータ入力が完了しましたら、【ESC】を押してください。
※ノーツで【ESC】キーは現在使用している画面(タブ)を閉じる際に便利なキーですので、ぜひ慣れるようにしてください。


文書の保存確認ダイアログが表示されますので、【はい】をクリックします。

以上でテストデータが登録されました。
テストデータは数件作成頂いても構いませんが、今回は1件で進めさせて頂きます。


デザイナー画面左の【ビュー】をダブルクリックしてください。


フォームと違い、デフォルトでひとつ【無題】というビューが存在しています。
今回は新規のビューをひとつ作成します。

上部の【新規ビュー】ボタンをクリックすると、新規ビューの作成ダイアログが表示されます。


今回は氏名のカナ順に表示するビューを作成します。

ビュー名に「氏名カナ順|bykana」と入力し、種類はデフォルトの「共有」のままとします。
※"|"以下の部分は、前回のフォームと同様、別名となります。
※ビューの種類についは、機会あれば後日説明致します。

上記のようになるかと思いますので、【OK】をクリックすると、ビューが作成されます。


作成された「氏名カナ順」ビューをダブルクリックで開いてください。

上記赤丸部分に更新マークが表示されていますので、こちらをクリックすると、先に登録したテストデータがプリビューされます。


1列目の"#"列は「ビューの#」となっておりますので、こちらを変更します。

赤く囲まれた【フィールド】を選択してください。
下に現在までに作成されたフィールド一覧が表示されますので、ここから【kana】をクリックします。

先と同様、更新マークが表示されますので、こちらをクリックすると、1列目にテストデータに入力した氏名カナが表示されます。


続いて、この列の細かな設定を加えます。

【#】と表示されている列タイトルをダブルクリックし、列のプロパティを開きます。

タイトルに「カナ」と入力し、左から2番目のタブでソートを「昇順」とします。


テストデータが1行ですので、細かな確認はできませんが、以上で1列目にカナが昇順で並び替えられて表示することが可能となります。


今回は以上でビューを作成するという流れまでを説明させて頂きました。

次回はさらにこのビューに項目を追加し、見やすいものと致します。

2016年9月20日火曜日

【第3回】ノーツアプリ作成~フィールドの作成~

皆様、こんにちは!!
神戸は間もなく台風16号が再接近するようで、時折たたきつけるような雨が降っております。

と、まさに今、神戸市内の土砂災害警戒区域に「非難準備情報」が発令されました!!


さて前回は作成したアプリケーションにフォームを作成し、フォームに表を作るまでを行いました。
今回はその表の中に、ラベルとフィールドを作成します。

ラベルとは、フィールドにどのような内容が入力されているのか、わかるようにするためのもの。
フィールドは実際のデータを入力するための器になります。

内容は【第0回】で掲載しました下記画像を元に作成していきます。


まずはラベルを作成していきましょう。
とはいってもラベルというものは設計要素ではありませんので、直接フォームに文字入力します。

上記画像の通り、1行1列目に「氏名」、2行目に「カナ」というように、すべての項目を入力してください。


上記のようになりました。

続いて各ラベルに対応するフィールドを作成していきます。
1行2列目のセルを選択し、メニューから【作成】-【フィールド】をクリックするか、ツールバーの【フィールドの作成】ボタンをクリックします。

[無題]というフィールドが作成され、フィールドのプロパティが開きます。


このプロパティを使用し、項目に設定を加えます。

このフィールドは氏名を表示しますので、名前に[name]と入力します。
種類は氏名は文字入力項目ですので、[テキスト]のままで構いません。
フィールドの名前も、データベースの物理名称と同様に2バイト文字も利用できますが、式から呼び出すことも想定し、半角英数をお勧めします。
※先頭文字を大文字にされる方もいらっしゃいますが、こちらはお好みで構わないかと思います。


同じように文字入力項目を先に作成してみましょう。


[項目] [フィールド名前]
カナ kana
会社名 company_name
会社カナ company_kana
カテゴリ category
部署 post
役職 position
FAX番号 fax
郵便番号 zip
住所2 address2



続いて同じテキストでも、リッチテキストフィールドというものを作ってみましょう。

メールアドレス ラベルの右列に先と同様にフィールドを作成し、名前を[mail]とします。
種類には[リッチテキスト]を選択します。


リッチテキストには文字だけでなく、文字に属性(色やサイズ)を与えたり、リンクにしたり、ファイルや画像を添付することが可能となります。

となると先のテキストもリッチテキストにしたほうが簡単で便利なのではと思われるかもしれませんが、これには大切な理由があります。
リッチテキストフィールドは後に作成します【ビュー】の項目にすることができません。
従って、ビュー(一覧)に表示したい項目は、リッチテキストにすることはできないのです。

それではこちらも同じようにリッチテキストフィールドを作成してみましょう。

[項目] [フィールド名前]
電話番号 tel
携帯電話 mobile
住所1 address1
ホームページ homepage
名刺画像 pict


続いて性別フィールドです。
性別の選択肢は男女のふたつですので、入力しやすいようにラジオボタンで設定してみます。

性別 ラベルの右列にフィールドを作成し、名前を[sex]とします。
種類には[ラジオボタン]を選択してください。


続いてラジオボタンの設定を行います。
フィールドのプロパティボックスで左から2番目のタブをクリックします。


こちらで選択肢や並びを設定します。

列の数を[2]に変更します。
選択肢には
男|1
女|2

と入力します。


"|数字"の部分は省略しても構いませんが、"|"以降が「別名」として扱われます。
別名ですので、実際の入力時には表示されませんが、後に式でフィールドを呼び出すような場合に便利ですので、必要に応じて設定してください。

ここまでできたら、一度ノーツでプリビューしてみましょう。
メニューから[設計]-[IBM Notes でプリビュー]をクリックします。

するとノーツクライアントが起動し、フォームが編集モードが開きます。


以上で今回のフィールド一式が作成できました。

フィールドにはその他にもいろいろな種類がありますが、今回はここまでとします。


なお今回は初回ということで、表やラベルをすべて手入力で作成しましたが、【第0回】の依頼項目がデータとして手元にある場合、そのデータをコピーし、直接【フォーム】に貼り付けることも可能であり、かなり簡素化が可能です。

次回は数件のテストデータを登録し、ひとつビューを作成してみます。

2016年9月12日月曜日

【第2回】ノーツアプリ作成~フォームの作成~

皆様、こんにちは!!
9月に入りましたが、まだまだ暑い日が続きますね。
土曜に芦屋浜に出かけましたが、しっかり日焼けしてしまいました(汗


さて前回はアプリケーションそのものの作成までを行いましたが、今回は主要な設計要素のひとつである【フォーム】を作成します。

デザイナー画面の左メニューで【フォーム】をダブルクリックしてください。
下記のような画面が表示されます。


上部の【新規作成】ボタンをクリックすると、新規フォームのダイアログが表示されます。


アプリケーションには【名刺管理:meisi.nsf】と表示されておりますので、そのままにしておきます。

名前・別名・コメントは特に自由なのですが、今回は

名前に「メインフォーム」
別名に「mainForm」

と入力し、【OK】します。

別名は必須項目ではありませんが、後から式で指定する場合や、先々にフォーム差し替えたい場合(※)などで利用できますので、できれば指定することをお勧めします。
またフォーム名を例えば「名刺フォーム」というような個別を識別できるような分かりやすい名称にせず、一般的な名称にしたのにも理由があります。
今回は一つ目のアプリケーションとして作成していますが、例えば次に作成するアプリのフォームも同じ名称にします。
すると、今後作成する新規作成ボタンが同じ設計で動くようになります。
実際にはデザイナー内でコピー&ペーストすることで利用可能になります。
このようにひとつのアプリで作成した設計要素は他のアプリで簡単に再利用できるのもノーツの特徴になります。
ちょっとしたコツですが、今後たくさんのアプリを作成していくことになった場合に便利なTipsですので、ぜひ覚えておいてください。

さて本題ですが、【メインフォーム-フォーム】という新しいタブが開き、フォーム作成画面が表示されました。


まずはフォームの中身を分かりやすくするように、「名刺管理」と入力します。
前後に改行を入れておりますが、こちらは見栄えだけになりますので、特に設計に影響はありません。

また名刺管理の文字を選択し、上部のツールバーや【文字】メニューで色やサイズ、デザインもご自由に選んでください。
今回は青の18ptとしています。


次に表を作成します。
ノーツのフォームでは、表を用いてレイアウトを調整することが多くなります。
今回は、1列目に項目名を、2列目にデータを配置しますので、表を使うことで、2列目の位置を一定にし、見やすくすることができます。

上部【作成】メニューから【表】をクリックすると、下記のような表の作成ダイアログが表示されます。
【第0回】の表をフォームにしますので、2列17行の表を挿入します。


表の幅もいずれを選択していただいても見た目の違いのみになりますが、今回は【マージンにあわせる】を選択しました。
表の種類についてもいくつかありますが、デフォルトで選択されている「基本的な表」のままで【OK】します。

下記のようにフォーム内に指定した行列数の表が作成されました。


それでは一度、ノーツクライアントでフォームをプリビューしてみます。
【設計】メニューから【IBM Notes でプリビュー】をクリックしてください。


フォームの保存ダイアログが表示されますので、【はい】をクリックすると、ノーツクライアントでプリビュー表示されます。


以上、今回はフォームの作成と文字入力や表の挿入について記載致しました。

次回は今回の表にフィールドを作成して参ります。

※フォームの差し替えとは
今回作成したフォームを全く別のフォームにしたいような場合、フォームそのものを差し替えると今後設定するさまざまな要素すべてを検証し、書き換える必要があります。
しかし、別名を指定することで、新たに作成したフォームの別名を今回の「mainForm」とし、現在のフォームの別名を「oldForm」等に変更することで、その他の設計要素の変更を行うことなく、フォームの差し替えを行うことができます。

2016年9月5日月曜日

【第1回】ノーツアプリ作成~アプリケーションの作成~

皆様、こんにちは!!

前回はノーツアプリの作成について、ユーザー目線での準備について書かせて頂きました。

今回はいよいよアプリを作ってみましょう。

実はアプリを作成するのはDomino Designer(以降、デザイナーと書かせて頂きます)がなくても可能なんです。
Notesクライアントにて[ファイル]-[アプリケーション]-[作成]をクリックすれば、新規作成ダイアログが表示されます。

今回はデザイナーから新規作成しますが、デザイナーの場合は、[ファイル]-[アプリケーション]-[新規]をクリックします。


まずは新規作成ダイアログについて簡単に説明致します。

サーバーはアプリケーションの作成場所を選択し、デフォルトで[Local]が表示されます。
既にDominoサーバーが構築され、接続されていることがほとんどかと思いますので、プルダウンを選択すると、対象のDominoサーバーも選択できます。

テキスト等では、まずLocalに作成し、完成してからサーバーにコピーすると記載されていることが多いかと思います。
理由としては、遠い記憶ですが、作成するまでに他のユーザーからアクセスされることを回避するためだそうです。
※サーバー上にアプリケーションが存在しなければ、テストできない事項もありますので、臨機応変に対応すればいいかと思います。

弊社では、依頼ユーザーと内容確認を行いながら開発することが多いため、ほとんどの場合サーバーに直接作成しています。

今回はテキスト通り、Localに作成することと致します。


次にタイトルです。
こちらはアプリケーションの名称となりますので、自由に付けることが可能です。
今回は「名刺管理」としました。

ファイル名はアプリケーションの物理的なファイル名を指定します。
2バイト文字も利用できるようですが、先々他のアプリケーションから参照するようなことも想定し、基本は英数半角をお勧めします。拡張子は.nsfとなります。
今回は「meisi.nsf」としました。
拡張子[nsf]はノーツアプリケーションをあらわします。ちなみにアプリケーションテンプレートは[ntf]になります。

テンプレートの指定項目では、既存テンプレートの設計を利用したアプリケーションを作成する場合に選択します。
今回は全く新規のアプリケーションを作成しますので、デフォルトの「-未入力-」のままで構いません。

以上確認し、[OK]をクリックすると、アプリケーションが作成されます。


以上でまっさらのアプリケーションが作成された状態となります。
こちらにさまざまな設計要素を作成し、アプリケーションを形作ることとなります。


次回は以前にも記載しましたが、まずは【フォーム】を作成致します。