SHOEISHA iD

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

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

ComponentZine(ComponentOne)

コンテキストメニューを持ったSilverlightアプリケーションの作成

ComponentOne Studio for SilverlightのC1ContextMenuコントロールを使ったWebページの作成

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

C1ContextMenuコントロールについて

 C1ContextMenuコントロールを使用すると、Windowsフォームで良く利用されているコンテキストメニューと同様の機能を、Silverlightアプリケーションでも利用できます。また、他のコントロールに関連付けて使用することで、1つのWebページにコンテキストメニューをいくつでも組み込むことが可能です。

C1ContextMenuコントロールの実装方法

 XAMLでC1ContextMenuコントロールを使うためには、メニューをポップアップさせたいコントロールの要素内に、C1ContextMenuコントロールを記述します。

 その際、C1ContextMenuServiceクラスを使って、C1ContextMenuコントロールとそのコントロールを関連付けます。また、メニュー項目を設定する場合はC1MenuItemクラスを使用します。メニュー項目名は、C1MenuItemクラスのHeaderプロパティに設定します。

 次の記述は、TextBoxコントロールにコンテキストメニューを設定したXAMLの記述例です。

<TextBox Width="300" Height="400">
    <c1:C1ContextMenuService.ContextMenu >
        <c1:C1ContextMenu x:Name="cmenu1" ItemClick="cmenu1_ItemClick">
            <c1:C1MenuItem Header="コピー" >
        </c1:C1ContextMenu>
    </c1:C1ContextMenuService.ContextMenu>
</TextBox>

 このように、TextBoxコントロールの中に「C1ContextMenuService」を、その中にC1ContextMenuコントロールを記述し、さらにその中に「C1MenuItem」を使ってメニュー項目を設定します。

 また、メニュー項目にイメージ画像を設定することもできます。これは、C1MenuItemクラスのIconプロパティを使用します。

メニュー項目にアイコンを設定できる
メニュー項目にアイコンを設定できる

 C1ContextMenuコントロールのデフォルトのイベントは「ItemClick」で、メニュー項目を選択すると発生します。選択したメニューの処理は、このイベントハンドラに設定します。

WindowlessプロパティをTrueに設定する

 C1ContextMenuコントロールを使用するには、プラグインのWindowlessプロパティを「True」に設定する必要があります。この処理を行っておかないと、アプリケーション実行時にこのプロパティに関するエラーメッセージが表示されます。

 ただし、コントロールがプラグインのプロパティを変更することはできないため、ページの作成者があらかじめWindowlessプロパティを「True」に設定しておきます。Windowlessプロパティは、プロジェクトにある「xxxTestPage.aspx」ファイル(xxxはアプリケーション名)に追加します。

 ソリューションエクスプローラでこのファイル名をダブルクリックして開きます。

プロジェクトにある「xxxTestPage.aspx」ファイルをダブルクリックで開く
プロジェクトにある「xxxTestPage.aspx」ファイルをダブルクリックで開く

 [ソース]タブをクリックするとコードが表示されます。

[ソース]タブをクリック
[ソース]タブをクリック

 <body>セクションにある<param>セクションに、次のプロパティ設定を追加します。

<param name="Windowless"  value="true" />
Windowlessプロパティを「True」に設定するコードを追加する
Windowlessプロパティを「True」に設定するコードを追加する

 これで、Silverlightアプリケーションでコンテキストメニューを表示できるようになります。

Webページの作成

 では、Webページを作成してみましょう。グリッドは1行2列に設定します。左側のグリッドにTextBoxコントロールを配置し、右側のグリッドにCanvasを配置して、グラフィックスオブジェクトの三角形を描画します。

コントロールのレイアウト(GridのShowGridLinesプロパティを「True」にしてグリッド線を表示)
コントロールのレイアウト(GridのShowGridLinesプロパティを「True」にしてグリッド線を表示)

Silverlightプロジェクトの作成

 まず、Silverlightプロジェクトを作成します。Visual Studioで新しいプロジェクトを作成すると[プロジェクトの種類]に[Silverlight]が追加されています。これを選んで[テンプレート]から[Silverlightアプリケーション]を選択します。

[Silverlightアプリケーション]を選ぶ
[Silverlightアプリケーション]を選ぶ

 「新しいSilverlightアプリケーション」というダイアログボックスが表示されるので、[新しいWebプロジェクトの種類]でリストから[ASP.NET Webサイト]を選びます。

リストから[ASP.NET Webサイト]を選ぶ
リストから[ASP.NET Webサイト]を選ぶ

 プロジェクトが作成され、新しいWebサイトに「MainPage.xaml」が作られてXAMLのコードが表示されます。

次のページ
TextBoxコントロールにコンテキストメニューを組み込む

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

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

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

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

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

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

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/5918 2011/10/13 16:29

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング