简体   繁体   中英

Android text alignment inside textview is wrong

I'm trying to align text inside textview to the center (both vertical and horizontal). Altought the vertical alignment working properlly in the Android Studio preview, it fails on the emulator.

The design:

在此输入图像描述

The android studio preview:

在此输入图像描述

The emulator:

在此输入图像描述

The code:

<RelativeLayout
    android:id="@+id/teamsBox"
    android:layout_width="match_parent"
    android:layout_height="185dp">

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="wrap_content"
        android:background="@drawable/team_bg"
        android:padding="6dp"
        android:layout_alignParentLeft="true"
        android:orientation="vertical">

        <EditText
            android:id="@+id/teamOneName"
            android:layout_width="143dp"
            android:layout_height="42dp"
            android:text="HOME"
            android:textColor="@color/my_white"
            android:background="@color/my_transparent"
            android:textSize="23sp"
            android:singleLine="true"
            android:gravity="center"/>

        <TextView
            android:id="@+id/teamOneScore"
            android:layout_width="143dp"
            android:layout_height="132dp"
            android:text="3"
            android:textColor="@color/my_green"
            android:textSize="127sp"
            android:gravity="center"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="match_parent"
        android:background="@drawable/team_bg"
        android:padding="6dp"
        android:layout_alignParentRight="true"
        android:orientation="vertical">

        <EditText
            android:id="@+id/teamTwoName"
            android:layout_width="match_parent"
            android:layout_height="42dp"
            android:text="AWAY"
            android:textColor="@color/my_white"
            android:background="@color/my_transparent"
            android:textSize="23sp"
            android:singleLine="true"
            android:gravity="center"/>

        <TextView
            android:id="@+id/teamTwoScore"
            android:layout_width="fill_parent"
            android:layout_height="132dp"
            android:text="1"
            android:textColor="@color/my_green"
            android:textSize="127sp"
            android:gravity="center"
            android:layout_gravity="center"/>

    </LinearLayout>

</RelativeLayout>

Edit: I've changed to layout according to the answers, but the bug is still happening. This is my new layout:

<RelativeLayout
    android:id="@+id/teamsBox"
    android:layout_width="match_parent"
    android:layout_height="185dp">

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:background="@drawable/team_bg"
        android:orientation="vertical"
        android:padding="6dp" >

        <EditText
            android:id="@+id/teamOneName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="HOME"
            android:textColor="@color/my_white"
            android:background="@color/my_transparent"
            android:textSize="23sp"
            android:singleLine="true"
            android:padding="8dp"
            android:gravity="center"/>

        <TextView
            android:id="@+id/teamOneScore"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:text="3"
            android:textColor="@color/my_green"
            android:textSize="127sp"
            android:gravity="center_vertical|center_horizontal"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="match_parent"
        android:background="@drawable/team_bg"
        android:padding="6dp"
        android:layout_alignParentRight="true"
        android:orientation="vertical">

        <EditText
            android:id="@+id/teamTwoName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="AWAY"
            android:textColor="@color/my_white"
            android:background="@color/my_transparent"
            android:textSize="23sp"
            android:singleLine="true"
            android:padding="8dp"
            android:gravity="center"/>

        <TextView
            android:id="@+id/teamTwoScore"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:text="1"
            android:textColor="@color/my_green"
            android:textSize="127sp"
            android:gravity="center"
            android:layout_gravity="center"/>

    </LinearLayout>

</RelativeLayout>

To problem is in the TextView itself, the large size of the text is not calculated by the gravity attribute.

Try adding this attribute to your text view android:includeFontPadding="false"

set your textView's android:gravity to center_vertical | center_horizontal center_vertical | center_horizontal

<TextView
     android:id="@+id/teamOneScore"
     android:layout_width="143dp"
     android:layout_height="132dp"
     android:text="3"
     android:textColor="@color/my_green"
     android:textSize="127sp"
     android:gravity="center_vertical | center_horizontal" />

Remove hard coded width and height and use weight .Try the following data

<RelativeLayout
    android:id="@+id/teamsBox"
    android:layout_width="match_parent"
    android:layout_height="185dp" >

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:background="@drawable/button_background"
        android:orientation="vertical"
        android:padding="6dp" >

        <EditText
            android:id="@+id/teamOneName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#123456"
            android:gravity="center"
            android:singleLine="true"
            android:text="HOME"
            android:textSize="23sp" />

        <TextView
            android:id="@+id/teamOneScore"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:gravity="center_vertical|center_horizontal"
            android:text="3"
            android:layout_weight="1"
            android:textSize="127sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="@drawable/button_background"
        android:orientation="vertical"
        android:padding="6dp" >

        <EditText
            android:id="@+id/teamTwoName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#123456"
            android:gravity="center"
            android:singleLine="true"
            android:text="AWAY"
            android:textSize="23sp" />

        <TextView
            android:id="@+id/teamTwoScore"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:gravity="center_vertical|center_horizontal"
            android:text="1"
            android:layout_weight="1"
            android:textSize="127sp" />
    </LinearLayout>
</RelativeLayout>

Hope this works

try this it may help you,

<?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:background="@android:color/holo_green_light" >

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:orientation="vertical"
        android:padding="6dp" >

        <EditText
            android:id="@+id/teamOneName"
            android:layout_width="143dp"
            android:layout_height="42dp"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:singleLine="true"
            android:text="HOME"
            android:textColor="@android:color/white"
            android:textSize="23sp" />

        <TextView
            android:id="@+id/teamOneScore"
            android:layout_width="143dp"
            android:layout_height="132dp"
            android:gravity="center"
            android:text="3"
            android:background="@android:color/white"
            android:textSize="127sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="154dp"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:orientation="vertical"
        android:padding="6dp" >

        <EditText
            android:id="@+id/teamTwoName"
            android:layout_width="match_parent"
            android:layout_height="42dp"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:singleLine="true"
            android:text="AWAY"
            android:textColor="@android:color/white"
            android:textSize="23sp" />

        <TextView
            android:id="@+id/teamTwoScore"
            android:layout_width="fill_parent"
            android:layout_height="132dp"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="1"
            android:background="@android:color/white"
            android:textSize="127sp" />
    </LinearLayout>

</RelativeLayout>

Your linear layout which is having the edit text and one text view height is lesser than you have given height to its children. Please calculate height for the edit text and text view and accordingly adjust height of your linear layout.

Here You just need to give wrap_content to you text view and .

1. change in text view 

    android:layout_height="132dp"

To

    android:layout_height="wrap_content"

2. Increase you linear layout height to

    android:layout_width="184dp"

3. remove below pading tag from your linear layout

    android:padding="6dp"

it will fix your issue.

只需使用match_parent作为textview的高度。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM