Home > front end >  Android Studio Recycler View Interval Error (when running emulator)
Android Studio Recycler View Interval Error (when running emulator)

Time:11-05

We implemented the Animal Hospitals list with Recycler View and executed it with an emulator. However, if you scroll as shown in the picture, the gap comes out farther. enter image description here

What kind of problem? Is it a layout problem? I'd appreciate it if you could tell me the answer.

Corresponding xml code:

hospital_design.xml (This is the Recycler View design screen.)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@ id/listEdit_tv"
        android:layout_width="134dp"
        android:layout_height="91dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_marginStart="2dp"
        android:layout_marginTop="17dp"
        android:layout_marginEnd="260dp"
        android:layout_marginBottom="726dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0"
        app:srcCompat="@drawable/nuribom" />

    <TextView
        android:id="@ id/title_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="135dp"
        android:layout_marginTop="23dp"
        android:text="누리봄 동물병원"
        android:textColor="@color/black"
        android:textSize="15dp" />

    <TextView
        android:id="@ id/addr_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@ id/title_tv"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="135dp"
        android:layout_marginTop="54dp"
        android:text="서울특별시 종로구 사직로12길 2" />

    <TextView
        android:id="@ id/phone_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@ id/addr_tv"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="136dp"
        android:layout_marginTop="86dp"
        android:text="02-735-7530" />

    <TextView
        android:id="@ id/guri_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@ id/addr_tv"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_marginTop="86dp"
        android:layout_marginEnd="64dp"
        android:text="491m" />

</RelativeLayout>

activity_hospital.xml (This is the animal hospital list screen where you can see the Recycler view.)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageButton
        android:id="@ id/hos_back"
        style="?android:borderlessButtonStyle"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/baseline_arrow_back_24" />

    <TextView
        android:id="@ id/textView16"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="67dp"
        android:layout_marginTop="13dp"
        android:text="주변 병원"
        android:textColor="@color/black"
        android:textSize="15dp"
        android:textStyle="bold" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@ id/hospital_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@ id/hos_back"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="0dp"
        android:layout_marginTop="61dp"
        android:layout_marginEnd="0dp"
        android:layout_marginBottom="4dp" />

</RelativeLayout>

All layouts used RelativeLayout. I'd appreciate it if you could tell me how.

CodePudding user response:

The RecylerView repeats whatever you list item layout defines. Currently, the list item is defined to take full screen height, hence each item takes full screen, so only after you scroll you see other items. You should change your list item to take only the required height. Change layout height to wrap_content for your hospital_design.xml layout.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

Second, I see some issues with the layout as well.

<ImageView
        android:id="@ id/listEdit_tv"
        android:layout_width="134dp"
        android:layout_height="91dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_marginStart="2dp"
        android:layout_marginTop="17dp"
        android:layout_marginEnd="260dp"
        android:layout_marginBottom="726dp" // remove this
        app:srcCompat="@drawable/nuribom"
/>

Here to your ImageView you have given margin from bottom, which is not required since it is aligned relative to top side. You should remove this as well. Then you list item will take only the height that is required.

  • Related