Creating grid view with clickable images in Android

Creating grid view with clickable images in Android - android

I want to create a grid view with clickable images.
Whenever an image is clicked, a corresponding value will be shown below that grid view.
The problem I am facing is in the design part, I don't know how to design a grid view like this. Every time I try to do that I get some bad results. I have no android UI design experience as of now.
How can I accomplish this?

Try this
Main activity
public class MainActivity extends AppCompatActivity {
List<String> list;
int[] imageId = {
R.drawable.a,
R.drawable.b,
R.drawable.c,
R.drawable.d,
R.drawable.e,
R.drawable.f,
};
String[] web = {
"Google",
"Github",
"Instagram",
"Facebook",
"Flickr",
"Pinterest",
"Quora",
"Twitter",
"Vimeo",
"WordPress",
"Youtube",
"Stumbleupon",
"SoundCloud",
"Reddit",
"Blogger"
} ;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageAdapter adapter = new ImageAdapter(MainActivity.this,web,
imageId);
GridView grid=(GridView)findViewById(R.id.grid_view);
grid.setAdapter(adapter);
grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
}
});
}
}
activity_main
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.mypc.grid.MainActivity">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/grid_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:columnWidth="90dp"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:gravity="center"
android:stretchMode="columnWidth" >
</GridView>
</LinearLayout>
ImageAdapter class
public class ImageAdapter extends BaseAdapter
{
private Context mContext;
private final int[] Imageid;
private final String[] web;
public ImageAdapter(Context c,String[] web,int[] Imageid )
{
mContext = c;
this.Imageid = Imageid;
this.web=web;
}
#Override
public int getCount()
{
return Imageid.length;
}
#Override
public Object getItem(int position)
{
return position;
}
#Override
public long getItemId(int position)
{
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup
parent)
{
LayoutInflater inflater = (LayoutInflater)
mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View gridView;
if (convertView == null)
{
gridView = new View(mContext);
// get layout from mobile.xml
gridView = inflater.inflate(R.layout.grid_layout, null);
// set value into textview
TextView textView = (TextView)
gridView.findViewById(R.id.grid_item_label);
textView.setText(web[position]);
// set image based on selected text
ImageView imageView = (ImageView)
gridView.findViewById(R.id.grid_item_image);
imageView.setImageResource(Imageid[position]);
}
else
{
gridView = (View) convertView;
}
return gridView;
}
}
grid_layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp" >
<ImageView
android:id="#+id/grid_item_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginRight="10dp"
>
</ImageView>
<TextView
android:id="#+id/grid_item_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#+id/label"
android:layout_marginTop="5px"
android:textSize="15px" >
</TextView>
</LinearLayout>

Related

How to hold the selected image in GridView and pass to next activity after I click Button

