如何在觸摸事件中的圖像上顯示交叉標記？

Question

在我的項目中有一個圖像。當用戶觸摸圖像中的任何地方時，應該用十字標記標記。此外，我們必須通過點擊按鈕清除此十字。我設法顯示圖像。在ontouchlistener()函數中我需要做什麼來顯示交叉點？請幫忙。

Answer 1

我想創建一個自定義ImageView，是這樣的：

public class MarkableImageView extends ImageView { 

    ArrayList<Marker> mMarkers; 

    // ... 

    @Override 
    protected void onDraw(Canvas canvas) { 
     super.onDraw(canvas); 

     for(Marker m : mMarkers) { 
      // draw the marker 
     } 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent e) { 
     if (e.getAction() == MotionEvent.ACTION_DOWN) { 
      mMarkers.add(new Marker(e.getX(), e.getY())); 
      invalidate(); 
      return true; 
     } 
     return false; 
    } 

    public void reset() { 
     mMarkers.clear(); 
     invalidate(); 
    } 

    // this class will be visible only inside MarkableImageView 
    private class Marker { 
     public int x; 
     public int y; 
     // you might want to add other properties, for example 
     // if you need to have different types of markers 

     public Marker(int x, int y) { 
      this.x = x; 
      this.y = y; 
     } 
    } 
} 

Answer 2

使用2個圖像有兩個ImageView的 - 一個沒有十字標記說no_cross.png - image_view1。 - 另一個與交叉標記說with_cross.png - image_view2。

將它們放在xml中的相同位置。最初image_view2（containsig with_cross.png）的可見性是不可見的。

android:visibilty="gone" 

OnImage touch會將with_cross.png顯示爲visible並將no_cross.png顯示爲不可見。

setVisibility(View.GONE)爲image_view1 setVisibility(View.VISIBLE)用於image_view2

在按鈕觸摸做反向。

setVisibility(View.VISIBLE)爲image_view1 setVisibility(View.GONE)爲image_view2

Answer 3

此代碼的工作100％。如果您還有任何問題，請聯繫我。

public boolean onTouchEvent(MotionEvent event, MapView mapView) 
{ 
    if (event.getAction() == 1) 
    {     
      GeoPoint p = mapView.getProjection().fromPixels(
       (int) event.getX(), 
       (int) event.getY()); 
       Toast.makeText(getBaseContext(), "lat and longtd is \n "+ 
        p.getLatitudeE6()/1E6 + "," + 
        p.getLongitudeE6() /1E6 , 
        Toast.LENGTH_LONG).show(); // 
       mapView.getOverlays().add(new MarkerOverlay(p)); 
       mapView.invalidate(); 
    } 

    return true; 
} 

並且還定義了另一個（第二個）覆蓋類......這個事件將得到。

class MarkerOverlay extends Overlay 
{ 
    private GeoPoint p; 
    private Projection projection; 

    public MarkerOverlay(GeoPoint p) 
    { 
     this.p = p; 
    } 

    @Override 
    public boolean draw(Canvas canvas, MapView mapView,boolean shadow, long when) 
    { 
     super.draw(canvas, mapView, shadow);     

     //---translate the GeoPoint to screen pixels--- 
     Point screenPts = new Point(); 
     mapView.getProjection().toPixels(p, screenPts); 

     //---add the marker--- 
     Bitmap bmp = BitmapFactory.decodeResource(getResources(),R.drawable.pir_pictr);    
     canvas.drawBitmap(bmp, screenPts.x, screenPts.y-50, null); 

     return true; 
    } 



} 

Answer 4

我也在尋找解決方案。我需要在用戶觸摸的圖像上做出圓形標記。我也將用此信息遠程控制設備。我發現作爲我將在下面提供的解決方案。我面臨的問題是dpi和設備屏幕會改變這種標記操作需要校準。我正在嘗試改進此方法。但也可能對某人有用。

這就是：

1）方法：首先創建圖像與像瘸子或Photoshop（或程序...）。在佈局中，放置一個imageview。將圖像以原始大小放到該圖像視圖中。 （這是＃1的弱點）。對於onTouchEvent添加下面的代碼。什麼代碼將會創建2個drawable。創建2個圖層。第一層是圖像（上圖），第二層是圖像。然後將標記放在用戶觸摸的位置。 （這是＃2的弱點）。

2）代號：

// On the top 
public ImageView ptable; 
Drawable[] layers; 

然後

//OnCreateView 
ptable = (ImageView)rootView.findViewById(R.id.img_ptable); 
layers = new Drawable[2]; 
layers[0] = r.getDrawable(R.drawable.pratik); 
layers[1] = r.getDrawable(R.drawable.pratik); 
LayerDrawable ldr = new LayerDrawable(layers); 
ptable.setImageDrawable(ldr); 

然後

ptable.setOnTouchListener(new OnTouchListener() { 

     @Override 
     public boolean onTouch(View v, MotionEvent event) { 
      String text = "Click X:"+ String.valueOf(event.getX())+ " Y:" + String.valueOf(event.getY()); 


      //Dokunulan yere bir işaret oluştur. 
      Bitmap mark = Bitmap.createBitmap(600, 400,Bitmap.Config.ARGB_8888); 
      Canvas ca = new Canvas(mark); 
      Paint pa = new Paint(); 
      pa.setStyle(Paint.Style.STROKE); 
      pa.setAntiAlias(true); 
      //pa.setStrokeCap(Paint.Cap.ROUND); 
      pa.setStrokeWidth((float)3); 
      pa.setARGB(251, 20, 20, 20); 
      float cx = event.getX() + 10 + (8*event.getX()/100); 
      float cy = event.getY() + 10 + (6*event.getY()/100); 

      ca.drawCircle(cx, cy, 13, pa); 
      BitmapDrawable bmp = new BitmapDrawable(getResources(), mark); 
      layers[1] = (Drawable)bmp; 
      LayerDrawable ldr = new LayerDrawable(layers); 
      ptable.setImageDrawable(ldr); 



      return true; 
     } 

    }); 

此代碼的工作，但僅與某個屏幕尺寸和像素密度的工作是正確的。 我要改善這一點。