GrapeCity.devlog

グレープシティ株式会社のDeveloper Tools〈開発支援ツール〉の最新情報をお届けします。製品のTIPSや発売情報、イベントのお知らせなどをいち早く発信中です。

Windows Formsアプリケーションの高解像度モニタ対応

アプリケーションの画面が小さく表示される

PCを新しいモデルに新調した時に、いつも使っていた業務アプリケーションの画面が小さく表示されてしまった経験はないでしょうか。その原因はモニタの解像度が高くなったためです。

画像「1024×768ディスプレイでの表示」

解像度:1024×768ディスプレイでの表示

画像「1920×1080ディスプレイでの表示」

解像度:1920×1080ディスプレイでの表示

上図は、1024×768に最適なサイズで表示されるように作成されていたアプリケーションを、より解像の高いフルHD(1920×1080)のディスプレイで表示した例ですが、ご覧のようにアプリケーションの画面がディスプレイの一部に小さく表示されてしまっています。

これではアプリケーション上のコントロールが見づらく、操作もしづらいため、空いているスペースを使ってウィンドウサイズを広げたいと思うユーザーは多いはずです。しかし、日本の業務アプリケーションには、特定のディスプレイサイズで最適になるようにウィンドウサイズを固定して作成されている事例が非常に多くみられます。
これでは広くなったディスプレイの画面を有効に活用できておらず、アプリケーション利用者の作業効率にも影響すると言わざるを得ません。

このウィンドウサイズを固定する開発手法は、今ほど多種多様なサイズのディスプレイがなかった頃には、テストの工数の削減などの目的で用いられてきた常套手段ですが、近年ではその状況が一変してきており、高解像度・高精細ディスプレイはもとよりタブレットなどのPCが当たり前のように普及し、どんなデバイスで利用しても有効に活用できることが求められてきています。

InputManPlus for Windows Formsに含まれる「PlusPak(プラスパック)」コントロールは上記のような問題を解決するリサイズ(コントロールを拡大/縮小する)機能を搭載しています.

この記事では、高解像度ディスプレイへ対応することによる問題点、また、PlusPakを使用した解決方法を紹介していきます。


解決する課題

固定サイズで作成されたWindowsフォームアプリケーションを高解像度のディスプレイに対応するには、どのような課題があるでしょうか。

ウィンドウサイズのリサイズは、比較的容易にでき、FormクラスのFormBorderStyleプロパティをSizableに設定することで可能となります。

画像「1920×1080ディスプレイでの表示」

しかし単純にリサイズできるようにしただけでは、下図のように画面を最大化しても余白が広がるだけで意味がありません。

画像「リサイズ出来るようにしたアプリを1920×1080ディスプレイで表示」

これはWindowsフォームが絶対配置のレイアウトであるためで、コントロールをただフォームに配置しただけではフォームのリサイズに応じてコントロールの配置位置やサイズは変更されません。
リサイズに追従されるようにするには、例えばフォームのDockプロパティを使って上下左右にドッキングさせたり、Anchorプロパティで親コンテナとなるコントロールとの相対位置を指定したりといった設定が必要になります。

また、AnchorDockだけでは、フォーム全体のレイアウトを十分にデザインできない場合、FlowLayoutPanelTableLayoutPanelといったパネル系のコントロールを使って画面をレイアウトしていくといった手法もあります。

しかし、1つのフォーム上に非常にたくさんのコントロールが配置されることが多い日本の業務アプリケーションで、リサイズに対応できるようにアプリケーション作り込むことは、とても手間のかかることで現実的な解決策にならない場合も多いです。

PlusPakのリサイズ機能とは?

今回紹介するPlusPakのGcResize(リサイズ)コンポーネントは、アプリケーション実行時にフォームのリサイズを可能にするコンポーネントです。フォーム全体の比率が維持されたまま拡大/縮小されるのでレイアウトが崩れる心配もありません。

使い方は非常に簡単で、GcResizeコンポーネントをフォーム上にドラッグ&ドロップで配置してアプリケーションをビルドするだけです。フォームにこのコンポーネントを配置さえしておけば、どんなサイズのディスプレイでも使えるアプリケーションを構築することができます。

GcResizeコンポーネントの使い方
  1. リサイズを有効にしたいフォームをデザインビュー上に表示します。
  2. ツールボックスからGcResizeコンポーネントを貼り付けます。

    画像「ツールボックスからGcResizeをフォーム上に配置」

    ツールボックスからGcResizeをフォーム上に配置

  3. プロジェクトをリビルドします。

設定はこれだけで完了です。
あとは、アプリケーションを実行し対象のフォームをリサイズしてみると、フォーム全体の比率が維持されたまま拡大または縮小されることが確認できます。

PlusPakが提供するリサイズ機能

PlusPakには、前項で紹介したGcResizeコンポ―ネントを含む3つのリサイズ用のコントロール/コンポーネントが用意されています。
下表には、この3つのコントロール/コンポーネントの違いをまとめています。それぞれリサイズの対象が異なり、アプリケーションの用途やフォームのレイアウトに応じて使い分けが可能です。

コントロール名 リサイズ対象 ユースケース
GcResizeコンポーネント コンポーネントを配置したフォーム プロジェクト内の特定のフォームをリサイズする場合に有効
GcApplicationResizeコンポーネント プロジェクトに含まれるすべてのフォーム プロジェクト全体をリサイズする場合に有効
GcResizePanelコントロール GcResizePanel上に配置されたコントロール フォーム上の特定のコントロールのみリサイズする場合に有効
GcResize