In my Activity I have an EditText, a Button and a GridView. The user selects the image from the GridView and enters the name in the EditText, and then clicks the done button.
activity.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/l1"
>
<View
android:layout_width="#dimen/btm_sht_line"
android:layout_height="#dimen/btm_sht_height"
android:layout_marginTop="#dimen/btm_top"
android:layout_gravity="center_horizontal"
android:background="#color/colorPrimaryDark"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/header_create_a_new_list"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:textStyle="bold"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/l2"
android:layout_gravity="center_horizontal"
android:layout_marginTop="#dimen/marin_top"
>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listname"
android:hint="#string/list_title_name"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="#dimen/marin_top"
android:layout_marginStart="#dimen/marin_top"
android:inputType="text"
android:autofillHints="#string/list_title_name" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/done"
android:src="#drawable/ic_check_circle"
android:layout_marginRight="15dp"
android:layout_marginEnd="#dimen/marin_top"
android:layout_marginLeft="#dimen/margin_left"
android:layout_marginStart="#dimen/margin_left"
tools:ignore="ContentDescription"
/> </LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/l3"
android:orientation="vertical"
>
<View style="#style/Divider"
android:layout_marginTop="#dimen/marin_top"
/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/r1"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/scroll"
><GridView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/gridview"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
</ScrollView>
</RelativeLayout>
</LinearLayout>
I want to move the selected image and the entered text to another Activity
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".CheckslateHome">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:id="#+id/ima"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/getlistname"
android:text="hi welcome"
android:layout_below="#+id/ima"
/>
</RelativeLayout>
In my code when the user selects the image, before entering the name, it loads to a new empty window. Also I have 6 images in my drawable Folder and only 3 images are being displayed in the GridView.
Java class
public class NewListCreate extends BottomSheetDialogFragment {
Integer[] images={R.drawable.menu,R.drawable.musicbox,R.drawable.shoppingbag,R.drawable.shoppingcart,R.drawable.wallet,R.drawable.weddingdress};
GridView gridView;
ArrayList<imageModel> arrayList;
public NewListCreate() {}
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
final View view = inflater.inflate(R.layout.new_list_create, container, false);
ImageButton done = view.findViewById(R.id.done);
final EditText listname = (EditText) view.findViewById(R.id.listname);
final GridView gridView = (GridView) view.findViewById(R.id.gridview);
arrayList = new ArrayList<imageModel>();
for (int i = 0; i < images.length; i++) {
imageModel imagemodel = new imageModel();
imagemodel.setmThumbIds(images[i]);
//add in array list
arrayList.add(imagemodel);
}
final ImageAdapterGridView adapterGridView = new ImageAdapterGridView(getContext(), arrayList);
gridView.setAdapter(adapterGridView);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
adapterGridView.setSelectedPosition(i);
adapterGridView.notifyDataSetChanged();
int imageRes = images[i];
Intent intent = new Intent(getContext(),CheckslateHome.class);
intent.putExtra("IMAGE_RES", imageRes);
startActivity(intent);
}
});
return view;
}
}
AdapterClass
public class ImageAdapterGridView extends BaseAdapter {
private int selectedPosition = -1;
Context context;
ArrayList<imageModel> arrayList;
public ImageAdapterGridView(Context context, ArrayList<imageModel> arrayList) {
this.context = context;
this.arrayList = arrayList;
}
#Override
public int getCount() {
return arrayList.size();
}
#Override
public Object getItem(int i) {
return arrayList.get(i);
}
#Override
public long getItemId(int i) {
return i;
}
#Override
public View getView(int i, View view, ViewGroup viewGroup) {
if (view==null)
{
view = LayoutInflater.from(context).inflate(R.layout.image_list, viewGroup, false);
}
ImageView imageView;
imageView = (ImageView) view.findViewById(R.id.image);
imageView.setImageResource(arrayList.get(i).getmThumbIds());
if (i == selectedPosition) {
view.setBackgroundColor(Color.WHITE);
} else {
view.setBackgroundColor(Color.TRANSPARENT);
}
return view;
}
public void setSelectedPosition(int position) {
selectedPosition = position;
}
}
what i was Looking was Something Like this
[![enter image description here][1]][1]

Copy and paste this hope it solve ur Problem
public class NewListCreate extends BottomSheetDialogFragment {
int[] images={R.drawable.menu,R.drawable.musicbox,R.drawable.shoppingbag,R.drawable.shoppingcart,R.drawable.wallet,R.drawable.weddingdress};
int imageRes = images[0];
public NewListCreate() {
}
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.new_list_create, container, false);
ImageButton done = view.findViewById(R.id.done);
final EditText listname = (EditText) view.findViewById(R.id.listname);
final GridView gridView = (GridView) view.findViewById(R.id.gridview);
final CustomAdpter customAdpter = new CustomAdpter(images,getContext());
gridView.setAdapter(customAdpter);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
customAdpter.selectedImage = i;
customAdpter.notifyDataSetChanged();
imageRes = images[i];
}
});
done.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
String itemname = listname.getText().toString();
if (!TextUtils.isEmpty(listname.getText().toString())) {
startActivity(new Intent(getContext(), CheckslateHome.class).putExtra("data", itemname).putExtra("image",imageRes));
dismiss();
} else {
Toast.makeText(getContext(), "List Name not Empty ", Toast.LENGTH_SHORT).show();
}
}
});
return view;
}
public class CustomAdpter extends BaseAdapter{
private int[] icons;
private Context context;
private LayoutInflater layoutInflater;
public int selectedImage = 0;
public CustomAdpter(int[] icons, Context context) {
this.icons = icons;
this.context = context;
this.layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
return icons.length;
}
#Override
public Object getItem(int i) {
return null;
}
#Override
public long getItemId(int i) {
return 0;
}
#Override
public View getView(int i, View view, ViewGroup viewGroup) {
if (view == null)
{
view = layoutInflater .inflate(R.layout.image_list,viewGroup,false);
}
ImageView imageicons = view.findViewById(R.id.image);
if (i < icons.length) {
imageicons.setImageResource(icons[i]);
if (i != selectedImage) {
imageicons.setImageAlpha(50);
}
imageicons.setScaleType(ImageView.ScaleType.CENTER_CROP);
// imageicons.setLayoutParams(new GridView.LayoutParams(150, 150));
if (i == selectedImage) {
view.setBackgroundColor(Color.WHITE);
} else {
view.setBackgroundColor(Color.TRANSPARENT);
}
};
return view;
}
}

