如何将 TextView 对齐到屏幕中心，并将 ImageView 贴在它旁边？

Question

对于 TextView 中较长的文本，这就是应用程序现在的样子：

这是我的 xml 文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:focusable="true"
    android:focusableInTouchMode="true"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    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"
    android:orientation="vertical"
    tools:context="com.example.hpuser.weatherapp.MainActivity"
    android:weightSum="1">

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

        <TextView
            android:textColor="@android:color/background_dark"
            android:id="@+id/textViewCity"
            android:layout_width="158dp"
            android:layout_height="wrap_content"
            android:layout_gravity="end"
            android:layout_weight="1.40"
            android:background="@android:color/transparent"
            android:ems="10"
            android:text="Name"
            android:textAlignment="textEnd"
            android:textSize="24sp" />

        <ImageView
            android:id="@+id/imageViewPen"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:adjustViewBounds="false"
            app:srcCompat="@android:drawable/ic_menu_edit" />

    </LinearLayout>

    <TextView
        android:textColor="@android:color/background_dark"
        android:id="@+id/textViewTemperature"
        android:layout_width="350dp"
        android:layout_height="wrap_content"
        android:text="0 Celsius deg"
        android:textAlignment="center"
        android:textSize="24sp" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.32"
        app:srcCompat="@android:drawable/ic_menu_report_image" />

    <TextView
        android:textColor="@android:color/background_dark"
        android:id="@+id/textViewDescription"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Description"
        android:textAlignment="center"
        android:textSize="24sp" />

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:layout_weight="0.58"
        android:paddingTop="40dp">

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:id="@+id/textViewWind"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight=".25"
                android:paddingBottom="10dp"
                android:text="Wind speed [mps]"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/textViewWindValue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:paddingBottom="10dp"
                android:id="@+id/textViewClouds"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight=".25"
                android:text="Cloudiness  [%]"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/textViewCloudsValue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />

        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:paddingBottom="10dp"
                android:id="@+id/textViewSunrise"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight=".25"
                android:text="Sunrise"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/textViewSunriseValue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:paddingBottom="10dp"
                android:id="@+id/textViewSunset"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight=".25"
                android:text="Sunset"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/textViewSunsetValue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/background_dark"
                android:textSize="18sp" />
        </TableRow>

    </TableLayout>

</LinearLayout>

我希望城市名称居中，并且 ImageView 坚持它，因为它指的是更改城市名称。 较小的文本看起来不错，但对于较大的文本，所有内容都向左移动。

Answer 1

将线性布局替换为如下所示的相对布局，使用 torightof 属性我们可以确保图像始终保持在右侧。

Layout_centerHorizo​​ntal 使其始终与屏幕中心对齐。

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

    <TextView
        android:textColor="@android:color/background_dark"
        android:id="@+id/textViewCity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:text="logng_name_here"
        **android:layout_centerHorizontal="true"**
        android:textSize="24sp"
         />

    <ImageView
        android:id="@+id/imageViewPen"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@android:drawable/ic_menu_edit"
        **android:layout_toRightOf="@+id/textViewCity"**
         />

</RelativeLayout>