Android Grid View With Image And Text

I need to show text below every image in grid view. I have been able to put the images in grid view but how to put text below it? Below I'm posting the code snippets. fragment_faci

Solution 1:

I would rather suggest that instead of creating ImageView dynamically at run time and return that from your getView() method, you should create an xml for your each of the list items. Below is the sample xml with ImageView and TextView

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><ImageViewandroid:id="@+id/image"android:layout_width="wrap_content"android:layout_height="wrap_content"android:scaleType="centerCrop"/><TextViewandroid:id="@+id/text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="5dp"android:gravity="center"/></LinearLayout>

Also you should follow ViewHolder Patternto make your GridView memory efficient. Your getView() method will look alike this

@Overridepublic View getView(int arg0, View convertView, ViewGroup arg2) {
        ViewHolder holder;
        if (convertView == null) {
            holder = newViewHolder();
            convertView = layoutInflater.inflate(R.layout.yourxml,
                    null);
            holder.textview= (TextView) convertView.findViewById(R.id.text);
            holder.imageview= (ImageView) convertView.findViewById(R.id.image);
            holder.imageView.getLayoutParams().width = yourImageWidth;
            holder.imageView.getLayoutParams().height = yourImageHeight;
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        holder.imageView.setImageResource(mThumbIds[position]);
        holder.textview.setText(mThumbNames[position]);
        return convertView;
    }

    staticclassViewHolder {
        ImageView imageView;
        TextView textView;
    }

Solution 2:

Try to extend this:

SimpleAdapter

or use it by default like:

private Context mContext;
// Keep all Images in arraypublicInteger[] mThumbIds = {
     R.drawable.bank, R.drawable.bus,
     R.drawable.girlshostel , R.drawable.guesthouse,
     R.drawable.gym , R.drawable.library,R.drawable.sports
};
publicString[] mThumbNames = {"Bank", "Bus Service","Guest House", "GYM","Fac1","Fac2"};
Simple adapter= new SimpleAdapter(mContext, List<?> your_list, R.layout.your_layout_file, from, to);

You also have to make a layout file and define how the image and text you would like to look for each gridview item like this:

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/rootLayout"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><ImageViewandroid:id="@+id/this_image_id_have_to_be_used_in_your_to_array"android:layout_width="wrap_content"android:layout_height="wrap_content"android:scaleType="centerCrop"/><TextViewandroid:id="@+id/this_text_id_have_to_be_used_in_your_to_array"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="5dp"android:gravity="center"/></LinearLayout>

Hope it helps!!!