I think what you're looking for is passing data through navigation.
It will allow you send your image and name data from one activity/fragment to the next one.
Check out data-binding as well, might be useful.

GridView onClickListener/onItemClickListener not working

I am trying to implement a Card view inside grid view. The grid view is showing perfectly; even when I touch on a grid view item it's showing nothing. But when I click on the text which is display below its work. I referred This but not working...
Thanks.
My code is as below,
// Contact_Backup.java
public class Contact_Backup extends AppCompatActivity {
#Bind(R.id.gridview)
GridView gridview;
String[] contact_screen_array;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.contact_backup);
ButterKnife.bind(this);
contact_screen_array = getResources().getStringArray(R.array.TextScreen);
String[] contact_icon_array = getResources().getStringArray(R.array.IconScreen);
String concat = "\nContacts";
gridview.setAdapter(new Custom_Adapter(getApplicationContext(),contact_icon_array,contact_screen_array,concat));
}
}
//Custom_Adapter
public class Custom_Adapter extends BaseAdapter {
Context contaxt;
String[] Array_text;
String[] Array_icon;
String concat;
LayoutInflater inflater;
public Custom_Adapter(Context context,String[] Array_icon, String[] Array_text, String concat)
{
this.contaxt = context;
this.Array_text = Array_text;
this.Array_icon = Array_icon;
this.concat=concat;
inflater = (LayoutInflater)context.
getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
return Array_text.length;
}
#Override
public Object getItem(int position) {
return position;
}
#Override
public long getItemId(int position) {
return position;
}
#Bind(R.id.Screen_icon)
Button Screen_icon;
#Bind(R.id.Screen_text)
TextView Screen_text;
#Override
public View getView(final int position, View convertView, ViewGroup parent) {
View grid;
LayoutInflater inflater = (LayoutInflater) contaxt
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
if (convertView == null) {
grid = new View(contaxt);
grid = inflater.inflate(R.layout.new_app_card_layout, null);
ButterKnife.bind(this, grid);
Screen_text.setText(Array_text[position]+concat);
Screen_icon.setText(Array_icon[position]);
Typeface font = Typeface.createFromAsset(contaxt.getAssets(), "fonts/fontawesome-webfont.ttf" );
Screen_icon.setTypeface(font);
} else {
grid = (View) convertView;
}
grid.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.d("TAG::",""+position);
}
});
return grid;
}
}
// contact_backup.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/main_backgorund"
>
<RelativeLayout
android:background="#color/transparent"
android:padding="5.0dip"
android:id="#+id/top_bar_screen"
android:layout_weight="0.2"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:textColor="#color/newclr"
android:id="#+id/tvContacts"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/contacts"
android:shadowColor="#000000"
android:shadowDx="1.0"
android:shadowDy="1.0"
android:shadowRadius="2.0"
android:layout_centerVertical="true" />
<TextView
android:textColor="#color/newclr"
android:id="#+id/tvLastBackup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/last_backup"
android:shadowColor="#000000"
android:shadowDx="1.0"
android:shadowDy="1.0"
android:shadowRadius="2.0"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" />
</RelativeLayout>
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:id="#+id/v1"
android:layout_below="#+id/top_bar_screen"
android:background="#color/newclr"/>
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/swipe"
android:layout_below="#+id/v1"
android:paddingTop="20sp"
android:paddingLeft="10sp"
android:paddingRight="10sp"
android:layout_weight="0.6"
>
<GridView
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:layout_height="wrap_content" />
</GridLayout>
<!-- com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_weight="0.2"
android:layout_centerHorizontal="true" /-->
</RelativeLayout>
// new_app_card_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/fssr_card"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
card_view:cardBackgroundColor="#color/transparent"
>
<LinearLayout
android:gravity="center"
android:orientation="vertical"
android:id="#+id/Contacts_Button_Layout"
android:background="#drawable/linearlayout_normal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="-1.0dip"
android:layout_weight="1.0"
>
<Button
android:textSize="35.0sp"
android:textColor="#color/newclr"
android:layout_gravity="center"
android:id="#+id/Screen_icon"
android:background="#null"
android:padding="20sp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/fa_icon_contact"
android:drawablePadding="5.0dip"
android:textAllCaps="false" />
<TextView
android:textSize="15.0sp"
android:textColor="#color/white"
android:layout_gravity="center"
android:textAlignment="center"
android:id="#+id/Screen_text"
android:background="#color/newclr"
android:padding="5sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/contactsbackup"
android:textAllCaps="false"/>
</LinearLayout>
</android.support.v7.widget.CardView>

use this method for clicking on a gridview item:
gridview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
// your action when gridView item is clicked
}
});

Set the listener on the actual gridview object.
gridView.setOnItemClickListener(new OnItemClickListener()...);

Try this,
public class Contact_Backup extends AppCompatActivity {
#Bind(R.id.gridview)
GridView gridview;
String[] contact_screen_array;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.contact_backup);
ButterKnife.bind(this);
contact_screen_array = getResources().getStringArray(R.array.TextScreen);
String[] contact_icon_array = getResources().getStringArray(R.array.IconScreen);
String concat = "\nContacts";
gridview.setAdapter(new Custom_Adapter(getApplicationContext(),contact_icon_array,contact_screen_array,concat));
gridview.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
for(int i=0;i<contact_screen_array.length;i++) {
Log.d("TAG::", "Position"+contact_screen_array[i]);
}
}
});
}
}

Finally, I succeed. here is the code.
Just use Textview instead of Button in // new_app_card_layout.xml.
Just Update it,
<TextView
android:textSize="35.0sp"
android:textColor="#color/newclr"
android:layout_gravity="center"
android:id="#+id/Screen_icon"
android:background="#null"
android:padding="20sp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/fa_icon_contact"
android:drawablePadding="5.0dip"
android:textAllCaps="false"
android:textAlignment="center" />
Thank You so much, All of you for help... :)

Try this i have updated your custom Adapter class.please check again with this updated code.
public class Custom_Adapter extends BaseAdapter {
Context contaxt;
String[] Array_text;
String[] Array_icon;
String concat;
LayoutInflater inflater;
public Custom_Adapter(Context context,String[] Array_icon, String[] Array_text, String concat)
{
this.contaxt = context;
this.Array_text = Array_text;
this.Array_icon = Array_icon;
this.concat=concat;
inflater = (LayoutInflater)context.
getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
return Array_text.length;
}
#Override
public Object getItem(int position) {
return position;
}
#Override
public long getItemId(int position) {
return position;
}
#Bind(R.id.Screen_icon)
Button Screen_icon;
#Bind(R.id.Screen_text)
TextView Screen_text;
#Override
public View getView(final int position, View convertView, ViewGroup parent) {
View grid;
LayoutInflater inflater = (LayoutInflater) contaxt
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
if (convertView == null) {
grid = new View(contaxt);
grid = inflater.inflate(R.layout.new_app_card_layout, null);
ButterKnife.bind(this, grid);
Screen_text.setText(Array_text[position]+concat);
Screen_icon.setText(Array_icon[position]);
Typeface font = Typeface.createFromAsset(contaxt.getAssets(), "fonts/fontawesome-webfont.ttf" );
Screen_icon.setTypeface(font);
grid.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.d("TAG::",""+position);
}
});
} else {
grid = (View) convertView;
grid.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.d("TAG::",""+position);
}
});
}
return grid;
}
}
Hope this helps you out !

