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

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

2012年8月15日水曜日

ビューを配置すると、横スクロールバーが表示されてしまう

・・・えーっと、もうすぐ3ヶ月が経過しますね。いやぁ、仕事をしていなかったわけでもないですし、ノーツをやめたわけでもないんですよ。しっかり働いてましたよ。

色々あったんですよ、色々。

ということで、そろそろ再開しないといけないので、再開します。
再開記念にクリックお願いします。もう、ランキングもすごい下がっちゃいましたけど(涙)
にほんブログ村 IT技術ブログへ



これからしばらくはXPagesネタです。Lotus Scriptや@関数は、そろそろ書き尽くした感があるので。
もし、このクラスの使い方が知りたい!とか、この関数はどう使えば良いの?というのがあれば、「匿名」ではない状態で、コメントください。
そしたら、考えます。



さて、復帰作なので、簡単なところから。

XPages では、色々なコントロールを追加できます。ビューなんかも追加できますね。
下図は、ビューコントロールを配置したXPagesのサンプルです。
ビューコントロールを配置したXPagesのサンプル

よくみると、画面の下にスクロールバーが表示されています。

これは、ビューコントロールの表示幅を100パーセントにしているからです(下図参照)。
ビューコントロールの表示幅を設定

100パーセントにしているのであれば、画面幅いっぱいということでスクロールして欲しくないんですけど、してしまうものは仕方がありません。どのように解決しましょうか?

簡単なのは、余白を設定することです。
ビューコントロールのプロパティビューの中に「余白」タブがあるので、そこを表示します。
すると、余白の設定画面になります。ここで気をつけたいことがあります。余白には「余白(内側)」と「余白」の2種類があります。
XPage の設計画面を「ソース」に切り替えると わかるのですが、「余白(内側)」はpadding-xxxxで、「余白」は、margin-xxxxというCSSです。
ここでは、表の右側に余白を持たせたいので、「余白(内側)」の右に余白を設定します。分かりやすくするため、10ピクセルとします(下図参照)。
余白の設定

これで、XPageを保存してプリビューしてみましょう。
余白を設定したビューコントロールのプリビュー

どうでしょう?スクロールバーが消えたのが分かりますね。これですっきりしました。

他の方法としては、「パネルコントロール」を追加して、その中にビューコントロールを移動します。
そして、パネルコントロールに余白を設定するのです。この場合、パネルコントロールの余白は「余白(内側)」でも「余白」でも、どちらでも構いません。

こちらにしておくと、パネルの中に、他のコントロールを配置しておくことで、同時にコントロールの更新が行えるという利点があります。


お好きな方をどうぞ、お使いください。







【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ

0 件のコメント: