Imageview与textview背后

时间:2016-01-17 18:05:31

标签: android xml android-layout textview imageview

我想要实现的目标如下。 enter image description here

左边的圆是一个ImageView,左边的每个灰色框都是TextView。 听起来很简单,我陷入困境,只能实现以下目标。

enter image description here

这是我的xml`

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:background="@android:color/holo_blue_bright"
    android:id="@+id/singlerowRL"
    android:layout_width="fill_parent"
    android:layout_height="300dp">


    <de.hdodenhof.circleimageview.CircleImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/first"
        android:layout_weight="1"
        android:src="@mipmap/climbing"
        android:layout_width="150dp"
        android:layout_height="150dp"
        app:civ_border_width="2dp"
        app:civ_border_color="#00000000"
         />

        <TextView
            android:textSize="10dp"
            android:id="@+id/interestone"
            android:layout_weight="1"
            android:layout_width="150dp"
            android:layout_height="20dp"
            android:textColor="#000000"
            android:background="@drawable/roundshapebackground"
            android:text="Fitness"
            android:layout_alignParentTop="true"
            android:layout_alignLeft="@+id/interestfive"
            android:layout_alignStart="@+id/interestfive" />

    <TextView
        android:layout_marginTop="10dp"
        android:textSize="10dp"
        android:id="@+id/interesttwo"
        android:layout_weight="1"
        android:layout_width="150dp"
        android:layout_height="20dp"
        android:textColor="#000000"
        android:background="@drawable/roundshapebackground"
        android:text="Gaming"
        android:layout_below="@+id/interestthree"
        android:layout_alignLeft="@+id/interestthree"
        android:layout_alignStart="@+id/interestthree" />

    <TextView
        android:layout_marginTop="5dp"
        android:textSize="10dp"
        android:id="@+id/interestthree"
        android:layout_weight="1"
        android:layout_width="150dp"
        android:layout_height="20dp"
        android:textColor="#000000"
        android:background="@drawable/roundshapebackground"
        android:text="Coding"
        android:layout_below="@+id/interestfour"
        android:layout_alignLeft="@+id/interestfour"
        android:layout_alignStart="@+id/interestfour" />

    <TextView
        android:textSize="10dp"
        android:id="@+id/interestfour"
        android:layout_weight="1"
        android:layout_width="150dp"
        android:layout_height="20dp"
        android:textColor="#000000"
        android:background="@drawable/roundshapebackground"
        android:text="Traveling"
        android:layout_marginTop="10dp"
        android:layout_below="@+id/interestfive"
        android:layout_alignLeft="@+id/interestfive"
        android:layout_alignStart="@+id/interestfive" />

    <TextView
        android:layout_marginTop="10dp"
        android:textSize="10dp"
        android:id="@+id/interestfive"
        android:layout_weight="1"
        android:layout_width="150dp"
        android:layout_height="20dp"
        android:textColor="#000000"
        android:background="@drawable/roundshapebackground"
        android:text="Shopping"
        android:layout_below="@+id/interestone"
        android:layout_centerHorizontal="true" />


</RelativeLayout>`

提前致谢!

2 个答案:

答案 0 :(得分:1)

de.hdodenhof.circleimageview.CircleImageView结尾处TextViews之后尝试RelativeLayout

或者参见this question

答案 1 :(得分:1)

尝试将该循环元素从RelativeLayout的开头移动到RelativeLayout的结束标记之前。