클릭가능한 이미지뷰 부분적으로 겹칠 수 있을까요? (그림 첨부)

Question

안녕하세요.

정말 초보가 질문 하나 드릴게요.

(이해를 돕기 위해, 그림판에서 급조했습니다.)

위 그림처럼 이미지뷰를 배치하고, 각 이미지뷰를 클릭했을 때, 

클릭 이벤트가 발생하도록 하고 싶은데요.

각 이미지의 크기가 너무 커서, 다른 이미지뷰의 영역을 서로 침범하게 됩니다.

(디자인 때문에,) 이미지뷰의 크기를 줄이지 않고, 

저 상태 저대로 이미지뷰를 배치하고 싶은데, 방법이 있을까요?

 

그리고, 비율 유지해서 해상도 다른 화면에서도 보일 수 있을까요?

즉, 리니어 레이아웃의 weight 속성을 이용해서 다른 해상도에서도 비율을 유지할 수 있다고 하는데,

리니어 레이아웃을 써버리면, 이미지뷰를 겹칠 수가 없어서, 뷰가 굉장히 작아져 버리네요. ㅠㅠ

 

혹시 가능한지 여부랑, 가능하면 어떻게 해야하는지 방법 좀 알려주시면 감사하겠습니다.

 

Answer 1

기존의 OnClickListener으로는 불가능 합니다.

다음과 같이 CustomImageView를 사용하면 가능합니다.

제가 한번 만들어 봤습니다. 이미지의 투명한 부분은 click이 되지 않습니다.

?

<com.your.package.ObjectClickImageView     android:id="@+id/test_image"     android:layout_width="match_parent"     android:layout_height="wrap_content"     android:adjustViewBounds="true"     android:src="@drawable/test_image" />

 

?

ObjectClickImageView objectView = (ObjectClickImageView)findViewById(R.id.test_image); objectView.setOnObjectClickListener(new View.OnClickListener() {     @Override     public void onClick(View v) {         ...     } });

 

?

package com.your.package;   import android.content.Context; import android.graphics.Bitmap; import android.graphics.Color; import android.support.annotation.Nullable; import android.support.v7.widget.AppCompatImageView; import android.util.AttributeSet; import android.view.MotionEvent; import android.view.View;   /**  * Created by leetid@naver.com on 2018-04-09.  */   public class ObjectClickImageView extends AppCompatImageView { // or ImageView       private OnTouchListener mOnTouchListener;     private OnClickListener mOnObjectClickListener;       public ObjectClickImageView(Context context, @Nullable AttributeSet attrs) {         super(context, attrs);           super.setOnTouchListener(mOnObjectTouchListener);     }       @Override     public void setOnTouchListener(OnTouchListener l) {         mOnTouchListener = l;     }       public void setOnObjectClickListener(@Nullable OnClickListener l) {         mOnObjectClickListener = l;     }       private final OnTouchListener mOnObjectTouchListener = new OnTouchListener() {         @Override         public boolean onTouch(View v, MotionEvent event) {             boolean consumed = false;               if (mOnTouchListener != null)                 consumed = mOnTouchListener.onTouch(v, event);               if (consumed)                 return true;               if (mOnObjectClickListener != null) {                 int x = (int)event.getX();                 int y = (int)event.getY();                   switch(event.getAction()) {                     case MotionEvent.ACTION_UP:                         if (isOnObject(x, y))                             return true;                           break;                       case MotionEvent.ACTION_DOWN:                         if (isOnObject(x, y)) {                             mOnObjectClickListener.onClick(v);                             return true;                         }                           break;                 }             }               return false;         }     };       private boolean isOnObject(int x, int y) {         setDrawingCacheEnabled(true);         Bitmap bitmap = Bitmap.createBitmap(getDrawingCache());         setDrawingCacheEnabled(false);           if (bitmap == null)             return false;           if (Color.alpha(bitmap.getPixel(x, y)) > 0)             return true;           return false;     } }

 

Comments

답변 너무 감사합니다. 일단 정성에 감동먹어서, 채택눌렀습니다. 코드분석해서 적용해보도록 하겠습니다. 감사합니다

Answer 2

 각 이미지뷰를 클릭했을 때,  클릭 이벤트가 발생하도록 하고 싶은데요.

=>   public boolean onTouch(View v, MotionEvent event) 의 반환값을 false로 하면 뒤의 레이아웃으로 onTouch 이벤트가 들어가고, true로 하면, 뒤의 레이아웃으로 onTouch 이벤트가 안 들어가니. 이를 응용해 보세요.

 

비율 유지해서 해상도 다른 화면에서도 보일 수 있을까요?

=> ScalableLayout 를 이용해 보세요. 

 

 

Comments

답변 너무 감사합니다. 아직 초보라 모르는게 많은데, onTouch랑 ScalableLayout도 좀 더 공부해보겠습니다.