SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

ComponentZine(ComponentOne)

Windows 8風の操作パネルを持った.NETアプリケーションの作成

ComponentOne Studioを活用したWindowsフォームアプリケーションの作成

  • X ポスト
  • このエントリーをはてなブックマークに追加

タイルとグループの設定

 次にタイルを追加し、タイルとグループの設定を行います。デフォルトでタイルは1つのグループと3つのタイルが用意されています。このグループにタイルを2つ追加して5つにし、タイルのサイズとテキスト・イメージを設定します。

 ① タイルの上でコンテキストメニューを表示し、「グループの編集」メニューをクリックします。

コンテキストメニューから「グループの編集」メニューをクリック
コンテキストメニューから「グループの編集」メニューをクリック

 ② C1TileControl.Groupsコレクションエディタが表示されますので、右ペインにある「Tiles」プロパティの「...」ボタンをクリックします。

 Group.Tilesコレクションエディタが表示されるので、「追加」ボタンを2回クリックし、タイルを2つ追加します。

 自動的にフォームのC1TileControlコントロールにもタイルが2つ追加されます。

「追加」ボタンを2回クリックし、タイルを2つ追加する
「追加」ボタンを2回クリックし、タイルを2つ追加する

 ③ 最初のタイル「タイル1」をクリックし、次のプロパティを設定します。

 「Text1」「Text2」「Image1」がタイル内に実際に表示するデータです。「HorizontalSize」「VerticalSize」はタイルの縦横のサイズ、「BackColor」 はタイルの背景色、「Template」は適用するテンプレートの名前です。このプロパティによって、タイルとテンプレートが関連付けられます。

プロパティ 設定値
Text1 <文字列データ>
Text2 <文字列データ>
Image1 <画像データ>
HorizontalSize 3
VerticalSize 5
BackColor LightCoral
Template Template1
Text (なし)

 ④ 同様の方法で、残りのタイルのプロパティを設定します。「Template」プロパティはすべてのタイルで「Template1」を指定してください。これで、共通のデザインが適用されます。

2番目のタイルのプロパティ設定
プロパティ 設定値
Text1 <文字列データ>
Text2 <文字列データ>
Image1 <画像データ>
HorizontalSize 3
VerticalSize 5
BackColor Teal
Template Template1
Text (なし)
3番目のタイルのプロパティ設定
プロパティ 設定値
Text1 <文字列データ>
Text2 <文字列データ>
Image1 <画像データ>
HorizontalSize 3
VerticalSize 5
BackColor SteelBlue
Template Template1
Text (なし)
4番目のタイルのプロパティ設定
プロパティ 設定値
Text1 <文字列データ>
Text2 <文字列データ>
Image1 <画像データ>
HorizontalSize 3
VerticalSize 5
BackColor Olive
Template Template1
Text (なし)
5番目のタイルのプロパティ設定
プロパティ 設定値
Text1 <文字列データ>
Text2 <文字列データ>
Image1 <画像データ>
HorizontalSize 3
VerticalSize 5
BackColor DarkGoldenrod
Template Template1
Text (なし)
テキスト・イメージ要素とデザインを設定したタイル
テキスト・イメージ要素とデザインを設定したタイル

 ⑤ 各タイルの設定が終わったら、Group.Tilesコレクションエディタを閉じます。

 そして、C1TileControl.Groupsコレクションエディタで「Text」プロパティの値「グループ1」を削除します。自動的に、フォームのグループ名も削除されますので、C1TileControl.Groupsコレクションエディタを閉じます。

 ⑥ 最後にタイトルを設定します。C1TileControlコントロールをクリックし、プロパティウィンドウの「Text」プロパティの値を「C1TileControl1」から「プロジェクト管理のガントチャートを作成するC1GanttViewコントロール」に変更してください。このプロパティが、コントロールのタイトル文字列になります。

 以上で出来上がりです。

まとめ

 C1TileControlコントロールは、タッチパネルの操作という新しい形のGUIに対応したコントロールです。もちろんデスクトップでも使えますが、今後タブレットPCなどに対応したアプリケーションを開発する際に、威力を発揮するコントロールといえるでしょう。

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
ComponentZine(ComponentOne)連載記事一覧

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7288 2013/07/29 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング