Android Gridview Keep Item Selected

Android gridview keep item selected

The concept that you want to achieve is possible, but not like the way you are working now.

The best and easiest solution would be to keep track of the states of the clicked items and give them the correct layout inside the adapter. I have set up a little example:

Activity

public class StackOverFlowActivity extends Activity {
    GridView gridView;
    MyCustomAdapter myAdapter;
    ArrayList<GridObject> myObjects;

    static final String[] numbers = new String[] { "A", "B", "C", "D", "E",
            "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R",
            "S", "T", "U", "V", "W", "X", "Y", "Z" };

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

        myObjects = new ArrayList<GridObject>();
        for (String s : numbers) {
            myObjects.add(new GridObject(s, 0));
        }

        gridView = (GridView) findViewById(R.id.gridView1);

        myAdapter = new MyCustomAdapter(this);

        gridView.setAdapter(myAdapter);
        gridView.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> arg0, View v, int position, long arg3) {
                myObjects.get(position).setState(1);
                myAdapter.notifyDataSetChanged();
            }
        });
    }

    static class ViewHolder {
        TextView text;
    }

    private class MyCustomAdapter extends BaseAdapter  {

        private LayoutInflater mInflater;

        public MyCustomAdapter(Context context) {
            mInflater = LayoutInflater.from(context);
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            GridObject object = myObjects.get(position);
            ViewHolder holder;

            if (convertView == null) {
                convertView = mInflater.inflate(R.layout.list_item_icon_text, null);
                holder = new ViewHolder();
                holder.text = (TextView) convertView.findViewById(R.id.text);
                convertView.setTag(holder);
            } else {
                holder = (ViewHolder) convertView.getTag();
            }

            holder.text.setText(object.getName());

            if (object.getState() == 1) {
                holder.text.setBackgroundColor(Color.GREEN);
            } else {
                holder.text.setBackgroundColor(Color.BLUE);
            }
            return convertView;
        }

        @Override
        public int getCount() {
            return myObjects.size();
        }

        @Override
        public Object getItem(int position) {
            return position;
        }

        @Override
        public long getItemId(int position) {
            return position;
        }
    }
}

GridObject

public class GridObject {

    private String name;
    private int state;

    public GridObject(String name, int state) {
        super();
        this.name = name;
        this.state = state;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getState() {
        return state;
    }

    public void setState(int state) {
        this.state = state;
    }   
}

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:columnWidth="50dp"
        android:gravity="center"
        android:numColumns="auto_fit"
        android:stretchMode="columnWidth" >
    </GridView>

</LinearLayout>

list_item_icon_text

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/text"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

</LinearLayout>

How do I retain selected item highlighting on gridview when numColumns changes?

I had a similar scenario and ended up solving the issue be creating a custom grid item with a boolean field to keep track of whether the item is selected or not and then highlighting the item appropriately through the custom adapter. Below is a rough outline of what I did:

(1) I created a custom grid item with a boolean field, which we will call selectedStatus for simplicity's sake. I also added the corresponding methods to my grid item class to get the selected status:

public boolean getSelectedStatus ()
{
    return selectedStatus;
}

public void setSelectedStatus (boolean paramSelectedStatus)
{
    this.selectedStatus = paramSelectedStatus;
}

(2) I then created a custom Adapter that extends BaseAdapter to handle the custom grid object I created. In this Adapter I check the if the selected status of the grid object is true or false and highlight the item accordingly, shown below:

@Override
public View getView (final int position, View convertView, ViewGroup parent)
{

    // rest of getView() code...

    if (!yourGridObject.getSelectedStatus())
    {
        convertView.setBackgroundColor(Color.TRANSPARENT);
    }
    else
    {
        convertView.setBackgroundColor(Color.LTGRAY);
    }

    // rest of getView() code...

    return convertView;
}

(3) Lastly, you add the onItemClickListener to set the selected status and the background color of the grid items when they are selected (clicked):

yourGridView.setOnItemClickListener(new OnItemClickListener()
{
    @Override
    public void onItemClick(AdapterView<?> parent, View view, 
            int position, long id)
    {
        YourGridObject yourGridObject = (YourGridObject) parent.getItemAtPosition(position);
        if (!yourGridObject.getSelected())
        {
            view.setBackgroundColor(Color.LTGRAY);
            yourGridObject.setSelected(true);
        }
        else
        {
            view.setBackgroundColor(Color.TRANSPARENT);
            yourGridObject.setSelected(false);
        }
    }
});

Implementing selection this way ensures that the highlighting (selection) of the grid items will not change when the number of columns and rows swap since the selection status is contained within the grid objects themselves.

ANDROID- how to save selected item from gridView in a string?

The main problem here is: the string's values which are not getting the image path.

According to this line:

image1 = String.valueOf(view.findViewById(R.id.cloth_image_grid).getContext().toString());

It'll never return the image's path... Did you try to display this value in Logcat? It should display the memory's address of the widget's ImageView, and not the image's path.

---

You should override Object getItem(int position) in GridView's adapter, get the item's model (known as Clothes) and retrieve its image's path. Thus, the adapter should has this:

public Object getItem(int position) {
    return clothes.get(position); // return the item by its position
}

Then, in the class, when you set the listener, it should be as this:

grid1.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        // retrieve the model's item
        Clothes selectedItem = (Clothes) tShirtGridAdapter.getitem(position);
        // then, get the image's path and save it
        image1 = selectedItem.image_url; // "image_url" is the String path's value in model
    }
});

