Android布局:类似于Facebook应用的评论活动

时间:2015-11-03 19:47:37

标签: android facebook android-layout android-xml

我一直关注Facebook评论活动:

facebook

我一直想知道他们如何设法使他们的edittext从一行增加到最多4行,同时,包含帖子的recyclerview也会向上调整并缩小尺寸。当您输入文本时会自动发生这种情况。

我尝试通过执行以下操作来自行复制布局,但我无法显示超过2行。它一直在限制"发送"的大小。箭头,但edittext在下面的例子中永远不会遍历recyclerview。

myfacebook

以下是我的xml布局代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@color/white"
    >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/like_box"
        android:text="Number of Likes goes here"
        android:maxLines="1"
        android:minLines="1"
        android:layout_margin="16dp"
        />

    <View
        android:layout_width="match_parent"
        android:layout_height="0.2dp"
        android:id="@+id/divider"
        android:layout_below="@+id/like_box"
        android:background="@color/half_black"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/my_recycler_view"
        android:layout_below="@+id/divider"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/commenttext" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0.2dp"
        android:id="@+id/divider2"
        android:layout_below="@+id/my_recycler_view"
        android:background="@color/half_black"/>


        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/commenttext"
            android:layout_toLeftOf="@+id/send"
            android:background="@null"
            android:paddingLeft="16dp"
            android:textSize="16sp"
            android:hint="Add a comment here"
            android:layout_alignTop="@+id/send"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_alignParentBottom="true" />

        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:id="@+id/send"
            android:src="@drawable/ic_action_send_now"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />
</RelativeLayout>

有没有人知道正确的xml布局代码是什么,以确保在输入文本时edittext和recyclerview都向上调整?我认为它只是简单的设置&#34; wrap_content&#34;我已经完成的edittext但它仍然没有正确调整。

Anoop M的回答似乎与我想做的最接近,但是Recyclerview没有正确调整 - 见下图。想象一下,如果屏幕的蓝色部分填充了文本,当您输入4行以上时,edittext将最终将文本隐藏在蓝色部分中。 edittext似乎只是回顾了recyclerview。在facebook应用程序上不会发生这种情况,当edittext大小增加时,recyclelerview向上调整时会显示注释。

Anoop M's answer

5 个答案:

答案 0 :(得分:5)

我建议使用LinearLayout作为父容器。然后,您可以通过在所有子视图上应用layout_weights来实现所需的结果:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/like_box"
        android:text="Number of Likes goes here"
        android:maxLines="1"
        android:minLines="1"
        android:layout_margin="16dp"
        android:layout_weight="0"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="0.2dp"
        android:id="@+id/divider"
        android:background="@color/half_black"
        android:layout_weight="0"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/my_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="0.2dp"
        android:id="@+id/divider2"
        android:background="@color/half_black"
        android:layout_weight="0"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:orientation="horizontal">

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:id="@+id/commenttext"
            android:background="@null"
            android:paddingLeft="16dp"
            android:textSize="16sp"
            android:maxLines="4"
            android:inputType="textMultiLine"
            android:hint="Add a comment here" />

        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:id="@+id/send"
            android:src="="@drawable/ic_action_send_now"
            android:layout_weight="0" />

    </LinearLayout>

</LinearLayout>

值得注意的变化:

  • 父容器现在是LinearLayout
  • 所有子视图都已layout_weights分配
  • EditTextsend按钮位于水平LinearLayout内。
  • 根据您的要求,maxLines
  • EditText属性已设置为4。这样,EditText将保持高度增长,直到它的4行高,之后它将开始滚动。 send按钮将保持与第一行对齐。
  • inputType="textMultiLine"已添加到EditText,表示此EditText的内容可以跨越多行。
  • RecyclerView行数增加时,EditText's会缩小,反之亦然。

答案 1 :(得分:0)

您需要为编辑文本设置singleLine = false属性

<EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/commenttext"
            android:layout_toLeftOf="@+id/send"
            android:background="@null"
            android:paddingLeft="16dp"
            android:textSize="16sp"
            android:singleLine="false"
            android:hint="Add a comment here"
            android:layout_alignTop="@+id/send"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_alignParentBottom="true" />

答案 2 :(得分:0)

试试这个。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center">


    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="65dp"
        android:fadeScrollbars="true">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="10dp">

            <LinearLayout
                android:id="@+id/topedittext_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:orientation="vertical">

                <!--Your Contents Goes Here-->

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="Your Contents Goes Here" />

            </LinearLayout>
        </RelativeLayout>

    </ScrollView>

    <RelativeLayout
        android:id="@+id/tos_text_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp">


        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:background="@null"
            android:gravity="center"
            android:hint="Type message"
            android:maxLines="4"
            android:minHeight="60dp"
            android:padding="7dp"
            android:singleLine="false"
            android:textColor="#88000000"
            android:textColorHint="#bdbdbd"
            android:textSize="15sp" />


    </RelativeLayout>

</RelativeLayout>

答案 3 :(得分:0)

用于设置XML使用的最大和最小行。

android:maxlines =&#34;您的选择&#34; //整数 android:minlines =&#34;你的选择&#34; //整数

或者如果您想在一行中显示文字,请使用:

机器人:ellipsize

答案 4 :(得分:0)

当你在下面给出的清单添加代码中定义活动时

 <activity
android:name="com.companyname.applicationname"
android:windowSoftInputMode="adjustResize|adjustPan">

您也可以使用下面的编辑文本。

<EditText
    android:inputType="textMultiLine" <!-- Multiline input -->
    android:lines="8" <!-- Total Lines prior display -->
    android:minLines="6" <!-- Minimum lines -->
    android:gravity="top|left" <!-- Cursor Position -->
    android:maxLines="10" <!-- Maximum Lines -->
    android:layout_height="wrap_content" <!-- Height determined by content -->
/>