Ivan Zhivolupov Ivan Zhivolupov - 4 months ago 20
Android Question

RecyclerView Margin

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

enter image description here




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

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).

Comments