方法 : ImageButton Web サーバー コントロールで座標を決定する

更新 : 2007 年 11 月

ユーザーが ImageButton コントロールをクリックしたときに、コントロールの Click イベントのイベント ハンドラに渡されるパラメータに、ユーザーがクリックした場所を示す座標が含まれます。これにより、ユーザーのクリック位置に応じて異なる処理を実行できます。

メモ :
イメージの特定の領域をユーザーがクリックできる領域として定義する場合は、ImageMap コントロールも使用できます。

座標情報は、ImageButton コントロールで発生する Click イベントのイベント引数オブジェクトの一部として送信されます。

ユーザーのクリック位置の座標を判定するには

1. ImageButton コントロールの Click イベントのイベント ハンドラを作成します。メソッドのイベント引数オブジェクトは、ImageClickEventArgs 型である必要があります。

2. Click イベント ハンドラでは、ImageClickEventArgs 引数オブジェクトの X プロパティおよび Y プロパティを取得します。

   x 座標と y 座標は、イメージの左上を (0,0) とするピクセル単位の値で表されます。

   100×100 ピクセルのグラフィック内で、ユーザーがクリックした位置を判定する場合のコード例を次に示します。このコードは、まずユーザーがクリックした位置の x 座標と y 座標を取得します。次に、取得した座標を事前に定義された値と比較して、特定の象限でユーザーがクリックしたかどうかを調べます。結果は Label コントロールに表示されます。

   Protected Sub ImageButton1_Click(ByVal sender As System.Object, _
         ByVal e As System.Web.UI.ImageClickEventArgs) _
         Handles ImageButton1.Click
      Dim msg as String = ""
      Dim x As Integer = e.X
      Dim y As Integer = e.Y
   
      ' The button graphic is assumed to be 100x100 pixels.
      ' This checks coordinates against predetermined values that
      ' make up quadrants of the picture.
      If x >= 50 And y >= 50 Then
         msg = "Southeast"
      ElseIf x >= 50 And y < 50 Then
         msg = "Northeast"
      ElseIf x < 50 And y >= 50 Then
         msg = "Southwest"
      ElseIf x < 50 And y < 50 Then
         msg = "Northwest"
      End If
      Label1.Text = msg
   End Sub
   

   protected void ImageButton1_Click(object sender, 
       System.Web.UI.ImageClickEventArgs e)
   {
       string msg = "";   
       int x = e.X;   
       int y = e.Y;   
   
       // The button graphic is assumed to be 100x100 pixels.
       // This checks coordinates against predetermined values that
       // make up quadrants of the picture.
       if(x >= 50 && y >= 50)
       {
           msg = "Southeast";
       }
       else if(x >=50 && y < 50)
       {
            msg = "Northeast";
       }
       else if(x < 50 && y >= 50)
       {
           msg = "Southwest";
       }
       else if(x < 50 && y < 50)
       {
           msg = "Northwest";
       }
       Label1.Text = msg;
   }
   

参照

参照

Button Web サーバー コントロールの概要