I am displaying image at top and text at bottom as frame layout. Each frame layout is under grid cells. I am getting overlaping of text and image. I want image as top and text as bottom without any overlap. Any help?
I have attached my code as bellow.
item_grid.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/home_item"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingBottom="2dp"
android:paddingLeft="2dp"
android:paddingRight="0dp"
android:paddingTop="2dp" >
<ImageView
android:id="@+id/home_item_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="1dp"
android:layout_gravity="top|center"
android:adjustViewBounds="true"
android:clickable="true"
android:contentDescription="Image Description"
android:scaleType="centerInside" />
<TextView
android:id="@+id/home_item_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
style="@style/mainGridItemStyle"
android:gravity="center"
android:maxLines="1"
android:paddingLeft="2dip"
android:paddingRight="2dp" />
</FrameLayout>
main_grid.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/gridViewMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="90dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp" >
</GridView>
</LinearLayout>
Java Code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_grid);
setOptions("g-app", null);
gridView = (GridView) findViewById(R.id.gridViewMain);
gridView.setAdapter(new ImageAdapter(this));
}
public class ImageAdapter extends BaseAdapter {
private Context context;
public ImageAdapter(Context context) {
this.context = context;
}
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 mobile.xml
gridView = inflater.inflate(R.layout.item_grid, null);
// set value into textview
TextView textView = (TextView) gridView
.findViewById(R.id.home_item_label);
HashMap<String, String> item = data.get(position);
textView.setText(item.get("name"));
//textView.setBackgroundColor(Color.WHITE);
// set image based on selected text
ImageView imageView = (ImageView) gridView
.findViewById(R.id.home_item_image);
imageView.setImageResource(R.drawable.contacts1);
} else {
gridView = (View) convertView;
}
return gridView;
}
@Override
public int getCount() {
return data.size();
}
@Override
public String getItem(int position) {
return data.get(position).toString();
}
@Override
public long getItemId(int position) {
return position;
}
}
First of all, I think you use layout_gravity wrong. You both set bottom|center.
center overrides bottom. You should do like bottom|center_horizontal
If you want to display the text below the Image, you should try LinearLayout. With FrameLayout the text will be drawn over the image no matter what you do.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.