RecyclerView Margin

Question

i am developing application for home security. One of the feature, that must be implemented is the ability to see connected devices (for sending notifications, blocking access, etc). So far, i've been able to create RecyclerView list of the devices, everything is perfect (for me), except that cards in this list have no spacing between them.

---

Screenshot of how it looks now

---

device_data_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:cardview="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_margin="8dp">

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp">

<ImageView
    android:id="@+id/deviceIcon"
    android:layout_width="40dp"
    android:layout_height="40dp"
    android:layout_alignParentLeft="true"
    android:layout_centerVertical="true"
    android:scaleType="centerCrop"
    android:layout_marginLeft="8dp" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="80dp"
    android:layout_alignBottom="@+id/deviceIcon"
    android:layout_toEndOf="@+id/deviceIcon">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Username"
        android:id="@+id/deviceUsername"
        android:layout_gravity="center_vertical"
        android:textColor="#000000"
        android:layout_marginLeft="5dp" />

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_gravity="center_vertical"
        android:gravity="center_vertical|center_horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="Device Model"
            android:gravity="center_vertical|right"
            android:textColor="#000000"
            android:id="@+id/deviceModel"
            android:layout_marginLeft="5dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="25dp"
            android:textColor="#000000"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="Device Version"
            android:gravity="center_vertical|right"
            android:id="@+id/deviceVersion"
            android:layout_marginLeft="5dp" />
    </LinearLayout>
</LinearLayout>

---

devices_list.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/activity_vertical_margin">

    <view
        android:id="@+id/connectedDevicesList"
        class="android.support.v7.widget.RecyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true" />
</RelativeLayout>

---

View Holder Code

import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import com.exampleapp.R;

public class DeviceViewHolder extends RecyclerView.ViewHolder {

    protected ImageView     deviceIcon;
    protected TextView      deviceUsername;
    protected TextView      deviceModel;
    protected TextView      deviceVersion;

    public DeviceViewHolder(View view) {
        super(view);
        this.deviceIcon         =   (ImageView) view.findViewById(R.id.deviceIcon);
        this.deviceUsername     =   (TextView)  view.findViewById(R.id.deviceUsername);
        this.deviceModel        =   (TextView)  view.findViewById(R.id.deviceModel);
        this.deviceVersion      =   (TextView)  view.findViewById(R.id.deviceVersion);
    }
}

---

RecyclerView Adapter

import android.content.Context;
import android.support.v4.content.ContextCompat;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import java.util.List;

import com.exampleapp.API.AuthorizedDevice;
import com.exampleapp.R;

public class ConnectedDeviceAdapter extends RecyclerView.Adapter<DeviceViewHolder> {
    private List<AuthorizedDevice> devices;
    private Context mContext;

    public ConnectedDeviceAdapter(Context context, List<AuthorizedDevice> devices) {
        this.devices = devices;
        this.mContext = context;
    }

    @Override
    public DeviceViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.connected_devices_layout, null);

        DeviceViewHolder viewHolder = new DeviceViewHolder(view);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(DeviceViewHolder deviceViewHolder, int i) {
        AuthorizedDevice device = devices.get(i);

        if (device.getDeviceId().equals("0")) {
            deviceViewHolder.deviceIcon.setBackground(ContextCompat.getDrawable(mContext, R.drawable.android_icon));
        } else {
            deviceViewHolder.deviceIcon.setBackground(ContextCompat.getDrawable(mContext, R.drawable.apple_icon));
        }

        deviceViewHolder.deviceUsername.setText(device.getUsername());
        deviceViewHolder.deviceModel.setText(device.getDeviceName());
        deviceViewHolder.deviceVersion.setText(device.getDeviceVersion());
    }

    @Override
    public int getItemCount() {
        return (null != devices ? devices.size() : 0);
    }
}

Can anyone please help me solve this problem? Thank you very much in advance!

Answer 1

In your RecyclerView Adapter onCreateViewHolder:

replace:

View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.connected_devices_layout, null);

with:

View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.connected_devices_layout, viewGroup, false);

Or you can use RecyclerView.addItemDecoration(ItemDecoration decor).