坚持使用Android布局

时间:2015-06-16 19:19:09

标签: android textview android-relativelayout android-cardview

这就是我的布局。以下给出了相应的代码。

enter image description here

    <?xml version="1.0" encoding="utf-8"?>


<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/card_view"
    android:layout_gravity="center"
    android:layout_width="match_parent"
    android:layout_height="280dp"
    card_view:cardElevation="8dp"
    card_view:cardUseCompatPadding="true">

    <RelativeLayout
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"


        android:gravity="bottom">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="Small Text"
            android:id="@+id/postTime"
            android:layout_above="@+id/linearLayout"
            android:layout_alignParentEnd="true"
            android:layout_marginEnd="15dp"
            android:layout_marginBottom="14dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="0"
            android:id="@+id/score"
            android:layout_marginEnd="20dp"
            android:layout_alignParentTop="true"
            android:layout_alignEnd="@+id/postTime"
            android:layout_marginTop="34dp" />


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:id="@+id/postText"
            android:layout_marginLeft="20dp"
            android:gravity="center"
            android:layout_alignBottom="@+id/postTime"
            android:layout_alignParentLeft="true"
            android:layout_toStartOf="@+id/likes"

            android:layout_alignTop="@+id/score" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="0 likes"
            android:id="@+id/likes"

            android:layout_marginTop="19dp"
            android:layout_below="@+id/score"
            android:layout_alignEnd="@+id/postTime" />

        <LinearLayout android:layout_alignParentBottom="true"
            android:layout_marginBottom="6dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:id="@+id/linearLayout">

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/plusTwoButton"
                android:src="@drawable/fab_shadow_mini"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="8dp"
                android:layout_marginBottom="5dp"
                android:background="@drawable/button_border"
                />

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/plusOneButton"
                android:layout_marginBottom="5dp"
                android:src="@drawable/fab_shadow_mini"
                android:layout_marginLeft="8dp"
                android:layout_marginRight="8dp"
                android:background="@drawable/button_border"
                />

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/minusOneButton"
                android:src="@drawable/fab_shadow_mini"
                android:layout_marginLeft="8dp"
                android:layout_marginRight="8dp"
                android:layout_marginBottom="5dp"
                android:background="@drawable/button_border"
                />



            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/minusTwoButton"
                android:src="@drawable/fab_shadow_mini"
                android:layout_marginLeft="8dp"
                android:layout_marginRight="20dp"
                android:layout_marginBottom="5dp"
                android:background="@drawable/button_border"
                />



        </LinearLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:id="@+id/coName"

            android:layout_marginLeft="15dp"
            android:layout_marginTop="5dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:id="@+id/deName"
            android:layout_marginTop="5dp"
            android:layout_alignBottom="@+id/coname"
            android:layout_toEndOf="@+id/coname"
            android:layout_marginStart="29dp" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/deleteButton"
            android:layout_alignBottom="@+id/dename"
            android:layout_alignRight="@+id/likes"
            android:layout_alignEnd="@+id/likes"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_delete_black_18dp" />

    </RelativeLayout>
</android.support.v7.widget.CardView>

这种布局很好,直到“postText”视图的字符数低于某个限制(140)。现在我想在同一个布局中容纳更多文本。因此,我尝试将cardview和相对布局的高度设置为wrapcontent并在相对布局上设置minHeight。如此处所示。

<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="8dp"
card_view:cardUseCompatPadding="true">

<RelativeLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="280dp"

     >

这样做,我得到以下结果,postTime和postText视图迷路了。我该如何调试? 我的目标是让cardview在postText textview中增长为文本大小。

enter image description here

更新:

图像显示两张卡片的文本超出文本视图且小于文本视图。

enter image description here

2 个答案:

答案 0 :(得分:3)

尝试使用此XML布局,CardView将相对于内容区域

