Question

目前我的listview设计看起来像

但我想让它看起来像下面的图像

图像位于右侧，标题为粗体，副标题位于其下方。我需要在布局中进行哪些更改，以下是我的代码。谢谢预先。

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

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

        <ImageView
            android:id="@+id/ivImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="8dp"
            android:src="@drawable/ic_launcher"/>

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

            <TextView
                android:id="@+id/tvName"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Tom Cruise"
                android:textColor="#166CED"
                android:textAppearance="?android:attr/textAppearanceLarge" />



        </LinearLayout>

    </LinearLayout>

    <TextView
        android:id="@+id/tvDescriptionn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#009A57"
        android:text="Description" />



</LinearLayout>

Answer 1

为了更好地管理您的视图，请使用relativelayout。您可以管理您的布局，如下所示 -

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="4dp"
android:orientation="vertical">
<android.support.v7.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:layout_marginTop="5dp"
    card_view:cardBackgroundColor="@color/grey">

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

        <ImageView
            android:id="@+id/arrow"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="5dp"
            android:src="@drawable/arrow"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/arrow"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tvName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Murdochs needed counselling after hacking scandle says magazine"
            android:textColor="#166CED"
            android:padding="5dp"
            android:textAppearance="?android:attr/textAppearanceLarge" />


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >
            <TextView
                android:id="@+id/tvSubtitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_toLeftOf="@+id/ivImage"
                android:padding="5dp"
                android:text="NEW YORK:The British phone hacking scandle"
                android:textColor="#000"
                android:textAppearance="?android:attr/textAppearanceSmall" />
            <ImageView
                android:id="@+id/ivImage"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="8dp"
                android:layout_centerVertical="true"
                android:layout_alignParentRight="true"
                android:src="@drawable/ic_launcher"/>
        </RelativeLayout>

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

Answer 2

我建议你使用相对布局。这将使您的布局更灵活地进行编辑。我在下面建议了一个布局，试一试。

<?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="match_parent">

<TextView
    android:id="@+id/tvName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="10dp"
    android:gravity="center_horizontal"
    android:text="Tom Cruse"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:textColor="#166CED" />

<ImageView
    android:id="@+id/ivImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true"
    android:layout_below="@+id/tvName"
    android:layout_margin="5dp"
    android:src="@drawable/ic_launcher" />

<TextView
    android:id="@+id/tvDescriptionn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_below="@+id/tvName"
    android:layout_margin="10dp"
    android:layout_toLeftOf="@+id/ivImage"
    android:text="Description"
    android:textColor="#009A57" />
</RelativeLayout>

如果它适合你，请接受这个答案。

Answer 3

您必须将flowTextView jar用于您的项目。在这里你可以找到罐子： https://github.com/deano2390/FlowTextView

Answer 4

在LinearLayout内部，将textview放在顶部以显示标题。使height wrap_content和width match_parent。

在此下方，添加包含textview和image的linearlayout。将方向水平设置为内衬布局。

为了更好地放置，您始终可以使用相对布局。例如

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.testlayout.MainActivity" >

<TextView

    android:id="@+id/titleText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello_world" />

<TextView 
    android:id="@+id/descriptionText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/titleText"
    android:text="description"/>

<ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/titleText"
   android:layout_toLeftOf="@+id/rightArrow"
   android:src="@drawable/ic_launcher" />

<ImageView
    android:id="@+id/rightArrow"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/titleText"
    android:src="@drawable/ic_launcher"
    android:layout_alignParentEnd="true" />



</RelativeLayout>

如何根据下面给出的图像更改andorid布局

4 个答案: