Блог

Проблема: я пытаюсь переделать пользовательский интерфейс комментариев TikTok, используя a BottomSheetDialogFragment и a RecyclerView .

Вот как это выглядит (ОРИГИНАЛ):

Это то, что я пробовал сейчас: по сути, у меня есть FrameLayour, первый дочерний элемент которого содержит все, кроме EditText, а второй дочерний элемент — это, конечно, EditText.

 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@ id/relativeLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:id="@ id/no_of_comments"
            android:layout_width="match_parent"
            android:layout_height="36dp"
            android:text="30.8k comments"
            android:gravity="center_vertical|center_horizontal"
            android:textColor="@color/darkGreyText" />

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="300dp">

            <androidx.recyclerview.widget.RecyclerView
                tools:listitem="@layout/item_comment"
                android:id="@ id/comments_list"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

        </ScrollView>
    </LinearLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:orientation="horizontal"
        android:layout_gravity="bottom"
       >

        <EditText
            android:id="@ id/editText"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/border_edit_text"
            android:hint="Leave a comment"
            android:paddingLeft="16dp"
            android:paddingRight="16dp"
            android:textSize="12sp" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/bleh"
            android:background="@android:color/white"
            android:alpha="0.3"
            android:layout_alignParentRight="true"
            android:hapticFeedbackEnabled="true"
            />

    </RelativeLayout>

</FrameLayout>
  

Обратите внимание, что у меня есть ScrollView фиксированного размера, чтобы текст редактирования всегда был виден на экране. Если я удалю это, текст редактирования станет видимым только тогда, когда нижняя таблица будет на весь экран.

Проблема: проблема в том, что текст редактирования всегда находится поверх представления recylcer. Это то, что я хочу, но это привело к новой проблеме: после прокрутки до нижней части списка (recylcerview) последний элемент не отображается полностью, поскольку он скрыт EditText.

Вы можете добавить отступ в нижней части своего RecyclerView , чтобы он всегда оставался сверху EditText . Таким образом, EditText он выглядит «липким» и RecyclerView не будет покрыт EditText

Просто используйте линейный макет в качестве корневого и примените вес для повторного просмотра.

 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@ id/no_of_comments"
        android:layout_width="match_parent"
        android:layout_height="36dp"
        android:text="30.8k comments"
        android:gravity="center_vertical|center_horizontal"
        android:textColor="@color/darkGreyText" />



        <androidx.recyclerview.widget.RecyclerView
            tools:listitem="@layout/item_comment"
            android:id="@ id/comments_list"
            android:layout_width="match_parent"
            android:layout_weight="1"         
            android:layout_height="0dp" />




<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:orientation="horizontal"
    android:layout_gravity="bottom"
   >

    <EditText
        android:id="@ id/editText"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/border_edit_text"
        android:hint="Leave a comment"
        android:paddingLeft="16dp"
        android:paddingRight="16dp"
        android:textSize="12sp" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/bleh"
        android:background="@android:color/white"
        android:alpha="0.3"
        android:layout_alignParentRight="true"
        android:hapticFeedbackEnabled="true"
        />

   </RelativeLayout>
</LinearLayout>