如何将TextView与屏幕中心对齐,并将ImageView贴在屏幕中间?

时间:2017-03-26 14:44:32

标签: android xml alignment android-imageview textview

现在,对于TextView中的较长文本,这就是app的样子:

enter image description here

这是我的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坚持使用它,因为它指的是更改城市名称。 对于较小的文本看起来没问题,但是对于较大的文本,一切都在左边。

1 个答案:

答案 0 :(得分:2)

使用相对布局替换线性布局,如下所示,使用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>