增长
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardElevation="8dp"
    card_view:cardUseCompatPadding="true">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <!-- Layout for text body with right side information-->
    <RelativeLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:text="Body Text"
            android:textSize="25sp"
            android:gravity="center"
            android:id="@+id/textbody"
            android:layout_alignParentLeft="true"
            android:layout_toLeftOf="@+id/cardInfo"
            android:minHeight="150dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
        <RelativeLayout
            android:id="@+id/cardInfo"
            android:orientation="vertical"
            android:layout_alignParentRight="true"
            android:layout_alignTop="@+id/textbody"
            android:layout_alignBottom="@+id/textbody"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            >
            <LinearLayout
                android:layout_alignRight="@+id/time"
                android:layout_alignLeft="@+id/time"
                android:orientation="vertical"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">
                <ImageView
                    android:layout_gravity="right"
                    android:layout_width="20dp"
                    android:layout_height="30dp"
                    android:background="#444"/>
                <TextView
                    android:text="0"
                    android:textSize="30sp"
                    android:gravity="center"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />
                <TextView
                    android:text="0 likes"
                    android:textSize="20sp"
                    android:gravity="center"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />
            </LinearLayout>
            <TextView
                android:id="@+id/time"
                android:layout_alignParentBottom="true"
                android:text="in 7 minutes"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        </RelativeLayout>
    </RelativeLayout>

    <!-- Layout for bottom imageVies -->
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageButton
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:id="@+id/plusTwoButton"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="5dp"
            android:background="#444"
            />

        <ImageButton
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:id="@+id/plusOneButton"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:background="#444"
            />

        <ImageButton
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:id="@+id/minusOneButton"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="5dp"
            android:background="#444"
            />



        <ImageButton
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:id="@+id/minusTwoButton"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="20dp"
            android:layout_marginBottom="5dp"
            android:background="#444"
            />
    </LinearLayout>
    </LinearLayout>
</android.support.v7.widget.CardView>

enter image description here

enter image description here

答案 1 :(得分:0)

好吧,好吧。我想我已经治愈了你的布局。不幸的是,这会产生一个过于复杂的嵌套布局结构,但它应该适用于您想要做的事情。

基本上,您需要一个垂直的线性布局来嵌套外部相对布局容器和底部框。然后,您将在该文本和帖子文本中创建线性布局。这很难解释,所以我只会告诉你结构。请注意,我没有CardLayouts,但这应该适用于小调整。

我决定进行这种嵌套,因为你希望你的帖子文本区域也随着左手的大小而增长。您的帖子文本或此侧容器可能是定义卡片大小的容器,因此您需要考虑到这一点并让底层“按下”。最好通过考虑部分区域来做到这一点。

An image of the sections.

所以我们可以看到紫色和蓝色部分应该包含在一个区域中,可能是线性布局。紫色区域本身有多个需要考虑的容器,因此我们可以将其分为两个部分,主要内容是左侧。等等。

我希望这有帮助!

<LinearLayout
    android:orientation="vertical"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/card_view"
    android:layout_gravity="center"
    android:layout_width="match_parent"
    android:elevation="8dp"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:id="@+id/relative"
        android:orientation="horizontal"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <RelativeLayout
            android:id="@+id/postText_container"
            android:layout_alignParentLeft="true"
            android:layout_toStartOf="@+id/text_container"
            android:layout_width="wrap_content"
            android:gravity="center"
            android:layout_height="wrap_content">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:id="@+id/postText"
                android:layout_marginLeft="20dp"
                android:text="bluh lbuh"/>
        </RelativeLayout>


        <LinearLayout
            android:orientation="vertical"
            android:id="@+id/text_container"
            android:layout_alignParentTop="true"
            android:layout_alignParentEnd="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="0 likes"
                android:id="@+id/likes"
                android:layout_marginTop="19dp"
                android:layout_below="@+id/score"
                android:layout_alignEnd="@+id/postTime" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:id="@+id/coName"
                android:layout_marginLeft="15dp"
                android:layout_marginTop="5dp"
                android:layout_alignParentTop="true" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:id="@+id/deName"
                android:layout_marginTop="5dp"
                android:layout_alignBottom="@+id/coName"
                android:layout_toEndOf="@+id/coName"
                android:layout_marginStart="29dp" />

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/deleteButton"
                android:layout_alignBottom="@+id/deName"
                android:layout_alignRight="@+id/likes"
                android:layout_alignEnd="@+id/likes"
                android:background="@android:color/transparent" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="Small Text"
                android:id="@+id/postTime"
                android:layout_alignParentBottom="true"
                android:layout_alignParentEnd="true"
                android:layout_marginEnd="15dp"
                android:layout_marginBottom="14dp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:text="0"
                android:id="@+id/score"
                android:layout_marginEnd="20dp"
                android:layout_alignParentTop="true"
                android:layout_alignEnd="@+id/postTime"
                android:layout_marginTop="34dp" />
        </LinearLayout>
    </RelativeLayout>

    <LinearLayout
        android:layout_marginBottom="6dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/linearLayout">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/plusTwoButton"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="5dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/plusOneButton"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/minusOneButton"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="5dp"
            />



        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/minusTwoButton"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="20dp"
            android:layout_marginBottom="5dp"
            />



    </LinearLayout>
</LinearLayout>

这就是布局呈现的内容(再次记住,我现在没有所有支持库,因此没有CardLayout。当我将所有内容移动到LinearLayout时,可能还会弄清楚应该如何定位事物容器。所以你必须重新定位那些。):

Picture of code on portrait phone.