PR

PanelとDataGridのドラッグ&ドロップ

2010年8月26日(木)
PROJECT KySS

ロジックコードを記述する

ソリューションエクスプローラ内のMainPage.xamlを展開し、MainPage.xaml.vbをダブルクリックしてコード画面を開きます。

リスト3のようにロジックコードを記述します。

リスト3: ロジックコード(MainPage.xaml.vb)

XML to LINQでXMLを処理するクラスの含まれるSystem.Xml.Linq名前空間を読み込んでおきます。ImageコントロールのSourceプロパティに画像を指定するクラスの含まれる、System.Windows.Media.Imaging名前空間を読み込んでおきます。

■ページが読み込まれた時の処理

XElement.LoadメソッドでXML文書ファイル(photo_etc.xml)を読み込みます。

読み込んだXML文書ファイルから、要素のコレクションを取得するクエリ(query)を定義します。queryを実行します。クエリコレクション内を反復処理する変数resultを使って、以下の処理を繰り返し実行します。

新しいImageのインスタンスmyImageオブジェクトを生成します。Width、Heightプロパティに画像のサイズを指定します。Cursorプロパティには手の形が表示されるようHandを指定します。Sourceプロパティには、フォルダ名のImageを連結した、要素の値を相対Uriで指定します。WrapPanel内に表示される画像の余白をMarginプロパティで5に指定します。Tagプロパティに1ずつ増加する変数iの値を持たせておきます。この値は、ドラッグ&ドロップされた画像の「説明」を特定するインデックスとして使用します。

fromWrapPanelコントロールにmyImageオブジェクトを追加します。myImageオブジェクトの上でマウスの左ボタンが押された時(MouseLeftButtonDownイベント時)、myImage_MouseLeftDownプロシジャを実行します。

■画像の上でマウスの左ボタンが押された時の処理

ImageのTagプロパティの値を取得します。取得した値はObject型であるため、CInt関数で整数型に変換して変数noに格納しておきます。

■右側のPanelDragDropTargetコントロールに画像がDropされた時の処理

変数noに該当するインデックスの要素の値を取得します。TextBox1コントロールに、取得した、要素の値を順次追加していきます。Dropした画像の説明が順次表示されていきます。

■ドラッグ先から画像をドラッグ元にドラッグした場合の処理

変数noに該当するインデックスの要素の内容を取得します。Replaceメソッドで、要素の内容を消去します。これで、ドラッグ先の画像がドラッグ元に返されたとき、表示されていた画像の説明は消去されます。

四国のSOHO。薬師寺国安(VBプログラマ)と、薬師寺聖(デザイナ、エンジニア)によるコラボレーション・ユニット。1997年6月、Dynamic HTMLとDirectAnimationの普及を目的として結成。共同開発やユニット名義での執筆活動を行う。XMLおよび.NETに関する著書や連載多数。最新刊は「Silverlight実践プログラミング」両名とも、Microsoft MVP for Development Platforms - Client App Dev (Oct 2003-Sep 2012)。http://www.PROJECTKySS.NET/

連載バックナンバー

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています

PanelとDataGridのドラッグ&ドロップ | Think IT(シンクイット)

Think IT(シンクイット)

サイトに予期せぬエラーが起こりました。しばらくたってから再度お試しください。