Android布局 - 左侧图像,右侧有3个文本视图

时间:2017-01-21 07:05:58

标签: android android-layout

下图显示了我想要的布局。

我能够将图像视图和第一个textview放在正确的位置。但是,另外两个textview正在imageview下方。

有人可以帮忙吗?

enter image description here



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

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

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

        <ImageView
            android:id="@+id/icon"
            android:layout_width="110dp"
            android:layout_height="110dp"
            android:background="@drawable/attraction_bg"
            android:gravity="left"
            android:adjustViewBounds="true"
            android:scaleType="fitXY"
            android:layout_marginBottom="2dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="10dp" />

        <TextView
            android:layout_toRightOf="@id/icon"
            android:id="@+id/row1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="30dp"
            android:textColor="@android:color/black"
            android:textSize="20dp"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/row2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:textColor="@android:color/black"
            android:textSize="20dp" />

        <TextView
            android:id="@+id/row3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:textColor="@android:color/black"
            android:textSize="20dp" />


    </LinearLayout>

</LinearLayout>
&#13;
&#13;
&#13;

4 个答案:

答案 0 :(得分:2)

在xml中使用它。

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

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

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

        <ImageView
            android:id="@+id/icon"
            android:layout_width="110dp"
            android:layout_height="110dp"
            android:layout_marginBottom="2dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="10dp"
            android:adjustViewBounds="true"
            android:background="@mipmap/ic_launcher"
            android:gravity="left"
            android:scaleType="fitXY" />

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

            <TextView
                android:id="@+id/row1"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="30dp"
                android:layout_weight="1"
                android:text="TextView 1"
                android:textColor="@android:color/black"
                android:textSize="20dp" />

            <TextView
                android:id="@+id/row2"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="TextView 1"
                android:textColor="@android:color/black"
                android:textSize="20dp" />

            <TextView
                android:id="@+id/row3"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="TextView 1"
                android:textColor="@android:color/black"
                android:textSize="20dp" />
        </LinearLayout>

    </LinearLayout>

答案 1 :(得分:2)

您只需要切换LinearLayouts

即可

尝试这样的事情:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="110dp"
        android:layout_height="110dp"
        android:background="@drawable/attraction_bg"
        android:gravity="left"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:layout_marginBottom="2dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="10dp" />

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

        <TextView
            android:layout_toRightOf="@id/icon"
            android:id="@+id/row1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="30dp"
            android:textColor="@android:color/black"
            android:textSize="20dp"
            android:text="line 1"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/row2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:textColor="@android:color/black"
            android:text="line 2"
            android:textSize="20dp" />

        <TextView
            android:id="@+id/row3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:textColor="@android:color/black"
            android:text="line 3"
            android:textSize="20dp" />

    </LinearLayout>

</LinearLayout>

答案 2 :(得分:0)

您必须使用相对布局检查代码

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

    <ImageView
        android:id="@+id/icon"
        android:layout_width="110dp"
        android:layout_height="110dp"
        android:gravity="left"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:layout_marginBottom="2dp"
        android:background="@drawable/attraction_bg"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="10dp" />

    <TextView
        android:id="@+id/row2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_toRightOf="@id/icon"
        android:textColor="@android:color/black"
        android:textSize="20dp" />

    <TextView
        android:id="@+id/row3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:textSize="20dp"
        android:layout_below="@+id/row1"
        android:layout_toRightOf="@id/icon"
        />

    <TextView
        android:id="@+id/row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:textSize="20dp"
        android:layout_weight="1"
        android:layout_toRightOf="@id/icon"
        android:layout_below="@+id/row2"
    />
</RelativeLayout>

答案 3 :(得分:0)

你应该像这样使用RelativeLayout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/icon"
        android:layout_width="110dp"
        android:layout_height="110dp"
        android:background="@color/colorPrimary"
        android:gravity="left"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:layout_marginBottom="2dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="10dp" />

    <TextView
        android:layout_toRightOf="@id/icon"
        android:id="@+id/row1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:textColor="@android:color/black"
        android:textSize="20dp"
        android:text="text one"
        />

    <TextView
        android:text="text two"
        android:id="@+id/row2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:textSize="20dp"
        android:layout_below="@+id/row1"
        android:layout_toRightOf="@+id/icon"
        android:layout_toEndOf="@+id/icon" />

    <TextView
        android:text="text third"
        android:id="@+id/row3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:textSize="20dp"
        android:layout_below="@+id/row2"
        android:layout_toRightOf="@+id/icon"
        android:layout_toEndOf="@+id/icon" />


</RelativeLayout>