Custom GridView adapter changing image visibility status

I have a custom gridView and inside it i am having two images in a relative layout . Now when i click on the gridView i want the visibility of my images to change.
MainActivity:
public class Main extends Fragment implements OnMapReadyCallback{
GridView gridview,video_gridview;
GridViewAdapter adapter;
View v;
public Main() {
// Required empty public constructor
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
v = inflater.inflate(R.layout.activity_main,
container, false);
gridview = (GridView)v.findViewById(R.id.sub_notify_gridView);
gridview.setNumColumns(3);
adapter = new GridViewAdapter(getActivity(),FilePathStrings,
FileNameStrings,Image_Status,time);
gridview.setAdapter(adapter);
gridview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, final int
position, long id) {
//here i need to know which image has been clicked
}
});
return v;
}
MainActivity Layout:
<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".35"
android:id="#+id/sub_notify_gridView">
<!--<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/gridViewImageid"/>-->
</GridView>
Cusotm GridView Adapter:
public class GridViewAdapter extends BaseAdapter {
// Declare variables
private Activity context;
private String[] filepath;
private String[] imageStatus;
private String Imgtime;
String[] separated;
private static LayoutInflater inflater = null;
public GridViewAdapter(FragmentActivity activity, String[] fpath, String[] fname, String[] image_status, String time) {
context = activity;
filepath = fpath;
imageStatus = image_status;
Imgtime = time;
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
public int getCount() {
return filepath.length;
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
View vi = convertView;
if (convertView == null)
vi = inflater.inflate(R.layout.gridview_item, null);
//TextView text = (TextView) vi.findViewById(R.id.text);
final ImageView image = (ImageView) vi.findViewById(R.id.image);
ImageView upload_image = (ImageView) vi.findViewById(R.id.upload_image);
TextView time = (TextView) vi.findViewById(R.id.textView);
time.setText(Imgtime);
image.setScaleType(ImageView.ScaleType.FIT_XY);
image.setPadding(5, 3, 5, 2); //itrb
//text.setText(filename[position]);
Bitmap ThumbImage =ThumbnailUtils.extractThumbnail
(BitmapFactory.decodeFile(filepath[position]),
128, 128);
if(imageStatus[position].equals("0")){
upload_image.setVisibility(View.VISIBLE);
}
if (filepath[position] == null){
image.setImageResource(R.drawable.imageicon);
}
else{
if (position > 4){
image.setImageBitmap(ThumbImage);
}
else{
image.setImageBitmap(ThumbImage);
}
}
return vi;
}
GridView_item Layout File:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:custom="http://schemas.android.com/tools"
android:padding="5dip">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:layout_alignBottom="#+id/image"
android:layout_alignRight="#+id/image"
android:layout_alignEnd="#+id/image"
android:paddingRight="5dp"
android:paddingBottom="1.5dp"
android:id="#+id/textView" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="5dp"
android:paddingBottom="1.5dp"
android:id="#+id/upload_image"
android:visibility="gone"
android:src="#drawable/accept_icon"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>

Gridview's order of child items changes while softkeypad pops up

My activity contains a textview and under that it has gridview elements. Stage 1: When the activity starts, it adjusts the elements in the order that I have set(like item1, item2,..) stage1 picture. Stage 2: But when I click on edittext, the gridview elements get adjusted to allocate space for the softkeypad stage2 picture. Stage 3: So when I press back button, the soft keypad disappears(as usual), but the order of gridview elements are getting changed stage3 picture. The order of child items of gridview changes. Can anyone please suggest me how to avoid this uncertainty in the order? Below is my entire code and xml file, though I think these are not that much necessary to solve this issue.
public class PresentActivity extends Activity {
GridView gridView;
static final String[] TEXT = new String[] {
"item1", "item2","item3", "item4", "item5","item6","item7","item8" };
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
setGridView();
}
public void setGridView()
{
gridView = (GridView)findViewById(R.id.gridView1);
gridView.setAdapter(new ImageAdapter(this, TEXT));
gridView.setNumColumns(3);
gridView.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v,
int position, long id) {
String currentText=(String) ((TextView)v.findViewById(R.id.grid_item_label)).getText();
Toast.makeText(getApplicationContext(), currentText, Toast.LENGTH_SHORT).show();
}
});
}
}
Here is my custom adapter class.
public class ImageAdapter extends BaseAdapter{
private Context context;
private final String[] textValues;
public ImageAdapter(Context context, String[] textValues) {
this.context = context;
this.textValues = textValues;
}
#Override
public int getCount() {
return textValues.length;
}
#Override
public Object getItem(int arg0) {
return null;
}
#Override
public long getItemId(int position) {
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View gridView;
if (convertView == null) {
gridView = new View(context);
// get layout from imagewithtext.xml
gridView = inflater.inflate(R.layout.imagewithtext, null);
// set value into textview
TextView textView = (TextView) gridView
.findViewById(R.id.grid_item_label);
textView.setText(textValues[position]);
// set image based on selected text
ImageView imageView = (ImageView) gridView
.findViewById(R.id.grid_item_image);
String extractedText = textValues[position];
System.out.println("the position value is>>>>>>"+position);
if (extractedText.equals("item1")) {
imageView.setImageResource(R.drawable.icon);
}
else if (extractedText.equals("item2")) {
imageView.setImageResource(R.drawable.icon);
} else if (extractedText.equals("item3")) {
imageView.setImageResource(R.drawable.icon);
}else if(extractedText.equals("item4")){
imageView.setImageResource(R.drawable.icon);
} else if (extractedText.equals("item5")) {
imageView.setImageResource(R.drawable.icon);
} else if (extractedText.equals("item6")) {
imageView.setImageResource(R.drawable.pic1);
}
else if(extractedText.equals("item7")){
imageView.setImageResource(R.drawable.pic1);
}
else{
imageView.setImageResource(R.drawable.pic1);
}
} else {
gridView = (View) convertView;
}
return gridView;
}
}
xml file which contains gridview:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="200px"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:text="#string/button"
android:onClick="button1"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:text="#string/present_location"
/>
</RelativeLayout>
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/editText1_hint"
/>
<GridView
android:id="#+id/gridView1"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:gravity="center"
android:columnWidth="100dp"
android:stretchMode="columnWidth"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</GridView>
</LinearLayout>

Let's assume your items contain just 1 ImageView and 1 TextView (for the sake of simplicity).
Your getView method in the Adapter should do this:
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder vh;
if (convertView == null) {
final LayoutInflater inflater = LayoutInflater.from(getContext());
convertView = inflater.inflate(R.layout.imagewithtext,null);
//Custom ViewHolder, you have to create it in the same class.
vh = new ViewHolder();
vh.imageView = convertView.findViewById(R.id.imageView1);
vh.textView = convertView.findViewById(R.id.textView1);
convertView.setTag(vh);
} else {
vh = (ViewHolder) convertView.getTag();
}
vh.imageView.setImageResource(R.drawable.whatever);
vh.textView.setText("Whatever text you want to set here");
return gridView;
}
And in your adapter, just add this:
private class ViewHolder{
public ViewHolder(){}
public ImageView imageView;
public TextView textView;
//Add any views you want to use in getView here
}

GridViewActivity:-(This is main Activity)
public class GridVieweActivity extends Activity {
GridView gridView;
static final String[] TEXT = new String[] { "item1", "item2", "item3",
"item4", "item5", "item6", "item7", "item8" };
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
setGridView();
}
public void setGridView() {
gridView = (GridView) findViewById(R.id.gridView1);
gridView.setAdapter(new ImageAdapter(this, TEXT));
gridView.setNumColumns(3);
gridView.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v,
int position, long id) {
String currentText = (String) ((TextView) v
.findViewById(R.id.textView1)).getText();
Toast.makeText(getApplicationContext(), currentText,
Toast.LENGTH_SHORT).show();
}
});
}
}
ImageAdapter:-
public class ImageAdapter extends BaseAdapter {
private Context context;
private final String[] textValues;
public ImageAdapter(Context context, String[] textValues) {
this.context = context;
this.textValues = textValues;
}
#Override
public int getCount() {
return textValues.length;
}
#Override
public Object getItem(int arg0) {
return null;
}
#Override
public long getItemId(int position) {
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View gridView;
if (convertView == null) {
gridView = new View(context);
// get layout from imagewithtext.xml
gridView = inflater.inflate(R.layout.imagewithtext, null);
// set value into textview
TextView textView = (TextView) gridView
.findViewById(R.id.textView1);
textView.setText(textValues[position]);
// set image based on selected text
ImageView imageView = (ImageView) gridView
.findViewById(R.id.imageView1);
String extractedText = textValues[position];
System.out.println("the position value is>>>>>>" + position);
if (extractedText.equals("item1")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item2")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item3")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item4")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item5")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item6")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else if (extractedText.equals("item7")) {
imageView.setImageResource(R.drawable.ic_launcher);
} else {
imageView.setImageResource(R.drawable.ic_launcher);
}
} else {
gridView = (View) convertView;
}
return gridView;
}
}
main.xml:-
<?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" >
<RelativeLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="200px"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:onClick="button1"
android:text="Button" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Present Location" />
</RelativeLayout>
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Hint" />
<GridView
android:id="#+id/gridView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="100dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp" >
</GridView>
</LinearLayout>
imagewithtext:-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="64dp"
android:layout_height="64dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" >
</ImageView>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_centerHorizontal="true"
android:layout_marginTop="2dp"
android:ellipsize="marquee"
android:text="TextView"
android:textSize="18sp" >
</TextView>
</RelativeLayout>
The above code is working fine.

How to bind ArrayList Objects to android GridView?

I've a collection of array list objects like:
ArrayList<Person> persons=new ArrayList<Person>();
so how can i bind this list of objects persons to android gridview?

GridView settingGrid;
ArrayList<Person> persons;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.setting);
persons =new ArrayList<Person>();
settingGrid = (GridView)findViewById(R.id.settinggridview);
settingGrid.setAdapter(new SettingImageAdapter(this));
settingGrid.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView parent, View v, int position,long id) {
});
public class SettingImageAdapter extends BaseAdapter{
Context MyContext;
public SettingImageAdapter(Context _MyContext){
MyContext = _MyContext;
}
public int getCount() {
return persons.size();
}
public View getView(int position, View convertView, ViewGroup parent) {
View v;
if(convertView==null){
LayoutInflater li = getLayoutInflater();
v = li.inflate(R.layout.setting_gried_item, null);
TextView tv = (TextView)v.findViewById(R.id.grid_item_text);
tv.setText("Profile "+position);
tv.setText(persons.get(position));
}
else
{
v = convertView;
}
return v;
}
public Object getItem(int arg0) {
return null;
}
public long getItemId(int arg0) {
return 0;
}
// references to our images
private Integer[] mThumbIds = {
R.drawable.one, R.drawable.two,
R.drawable.five, R.drawable.four,
R.drawable.eight,R.drawable.seven,
R.drawable.seven
};
private String[] names = {
"Wallpaper Setting","Font Setting",
"Sysnchronization Download","Sysnchronization Upload",
"Change Password","Camera",
"Gallery"
};
}
And your XML like be :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/GridItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_x="201px"
android:layout_y="165px" >
<TextView android:id="#+id/grid_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:gravity="center_horizontal"
android:textColor="#000000">
</TextView>
</LinearLayout>
This is setting.xml
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#drawable/wallpaper"
android:id="#+id/settinggridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="auto_fit"
android:textFilterEnabled="true"
android:stretchMode="columnWidth"
android:gravity="center"
android:horizontalSpacing="15px"
android:verticalSpacing="25px"
>
try like this

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Creating grid view with clickable images in Android - android

Related

How to hold the selected image in GridView and pass to next activity after I click Button

GridView onClickListener/onItemClickListener not working

Custom GridView adapter changing image visibility status

Gridview's order of child items changes while softkeypad pops up

How to bind ArrayList Objects to android GridView?

Categories

Resources