Question

I’ve just asked a question about an hour ago, while waiting for replies, I’ve thought maybe I can achieve what I want differently. I was thinking of changing the image but it would be better if I could perhaps overlay something over the top of complete levels in the gridview i.e a small tick icon
At the moment, when a level has been completed I am storing that with sharedpreferences

So I have a gridView layout to display images that represent levels. Let’s just say for this example I have 20 levels. When one level is complete is it possible to overlay the tick icon or somehow highlight the level image. Maybe change the border of the image??

Here are the image arrays I use

int[] imageIDs = {
   R.drawable.one,
   R.drawable.two,
   R.drawable.three,
   R.drawable.four,
   R.drawable.five,
   R.drawable.six
   etc.......

and then I have my code to set the images in gridView. Obviously there is more code in between.

public View getView(int position, View convertView, ViewGroup parent) 
{
   ImageView imageView;
   if (convertView == null) {
       imageView = new ImageView(context);
       imageView.setLayoutParams(new GridView.LayoutParams(140, 140));
       imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
       imageView.setPadding(5, 5, 5, 5);
   } else {
       imageView = (ImageView) convertView;
   }
   imageView.setImageResource(imageIDs[position]);
   return imageView;

would it be possible to do any of the above, even the border method would be fine.
Thanks for any help

---

When the level is open, I am using a switch case to do other tasks as well as change the item string to the name of the image it represents.

    switch(question){
    case 0:
        iv.setImageResource(R.drawable.one);
        item = imageOne;
                    answer1 = "one"         

    break;
    case 1:
        iv.setImageResource(R.drawable.two);
        item = imageTwo;
                    answer1 = "two"
    break;
    default:
    break;
    }

I’m then calling that string to save a boolean with the name of image

final boolean answerStatusCase = preferences.getBoolean(item, false);
final SharedPreferences.Editor editor = preferences.edit();

Button checkAnswer = (Button) findViewById(R.id.bCheckAnswer);
    checkAnswer.setOnClickListener(new View.OnClickListener() {

        public void onClick(View v) {

            String yourAnswerCheck = yourAnswerReview.toString();

            if (yourAnswerCheck.equals(answer1)) {
                Toast.makeText(getBaseContext(), "That's correct", 2000).show();

                    editor.putBoolean(item, true);
                    editor.commit();    

            }else{
                Toast.makeText(getBaseContext(), "That's incorrect", 2000).show();
            }

        }

    });

Answer 1

Yeah, definitely possible. I’d say you could simply subclass ImageView and handle the drawing in the onDraw(Canvas) method. For example (and this is just a quickie, in practice I’d probably handle drawing it at different sizes and a fixed offset in dip for different canvas sizes):

public class MarkableImageView extends ImageView {
    private boolean checked = true;

    public MarkableImageView(Context context) {
        super(context);
    }

    public MarkableImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MarkableImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public void setChecked(boolean checked) {
        this.checked = checked;
        invalidate();
    }

    public boolean isChecked() {
        return checked;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if(checked) {
            Bitmap check = BitmapFactory.decodeResource(
                    getResources(), R.drawable.check);
            int width = check.getWidth();
            int height = check.getHeight();
            int margin = 15;
            int x = canvas.getWidth() - width - margin;
            int y = canvas.getHeight() - height - margin;
            canvas.drawBitmap(check, x, y, new Paint());
        }
    }
}

EDIT: Then your code would be something like:

public View getView(int position, View convertView, ViewGroup parent) 
{
   MarkableImageView imageView;
   if (convertView == null) {
       imageView = new MarkableImageView(context);
       imageView.setLayoutParams(new GridView.LayoutParams(140, 140));
       imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
       imageView.setPadding(5, 5, 5, 5);
   } else {
       imageView = (MarkableImageView) convertView;
   }
   imageView.setImageResource(imageIDs[position]);
   imageView.setChecked(shouldBeChecked);
   return imageView;