Grid View Demo With Images

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

bismillaahirrahmaanirrahiim

السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

Assalamu'alaikum warahmatullahi wabarakatuh

GridView is a ViewGroup that displays items in a two-dimensional, scrollable grid.

We are going to create a Grid View to show Images, where we can select each item via click.

so lets create simple app with default activity "GridViewActivity" and put this code inside it.   

1. package com.sunil;
2. import android.app.Activity;  
3. import android.os.Bundle;  
4. import android.view.View;  
5. import android.widget.AdapterView;  
6. import android.widget.GridView;  
7. import android.widget.TextView;  
8. import android.widget.Toast;  
9. import android.widget.AdapterView.OnItemClickListener;  
10.   
11. public class GridViewActivity extends Activity {  
12.       
13.  GridView gridView;  
14.    
15.  static final String[] MOBILE_OS = new String[]{  
16.   "Android", "iOS", "Windows", "Balckberry",  
17.  };  
18.    
19.     @Override  
20.     public void onCreate(Bundle savedInstanceState) {  
21.         super.onCreate(savedInstanceState);  
22.         setContentView(R.layout.main);  
23.           
24.         gridView = (GridView) findViewById(R.id.gridView1);  
25.           
26.         gridView.setAdapter(new ImageAdapter(this, MOBILE_OS));  
27.           
28.         gridView.setOnItemClickListener(new OnItemClickListener(){  
29.          public void onItemClick(AdapterView parent, View v,   
30.            int position, long id){  
31.           Toast.makeText(getApplicationContext(),  
32.           ((TextView) v.findViewById(R.id.grid_item_label))  
33.           .getText(), Toast.LENGTH_SHORT).show();  
34.          }  
35.         });  
36.     }  
37. }  

ImageAdapter.java

   

1. package com.sunil;  
2. import android.content.Context;  
3. import android.view.LayoutInflater;  
4. import android.view.View;  
5. import android.view.ViewGroup;  
6. import android.widget.BaseAdapter;  
7. import android.widget.ImageView;  
8. import android.widget.TextView;  
9.   
10. public class ImageAdapter extends BaseAdapter{  
11.    
12.    
13.  private Context context;  
14.  private final String[] mobileValues;  
15.    
16.  public ImageAdapter(Context context, String[]   
17.    mobileValues){  
18.   this.context=context;  
19.   this.mobileValues=mobileValues;  
20.  }  
21.    
22.  public View getView(int position, View convertView,   
23.    ViewGroup parent){  
24.   LayoutInflater inflater = (LayoutInflater) context  
25.     .getSystemService(Context.  
26.       LAYOUT_INFLATER_SERVICE);  
27.     
28.   View gridView;  
29.   if(convertView == null){  
30.    gridView = new View(context);  
31.    gridView = inflater.inflate(  
32.      R.layout.mobile, null);  
33.      
34.    TextView textView = (TextView) gridView.  
35.      findViewById(R.id.grid_item_label);  
36.    textView.setText(mobileValues[position]);  
37.      
38.    ImageView imageView = (ImageView) gridView.  
39.      findViewById(  
40.        R.id.grid_item_image);  
41.    String mobile = mobileValues[position];  
42.     
43.    if(mobile.equals("Android")){  
44.     imageView.setImageResource(  
45.       R.drawable.android_logo);  
46.    }  
47.    else if(mobile.equals("iOS")){  
48.     imageView.setImageResource(  
49.       R.drawable.ios_logo);  
50.    }  
51.    else if(mobile.equals("Windows")){  
52.     imageView.setImageResource(  
53.       R.drawable.windows_logo);      
54.    }     
55.    else if(mobile.equals("BlackBerry")){  
56.     imageView.setImageResource(  
57.       R.drawable.ios_logo);  
58.    }     
59.   }  
60.   else{  
61.    gridView = (View) convertView;  
62.   }  
63.   return gridView;  
64.  }  
65.   
66.  @Override  
67.  public int getCount() {  
68.   // TODO Auto-generated method stub  
69.   return mobileValues.length;  
70.  }  
71.   
72.  @Override  
73.  public Object getItem(int position) {  
74.   // TODO Auto-generated method stub  
75.   return null;  
76.  }  
77.   
78.  @Override  
79.  public long getItemId(int position) {  
80.   // TODO Auto-generated method stub  
81.   return 0;  
82.  }  
83. }  

main.xml

 

1. <gridview android:columnwidth="100dp" android:gravity="center" android:id="@+id/gridView1" android:layout_height="fill_parent" android:layout_width="fill_parent" android:numcolumns="1" android:stretchmode="columnWidth" xmlns:android="http://schemas.android.com/apk/res/android">  
2.  </gridview>  

mobile.xml

1.   
2. <linearlayout android:layout_height="wrap_content" android:layout_width="wrap_content" android:orientation="horizontal" android:padding="5dp" xmlns:android="http://schemas.android.com/apk/res/android">  
3.     
4.   <imageview android:id="@+id/grid_item_image" android:layout_height="50px" android:layout_marginright="10px" android:layout_width="50px" android:src="@drawable/blackberry_logo">  
5.   </imageview>  
6.     
7.   <textview android:id="@+id/grid_item_label" android:layout_height="wrap_content" android:layout_margintop="5px" android:layout_width="wrap_content" android:text="@+id/label" android:textsize="15px">  
8.   </textview>     
9.       
10. </linearlayout>  

you need to put these icons in res/drawable-mdpi folder or any:

Then our output is:

Update Contact :
No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email : Fajarudinsidik@gmail.com NB :: Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code, membeli hardware elektronika untuk kepentingan Perusahaan maupun Tugas Akhir (TA/SKRIPSI), Insyaallah Saya siap membantu, untuk Respon Cepat dapat menghubungi kami, melalui :

No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email: Fajarudinsidik@gmail.com

atau Kirimkan Private messanger melalui email dengan klik tombol order dibawah ini :

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Alhamdulilah hirobil alamin

وَ السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

wassalamualaikum warahmatullahi wabarakatuh

Artikel Grid View Demo With Images , Diterbitkan oleh scodeaplikasi pada Minggu, 23 Desember 2012. Semoga artikel ini dapat menambah wawasan Anda. Website ini dipost dari beberapa sumber, bisa cek disini sumber, Sobat diperbolehkan mengcopy paste / menyebar luaskan artikel ini, karena segala yang dipost di public adalah milik public. Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code ,Dengan Cara menghubungi saya Ke Email: Fajarudinsidik@gmail.com, atau No Hp/WA : (fajar) : 085369237896, (puat) : 085267792168.