如何在xml中的ImageView旁边创建一个TextView

Question

如何创建一个位于xml图像视图旁边的TextView，我会继续尝试并最终获得混乱的布局。

该文本旨在描述图像的内容，它必须是正确的并且对齐，任何指针或帮助都将受到赞赏

What I am trying to achieve

我的xml就是这个

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

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_menu"
    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.drecot.chopperattack.HelpActivity"
    android:background="@drawable/splash">

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/helpscreen"
            android:layout_marginTop="130dp"
            android:layout_toEndOf="@+id/imageButton"
            android:layout_toRightOf="@+id/imageButton"
            android:src="@drawable/fuelbig" />

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/imageView2"
            android:layout_marginLeft="80dp"
            android:layout_marginStart="80dp"
            android:layout_toEndOf="@+id/imageView2"
            android:layout_toRightOf="@+id/imageView2"
            android:text="you can turn away now if you wish"
            android:textColor="#eee"
            android:textSize="18sp" />

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/helpscreen"
            android:layout_marginTop="180dp"
            android:layout_toEndOf="@+id/imageButton"
            android:layout_toRightOf="@+id/imageButton"
            android:src="@drawable/fuelsmall" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/imageView3"
            android:layout_marginLeft="80dp"
            android:layout_marginStart="80dp"
            android:layout_toEndOf="@+id/imageView3"
            android:layout_toRightOf="@+id/imageView3"
            android:text="you can turn away now if you wish"
            android:textColor="#eee"
            android:textSize="18sp" />

</RelativeLayout>

Answer 1

试试这个你可以像这样使用android:drawableLeft="@mipmap/ic_launcher"

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:text="test"
    android:gravity="center"
    android:drawableLeft="@mipmap/ic_launcher"/>

或使用像这样的相对布局

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

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_placeholder" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/imageView2"
        android:layout_toRightOf="@+id/imageView2"
        android:gravity="center"
        android:text="test" />
</RelativeLayout>

Answer 2

您只需使用android:layout_toRightOf作为textview。因此，使用oneTextview的一个imageview的代码将是

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    android:layout_marginTop="130dp"
    android:src="@drawable/fuelbig" />

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    android:layout_marginLeft="10dp"
    android:layout_toRightOf="@+id/imageView2"
    android:text="you can turn away now if you wish"
    android:textColor="#eee"
    android:textSize="18sp" />

我从您的第一张图片视图中删除了android:layout_below="@+id/helpscreen"，因为我认为即使这是必要的，因为它是您的第一个视图，而不是在任何下方

Answer 3

只需在布局中添加权重，根据您给出的比例自动划分布局，并删除所有其他布局 paddings，margin_left，margin_right 等其他东西

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

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight=".2"
                android:src="@drawable/guitar"
                />

            <TextView
                android:id="@+id/textView"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight=".8"
                android:text="you can turn away now if you wish"
                android:textColor="#eee"
                android:textSize="18sp" />
        </LinearLayout>

以下是完整的代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_menu"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

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

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:src="@drawable/guitar"
            android:layout_weight=".2"/>

        <TextView
            android:id="@+id/textView"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".8"
            android:text="you can turn away now if you wish"
            android:textColor="#eee"
            android:textSize="18sp" />
    </LinearLayout>

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

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:src="@drawable/guitar"
            android:layout_weight=".2"/>

        <TextView
            android:id="@+id/textView1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".8"
            android:text="you can turn away now if you wish"
            android:textColor="#eee"
            android:textSize="18sp" />
    </LinearLayout>

</LinearLayout>

Answer 4

请参阅以下代码，可能会帮助您：

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

    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/activity_menu"
        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.drecot.chopperattack.HelpActivity"
        >



      <LinearLayout
          android:layout_width="match_parent"
          android:orientation="vertical"
          android:layout_height="match_parent">
          <LinearLayout
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="horizontal"
              >
              <ImageView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:background="@mipmap/ic_launcher"
                  />
              <TextView
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content" 
                  android:layout_gravity="center_vertical"
                  android:layout_marginLeft="10dp"
                  android:text="this is for testing"
                  />

          </LinearLayout>
          <LinearLayout
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="horizontal"
              >
              <ImageView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:background="@mipmap/ic_launcher"
                  />
              <TextView
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:layout_gravity="center_vertical"
                  android:layout_marginLeft="10dp"
                  android:text="this is for testing"
                  />

          </LinearLayout>

      </LinearLayout>

    </RelativeLayout>