android gridview row dividers / separators
Is there a way to show (horizontal) dividers between rows in a gridview?
I tried putting a small divider-image below every grid item, but this is not a solution, because it won't span the whole row when a row is not completely filled with items.
Is there a way to just add an image between every row? I can only find methods for changing the space between rows.
If you are using custom layout for grid items. Below code will work.
Step 1: Give background color to GridView
This is going to serve as a divider.
Give horizontalSpacing
and verticalSpacing
as 1dp
backgroundColor will be your divider color.
<GridView
android:id="@+id/gridView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e5e5e5"
android:horizontalSpacing="1dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="1dp" >
Step 2: Give background color to Custom Grid Item Layout
This is going to serve as a foreground color for GridItems.
In my case I kept it white (#fff)
<?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"
android:gravity="center"
android:background="#fff"
android:padding="15dp"
>
<ImageView
android:id="@+id/icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/ic_launcher_transparent" />
<TextView
android:id="@+id/lable"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Medium Text"
android:textStyle="bold"
android:textColor="#D0583B"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
Result
Note:
If you do not want vertical separator, keep horizontalSpacing = 0dp
If you do not want horizontal separator, keep verticalSpacing = 0dp
I ended up creating a custom gridview, something like this:
https://stackoverflow.com/a/9757501/1310343
using a background image that is exactly as high as one item in my gridview, and has a devider at the bottom.
Works like a charm!
Just wanted to share how I implemented this using the link accepted by OP.
For my case I also needed to control the length of the separators, so I couldn't get around subclassing GridView
.
public class HorizontalSeparatorGridView extends GridView {
// Additional methods
@Override
protected void dispatchDraw(Canvas canvas) {
final int count = getChildCount();
for(int i = 0; i < count; i++) {
View child = getChildAt(i);
int bottom = child.getBottom();
int left = child.getLeft();
int right = child.getRight();
Paint paint = new Paint();
paint.setColor(0xffececec);
paint.setStrokeWidth(Math.round(0.5 * density));
int offset = // Some offset
canvas.drawLine(left + offset, bottom, right - offset, bottom, paint);
}
super.dispatchDraw(canvas);
}
I subclassed dispatchDraw
as opposed to onDraw
just to be safe but I don't think it would matter in this case.