---

Beside, you saw adapterTShirt in the above code, because you used the same variable of the adapter GridAdapter and you set a new instance of the adapter on this line for both GridViews:

GridAdapter = new GridviewAdapter(this, R.layout.grid_row, clothes);

This might be better to not re-initialize the adapter and display the same for two gridviews. You'd have two variables (two instances) of the adapter as:

GridviewAdapter tShirtsGridAdapter, troussersGridAdapter;

// then
tShirtsGridAdapter = new GridviewAdapter(this, R.layout.grid_row, clothes);
// and 
troussersGridAdapter = new GridviewAdapter(this, R.layout.grid_row, clothes);

With this, you will have two separate instances and you can't retrieve the image 's path in click listener from the right clicked item like my snippnet code above.

how to set grid view item as selected

In getView() method of adapter do the following

if(row != null) {
    if(position == selectedPosition){
        set required background color
    } else {
        set background color to Color.TRANSPARENT
    }
}

---

In onItemClick method set Adapter.selectedPosition value and call notifydatasetchanged() and then proceed with your required logic.

in <GridView> item of xml set listSelector to android:color/transparent

How to highlight the grid view item on select?

you can use selector to highlight item

In drawable folder create a xml file

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@color/blue" android:state_selected="true"/>
    <item android:drawable="@color/transparent"/>

</selector>

and set listSelector of your gridview like

android:listSelector="@drawable/list_selector"

How to keep gridview (or ListView) item selected and not lose the selection because of recycling

The trick is to not worry about saving the view's state. Instead, save/change the state of underlying data. So if a position is selected, place the position in a data structure (usually a SparseBooleanArray). When this position comes back into view, i.e. getView() is called for this position, update the view properties accordingly.

Highlight selected item on a gridview

Create file selector.xml as:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@color/green_main_color" android:state_pressed="true"/>
    <item android:drawable="@color/green_main_color" android:state_selected="true"/>
    <item android:drawable="@color/white"/>

</selector>

Put your selector file in drawable folder as drawable/selector.xml and then in your gridView:

 <GridView 
    android:id="@+id/gridview" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:numColumns="auto_fit" 
    android:verticalSpacing="10dp" 
    android:horizontalSpacing="10dp" 
    android:stretchMode="columnWidth" 
    android:gravity="center"
    android:listSelector="@drawable/list_selector"
    android:scrollbars="none" />

---

Related Topics