Monday, April 30, 2012

Get color on a specified location from ImageView's background bitmap


Modify from the last exercise "Detect touched position on a ImageView"; get color from the background bitmap on the touched location. The TextView's text color will be changed according to the background color on the touched position.



Modify the custom ImageView, TouchView.java, to add the method getColor() to get color on a specified location and pass to the updateMsg() method of main activity. Notice that we have to convert the x,y from position on View to x, y on bitmap before getPixel() call.
package com.exercise.AndroidDetechTouch;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ImageView;

public class TouchView extends ImageView {
 
 Bitmap bitmap;
 double bmWidth, bmHeight; 

 public TouchView(Context context) {
  super(context);
  // TODO Auto-generated constructor stub
  init();
 }

 public TouchView(Context context, AttributeSet attrs) {
  super(context, attrs);
  // TODO Auto-generated constructor stub
  init();
 }

 public TouchView(Context context, AttributeSet attrs, int defStyle) {
  super(context, attrs, defStyle);
  // TODO Auto-generated constructor stub
  init();
 }
 
 private void init(){
  
  bitmap = ((BitmapDrawable)getBackground()).getBitmap();
  bmWidth = (double)bitmap.getWidth();
  bmHeight = (double)bitmap.getHeight();
 }

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  // TODO Auto-generated method stub
  setMeasuredDimension(MeasureSpec.getSize(widthMeasureSpec),
       MeasureSpec.getSize(heightMeasureSpec));
 }

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  // TODO Auto-generated method stub

  
  switch(event.getAction()){
  case MotionEvent.ACTION_DOWN:
  case MotionEvent.ACTION_MOVE:
   float x = event.getX();
   float y = event.getY();

   int color = getColor(x, y);
      ((AndroidDetechTouchActivity)getContext()).updateMsg("Touched@" + x + " : " + y, color);
      
   break;
  case MotionEvent.ACTION_UP:
   ((AndroidDetechTouchActivity)getContext()).updateMsg("", 0);
   break;
  }
  
  return true;
 }
 
 private int getColor(float x, float y){

  if ( x < 0 || y < 0 || x > (float)getWidth() || y > (float)getHeight()){
   return 0; //Invalid, return 0
  }else{
   //Convert touched x, y on View to on Bitmap
   int xBm = (int)(x * (bmWidth / (double)getWidth()));
      int yBm = (int)(y * (bmHeight / (double)getHeight()));

   return bitmap.getPixel(xBm, yBm);
  }

 }

}


Modify updateMsg() method of main activity, AndroidDetechTouchActivity.java, to include color and update TextView's TextColor.
package com.exercise.AndroidDetechTouch;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;

public class AndroidDetechTouchActivity extends Activity {
 
 TextView msg;
 TouchView touchView;
 
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        msg = (TextView)findViewById(R.id.msg);
        touchView = (TouchView)findViewById(R.id.touchview);

    }

    public void updateMsg(String tMsg, int color){
     msg.setTextColor(color);
     msg.setText(tMsg);
    }
   
}


Keep using main.xml from the last exercise.

Download the files.

Next: - Display text on a specified location in a custom View

No comments: