I am trying to achieve something similar to this :
When a user long press on a grid cell in a grid-view the menu should be drawn inside the grid cell area as shown above. Please help me if anyone has ever tried something similar to this or if there are any libraries available to do the same.
Here is a code snippet on how generally a context-menu is triggered on long-press.
My Activity class :
public class GridViewActivity extends Activity {
GridView gridView;
ImageAdapter mImageAdapter;
static final String[] MOBILE_OS = new String[] {
"Android", "iOS", "Windows", "Blackberry"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mImageAdapter = new ImageAdapter(this, MOBILE_OS);
gridView = (GridView)findViewById(R.id.gridView1);
registerForContextMenu(gridView);
gridView.setAdapter(mImageAdapter);
gridView.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
Toast.makeText(getApplicationContext(),
((TextView)v.findViewById(R.id.grid_item_label)).getText(),
Toast.LENGTH_SHORT).show();
}
});
}
@Override
public void onCreateContextMenu(ContextMenu iMenu, View iView, ContextMenuInfo iMenuInfo) {
super.onCreateContextMenu(iMenu, iView, iMenuInfo);
iMenu.setHeaderTitle("OPTIONS");
iMenu.clear();
iMenu.add(Menu.NONE, 0, Menu.NONE, "VIEW");
iMenu.add(Menu.NONE, 1, Menu.NONE, "EDIT");
iMenu.add(Menu.NONE, 2, Menu.NONE, "SHARE");
iMenu.add(Menu.NONE, 3, Menu.NONE, "DELETE");
}
ImageAdapter class :
public class ImageAdapter extends BaseAdapter {
private Context context;
private final String[] mobileValues;
public LayoutInflater inflater;
public LinearLayout linearLayout;
public ImageAdapter(Context context, String[] mobileValues) {
this.context = context;
this.mobileValues = mobileValues;
}
public View getView(int position, View convertView, ViewGroup parent) {
inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View gridView;
if (convertView == null) {
gridView = new View(context);
// get layout from mobile.xml
gridView = inflater.inflate(R.layout.mobile, null);
// set value into textview
linearLayout = (LinearLayout)gridView.findViewById(R.id.linear1);
TextView textView = (TextView) gridView
.findViewById(R.id.grid_item_label);
textView.setText(mobileValues[position]);
// set image based on selected text
ImageView imageView = (ImageView) gridView
.findViewById(R.id.grid_item_image);
String mobile = mobileValues[position];
if (mobile.equals("Windows")) {
imageView.setImageResource(R.drawable.windows_logo);
} else if (mobile.equals("iOS")) {
imageView.setImageResource(R.drawable.ios_logo);
} else if (mobile.equals("Blackberry")) {
imageView.setImageResource(R.drawable.blackberry_logo);
} else {
imageView.setImageResource(R.drawable.android_logo);
}
} else {
gridView = (View) convertView;
}
return gridView;
}
@Override
public int getCount() {
return mobileValues.length;
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
}
main.xml :
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridView1"
android:numColumns="auto_fit"
android:gravity="center"
android:columnWidth="100dp"
android:stretchMode="columnWidth"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</GridView>
mobile.xml :
<?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"
android:orientation="vertical" >
<ImageView
android:id="@+id/grid_item_image"
android:layout_width="50px"
android:layout_height="50px"
android:layout_marginRight="10px"
android:src="@drawable/android_logo" >
</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>
What am trying to achieve here is that on long-press on a grid cell it should replace this particular grid cell view with the above view and each of the boxes (i.e. view, edit, share and delete) shall respond to some event listener.