フォーム上のすべてのコントロールがリサイズ対象になります。

画像「GcResize」

GcApplicationResize

プロジェクトのすべてのフォームがリサイズ対象になります。

画像「GcApplicationResize」

GcResizePanel

フォーム上の特定のコントロールをリサイズ対象にします。
下図の例ではチェックボックスリストとタブコントロールをリサイズ対象にしています。

画像「GcResizePanel」

サードパーティのコントロールに対応する方法

リサイズコントロールを使用するとフォームのリサイズにあわせてコントロールの拡大/縮小が可能になります。しかし、コントロールの一部には、このリサイズ処理が正常に動作しないものがあります。例えば、TreeViewコントロールを拡大するとコントロール自体は大きく表示されますが、フォントは変更されないため文字サイズは拡大されません。

そこで、PlusPakには、これらのリサイズ動作が不正になる部分をサポートするための機能として、リサイズポリシーという解決策が用意されています。リサイズポリシーとは、上記のような非対応のコントロールでも正しくリサイズされるようにプロジェクトに対応用のコードを追加する機能です。

コードを追加するといっても、いくつかのサードパーティのコントロールは、テンプレートとして予めPlusPakにインストールされているため、テンプレートを追加するだけで簡単に適用できます。

ここではSPREAD for Windows Formsを使用したリサイズポリシーの例を紹介します。
Resizeコンポーネントをフォームに追加しただけの場合、複数のシートを持ったSPREADのコントロールでは非アクティブなシート(※)は、リサイズされません。しかし、SPREAD用のリサイズポリシーのテンプレートをプロジェクトに追加すれば、非アクティブなシートもフォームのリサイズに対応することができます。

※ SPREADはExcelのように複数のシートを持つことができ、タブでシートを切り替えることができます。

複数のシートがあるSPREADコントロールのリサイズ
シート1 シート2
既定サイズ
リサイズ時
(リサイズポリシーなし)

※ シート1だけがリサイズされ、非アクティブなシート2はリサイズされない
リサイズ時
(リサイズポリシーあり)

※ シート1、シート2の両方がリサイズされる
リサイズポリシーの使用方法

リサイズポリシーはVisual Studio上でプロジェクトに追加して使用できます。

  1. [プロジェクト]メニューから[新しい項目の追加]を選択します。
  2. 左メニューの「共通項目」から「PlusPak for Windows Forms 8.0」を、中央の項目から該当するリサイズポリシーのテンプレート名を選択し〈追加〉ボタンをクリックします。

    画像「リサイズポリシーの追加」

  3. プロジェクトをビルドします。

  4. GcResize コンポーネントのスマートタグから「リサイズポリシーの編集...」を選択し、ResizePolicyコレクション エディターを起動します。
  5. ResizePolicyコレクション エディターの〈カスタムポリシーの追加〉ボタンを押下し、目的のリサイズポリシーを追加します。

    画像「ResizePolicyコレクション エディター」

リサイズポリシーのテンプレートとして提供しているグレープシティコンポーネントは以下の通りです。

  • ActiveReports for .NET
  • ComponentOne for WinForms
  • InputManPlus for Windows Forms(InputMan、PlusPak)
  • LEADTOOLS Imaging Pro
  • MultiRowPlus for Windows Forms(MultRow、CalendarGrid)
  • SPREAD for Windows Forms

補足

リサイズポリシーが、リサイズコントロールに組み込まれているのではなく、このようにテンプレートとして提供されているのにはいくつか理由があります。

1つはアセンブリ参照の問題を解決するためです。PlusPakのコントロールに内部にリサイズポリシーが実装されていると、サードパーティのアセンブリの参照は、特定のアセンブリバージョンで一意に決まることになります。 つまり、参照するアセンブリのバージョンが変わってしまうと参照エラーとなり、プロジェクトがビルドできなくなります。 PlusPakのリサイズポリシーはコードとしてプロジェクトに組み込むことになるため、プロジェクトの参照設定に追加されたアセンブリを参照するようになり、このような問題は発生しません。

この他の理由として、サードパーティのコントロールのアップデートによってリサイズポリシーが正しく機能しなくなってしまった場合にもメリットがあります。コードとして外出ししているため、直接コードを修正することができるので、最低限の変更でアップデートに対応できるようになります。

まとめ

本記事でご覧いただいたように、リサイズコントロールは非常に簡単に使えます。
ハードウェアの進歩により、アプリケーションを開発した当初には想定できなかった多種多様な環境での利用が、業務アプリケーションにも求められるようになってきています。しかし、本記事で取り上げたような画面サイズが固定されたアプリケーションの中には、修正のための十分な開発コストをかけられずに、不便なまま利用されていることも少なくないのではないでしょうか。

PlusPakのリサイズコントロールを利用すると、このような課題に対して、最小限の作業負担で問題解決が可能になります。 これらの機能を使うことで、より効率的、より快適な開発環境を築くことができます。

今回紹介した機能の他にも、PlusPakコンポーネントにはさまざまな機能を揃えており、各機能はデモアプリケーションで体感できます。


PlusPakデモアプリケーション


参考情報