Android: замена изображений в массиве GridView после OnItemClick

Question

У меня есть вид сетки, который выглядит примерно так (каждое изображение будет другим в конце):

Когда пользователь щелкает любое изображение в массиве, я хочу, чтобы это изображение изменилось на:

Если они нажмут снова, это изменится на:

И затем повторное нажатие возвращает к:

Вот мой код, пока просто создаю GridView с помощью Imageadapter:

public class GridScroll extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    GridView gridview = (GridView) findViewById(R.id.gridview);
    gridview.setAdapter(new ImageAdapter(this));
    gridview.setOnItemClickListener(new OnItemClickListener() {
        public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
            // CHANGE IMAGE HERE
            Toast.makeText(GridScroll.this, "" + position, Toast.LENGTH_SHORT).show();


        }
    });
}

}

И

    public View getView(int position, View convertView, ViewGroup parent) {
    ImageView imageView;
    if (convertView == null) {  // if it's not recycled, initialize some attributes
        imageView = new ImageView(mContext);
        imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        imageView.setPadding(8, 8, 8, 8);
    } else {
        imageView = (ImageView) convertView;
    }

    imageView.setImageResource(mThumbIds[position]);
    return imageView;
}

// references to our images
private Integer[] mThumbIds = {
        R.drawable.lifestyle_5,R.drawable.lifestyle_6,
        R.drawable.lifestyle_7,R.drawable.lifestyle_8,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.lifestyle_1,R.drawable.lifestyle_2,
        R.drawable.lifestyle_3,R.drawable.lifestyle_4,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.lifestyle_1,R.drawable.lifestyle_2,
        R.drawable.lifestyle_3,R.drawable.lifestyle_4,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.lifestyle_1,R.drawable.lifestyle_2,
        R.drawable.lifestyle_3,R.drawable.lifestyle_4,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4,
        R.drawable.icon_4, R.drawable.icon_4, 
        R.drawable.icon_4, R.drawable.icon_4, 

};

Answer 1

Для этого нам нужно сделать две вещи:

1. Измените нарисованный элемент при щелчке. В onItemClick(...) измените чертеж для представления, которое вам передается. Это представление будет тем же, что вы создали в getView(...) вашего адаптера.

2. Убедитесь, что элемент отображается с правильным рисунком в следующий раз, когда он появляется на экране. Для этого следите за состоянием каждого элемента. Каждый раз, когда вы создаете представление для элемента в getView(...), присваивайте ему правильный чертеж для его состояния.

---

Вот пример. Я предполагаю, что ImageAdapter является подклассом ArrayAdapter. Если нет, то вам нужно будет изменить этот код для работы с тем, что вы делаете.

Положите их куда-нибудь:

private static final int WHITE = 0;
private static final int TEAL = 1;
private static final int MAROON = 2;
private List<Integer> mStates = new ArrayList<Integer>();

Это идет в вашем ImageAdapter:

// Map each state to its graphics.
private Map<Integer, Integer> mStateResources = new HashMap<Integer, Integer>();
mStateResources.put(WHITE, R.drawable.white);

public void add(...) {
    super.add(...);

    // The new item will start as white.
    mStates.add(WHITE);
}

public View getView(int position, View convertView, ViewGroup parent) {
    //ImageView image = ...

    // Set the correct image for the state of this item.
    int state = mStates.get(position);
    int resId = mStateResources.get(state);
    image.setImageResource(resId);
}

В вашем OnItemClickListener:

public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
    // Change the image and state for this item.
    int nextState;
    switch(mStates.get(position)) {
    case WHITE:
        nextState = TEAL;
        break;
    case TEAL:
        nextState = MAROON;
        break;
    case MAROON:
        nextState = WHITE;
        break;
    }

    // Set the new state and image for this item.
    mStates.put(position, nextState);
    int resId = mStateResources.get(nextState);
    image.setImageResource(resId);
}