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.