PanelとDataGridのドラッグ&ドロップ
ロジックコードを記述する
ソリューションエクスプローラ内の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メソッドで、要素の内容を消去します。これで、ドラッグ先の画像がドラッグ元に返されたとき、表示されていた画像の説明は消去されます。