Android: TextView: elimine el espacio y el relleno en la parte superior e inferior


208

Cuando tengo una TextViewcon a \nen el texto, a la derecha tengo dos singleLine TextViews, una debajo de la otra sin espacios entre ellas. He establecido lo siguiente para los tresTextView s.

android:lineSpacingMultiplier="1" 
android:lineSpacingExtra="0pt" 
android:paddingTop="0pt" 
android:paddingBottom="0pt"

La primera línea de la izquierda TextView alinea perfectamente con la parte superior derecha TextView.

La segunda linea de la izquierda TextView es un poco más alta que la segunda línea de la parte inferior derecha TextView.

Parece que hay algún tipo de relleno oculto en la parte superior e inferior del TextViews. ¿Cómo puedo eliminar eso?


intenta establecer la gravedad de esta vista de texto en center_vertical
Dawid Hyży

Hola, George Bailey, ¿tienes solución después de tanto tiempo? Me encuentro con este problema también ahora. ¿Me puede dar su solución? Gracias.
mmm2006

1
@ mmm2006, Hace tanto tiempo que no sé qué terminé haciendo. Prueba las soluciones en las respuestas. Si eso no funciona, haga una nueva pregunta.
Bryan Field

Esto no funcionó para mí
Marty Miller

alguna de las respuestas a continuación no funcionó para mí, ¿pueden ayudarme
Richa

Respuestas:


521
setIncludeFontPadding (boolean includepad)

o en XMLesto sería:

android:includeFontPadding="false"

Establezca si TextViewincluye acolchado superior e inferior adicionales para dejar espacio para los acentos que superan el ascenso y descenso normales. El defecto es cierto.


3
Pero parece que siempre tiene un 1dprelleno superior / inferior, ¿estoy equivocado? (Lo uso Developer options -> Show layout bounds)
Autobots

94
includeFontPadding="false"elimina parte del espacio, pero no todo. muy extraño.
theblang

77
Esto puede ser una espada de doble filo. includeFontPaddinges ideal para eliminar cualquier relleno adicional de la fuente en sí, pero puede causar problemas en idiomas que tienen ascendentes y descendientes. Me aseguraría de que si hace esto, pruebe idiomas como el español y el tailandés si los admite.
Elliott

3
Después de configurar el tiempo de ejecución, ¿no toma el relleno superior sino el relleno inferior todavía allí, incluso el relleno izquierdo y derecho también? ¿cualquier sugerencia?
Código

55
Esto no funcionó para mí. No entiendo lo que me estoy perdiendo. Todavía tengo espacio no deseado en la parte inferior de mi TextView
Marty Miller

41

Siento tu dolor. He intentado todas las respuestas anteriores, incluida lasetIncludeFontPadding de falso, que no hizo nada por mí.

¿Mi solución? layout_marginBottom="-3dp"sobre elTextView te da una solución para el fondo, BAM!

Aunque, -3dp en layout_marginTopfalla ... ugh.


66
Esto puede llevar a que se corte el final del texto
Jason Robinson,

2
Realmente mala idea de uso margen negativo. Es mejor considerar una vista personalizada y dibujar el texto exactamente como lo desee.
Flynn81

Si el parche es así, también debe calcular la proporción del tamaño de fuente.
phnghue

37

Busqué mucho la respuesta correcta, pero no pude encontrar una respuesta que pudiera eliminar exactamente todo el relleno del TextView, pero finalmente, después de pasar por el documento oficial, obtuve una solución para los textos de línea única

android:includeFontPadding="false"
android:lineSpacingExtra="0dp"

Agregar estas dos líneas a TextViewxml hará el trabajo.
El primer atributo elimina el relleno reservado para los acentos y el segundo atributo elimina el espacio reservado para mantener el espacio adecuado entre dos líneas de texto.

Asegúrese de no agregar lineSpacingExtra="0dp"TextView multilínea ya que podría hacer que la apariencia sea torpe


11
agregar estas dos líneas no funciona para mí y tampoco hay cambios en el relleno
sunil kushwah

@sunilkushwah, definitivamente funcionará si lo estás haciendo correctamente. Estaría encantado de ayudarlo si puede proporcionar más detalles sobre su problema.
Mohammed Atif el

@sunilkushwah Probablemente puedas presionarlo en Github y compartir el enlace
Mohammed Atif

@sunilkushwah veo que estás usando Brandon Font (fuente personalizada). ¿Puedes intentarlo una vez eliminando el fontPathatributo?
Mohammed Atif el

probé esto pero no funciona, Nota: no quiero ningún relleno predeterminado en TextView
sunil kushwah

14

Si usa AppCompatTextView(o de API 28adelante en adelante) puede usar la combinación de esos 2 atributos para eliminar el espacio en la primera línea:

XML

android:firstBaselineToTopHeight="0dp"
android:includeFontPadding="false"

Kotlin

text.firstBaselineToTopHeight = 0
text.includeFontPadding = false

11

Esto también me molestó, y la respuesta que encontré fue que en realidad hay espacio adicional en la fuente en sí, no en TextView. Es bastante irritante, ya que proviene de un fondo de publicación de documentos, la cantidad limitada de control que tiene con Android sobre los elementos tipográficos. Recomiendo usar un tipo de letra personalizado (como Bitstream Vera Sans, que tiene licencia para redistribución) que puede no tener este problema. Sin embargo, no estoy seguro específicamente de si lo hace o no.


¿Tienes alguna fuente gratuita para señalarme? ¡No necesito tener margen encima sin asignar márgenes negativos! ¡Gracias!
bóveda

11

Puede intentar usar este atributo (ConstraintLayout):layout_constraintBaseline_toBaselineOf

Me gusta esto:

aplicación: layout_constraintBaseline_toBaselineOf = "@ + id / textView"

ingrese la descripción de la imagen aquí

ingrese la descripción de la imagen aquí


10

Elimino el espacio en mi vista personalizada: NoPaddingTextView.

https://github.com/SenhLinsh/NoPaddingTextView

ingrese la descripción de la imagen aquí

package com.linsh.nopaddingtextview;

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.util.Log;
import android.util.TypedValue;
import android.widget.TextView;

/**
 * Created by Senh Linsh on 17/3/27.
 */

public class NoPaddingTextView extends TextView {

    private int mAdditionalPadding;

    public NoPaddingTextView(Context context) {
        super(context);
        init();
    }


    public NoPaddingTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    private void init() {
        setIncludeFontPadding(false);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        int yOff = -mAdditionalPadding / 6;
        canvas.translate(0, yOff);
        super.onDraw(canvas);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        getAdditionalPadding();

        int mode = MeasureSpec.getMode(heightMeasureSpec);
        if (mode != MeasureSpec.EXACTLY) {
            int measureHeight = measureHeight(getText().toString(), widthMeasureSpec);

            int height = measureHeight - mAdditionalPadding;
            height += getPaddingTop() + getPaddingBottom();
            heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);
        }
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    private int measureHeight(String text, int widthMeasureSpec) {
        float textSize = getTextSize();

        TextView textView = new TextView(getContext());
        textView.setTextSize(TypedValue.COMPLEX_UNIT_PX, textSize);
        textView.setText(text);
        textView.measure(widthMeasureSpec, 0);
        return textView.getMeasuredHeight();
    }

    private int getAdditionalPadding() {
        float textSize = getTextSize();

        TextView textView = new TextView(getContext());
        textView.setTextSize(TypedValue.COMPLEX_UNIT_PX, textSize);
        textView.setLines(1);
        textView.measure(0, 0);
        int measuredHeight = textView.getMeasuredHeight();
        if (measuredHeight - textSize > 0) {
            mAdditionalPadding = (int) (measuredHeight - textSize);
            Log.v("NoPaddingTextView", "onMeasure: height=" + measuredHeight + " textSize=" + textSize + " mAdditionalPadding=" + mAdditionalPadding);
        }
        return mAdditionalPadding;
    }
}

¿Es esta pregunta o respuesta?
Tushar

@Tushar Es una respuesta.
Linsh

Okay. ¿Pueden agregar alguna explicación con el código aquí?
Tushar

@Tushar Claro, pero es un poco más.
Linsh

3
Si bien este código puede resolver la pregunta, incluir una explicación de cómo y por qué esto resuelve el problema realmente ayudaría a mejorar la calidad de su publicación (y obtener votos positivos). ¡Recuerde que está respondiendo la pregunta para los lectores en el futuro, no solo la persona que pregunta ahora! Edite su respuesta para agregar una explicación e indique qué limitaciones y supuestos se aplican.
Makyen

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

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/baselineImage"
        android:includeFontPadding="false" />

    <ImageView
        android:id="@+id/baselineImage"
        android:layout_width="1dp"
        android:layout_height="1dp"
        android:baselineAlignBottom="true"
        android:layout_alignParentBottom="true" />

    <!-- This view will be exactly 10dp below the baseline of textView -->
    <View
        android:id="@+id/view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_below="@+id/baselineImage" />

</RelativeLayout>

Con un ImageView adicional, podemos configurar TextView para que esté alineado con la línea base con ImageView y establecer TrueView android:baselineAlignBottomen ImageView, lo que hará que la línea base de ImageView sea inferior. Otras vistas pueden alinearse utilizando la parte inferior de ImageView, que es la misma que la línea de base de TextView.

Sin embargo, esto solo repara el fondo del relleno, no la parte superior.


perfecto para mi situación, mucho mejor que eliminar el relleno de fuente. +1
Bawa

3

Creo que este problema se puede resolver de esta manera:

 <TextView
        android:id="@+id/leftText"
        android:includeFontPadding="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30dp"
        android:text="Hello World!\nhello world" />

 <TextView
        android:id="@+id/rightUpperText"
        android:includeFontPadding="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/leftText"
        android:layout_alignTop="@+id/leftText"
        android:textSize="30dp"
        android:text="Hello World!" />

 <TextView
        android:id="@+id/rightLowerText"
        android:includeFontPadding="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/leftText"
        android:layout_below="@+id/rightUpperText"
        android:textSize="30dp"
        android:text="hello world" />

Esos son los resultados:

Captura de pantalla-1

Captura de pantalla-3

Aunque la línea de caracteres especiales en rightLowerText se ve un poco más alta que la segunda línea de leftText, sus líneas de base están alineadas.


includeFontPadding = "false" era exactamente lo que necesitaba! Gracias.
hman

3

Como mi requisito es anular la obtención de textView existente findViewById(getResources().getIdentifier("xxx", "id", "android"));, no puedo simplemente intentar onDraw()otra respuesta.

Pero acabo de descubrir los pasos correctos para solucionar mi problema, aquí está el resultado final de Layout Inspector:

ingrese la descripción de la imagen aquí

Como lo que quería es simplemente eliminar los espacios superiores, no tengo que elegir otra fuente para eliminar los espacios inferiores.

Aquí está el código crítico para arreglarlo:

Typeface mfont = Typeface.createFromAsset(getResources().getAssets(), "fonts/myCustomFont.otf");
myTextView.setTypeface(mfont);

myTextView.setPadding(0, 0, 0, 0);

myTextView.setIncludeFontPadding(false);

La primera clave es configurar la fuente personalizada "fonts / myCustomFont.otf" que tiene el espacio en la parte inferior pero no en la parte superior, puede resolverlo fácilmente abriendo el archivo otf y haciendo clic en cualquier fuente en Android Studio:

ingrese la descripción de la imagen aquí

Como puede ver, el cursor en la parte inferior tiene un espacio adicional pero no en la parte superior, por lo que solucionó mi problema.

La segunda clave es que no puede simplemente omitir ninguno de los códigos , de lo contrario podría no funcionar. Esa es la razón por la que puede encontrar que algunas personas comentan que una respuesta está funcionando y otras comentan que no está funcionando.

Vamos a ilustrar lo que sucederá si elimino uno de ellos.

Sin setTypeface(mfont);:

ingrese la descripción de la imagen aquí

Sin setPadding(0, 0, 0, 0);:

ingrese la descripción de la imagen aquí

Sin setIncludeFontPadding(false);:

ingrese la descripción de la imagen aquí

Sin 3 de ellos (es decir, el original):

ingrese la descripción de la imagen aquí



3

XML actualizado

android:fontFamily="monospace"
android:includeFontPadding="false"

Hola, bienvenido a Stack Overflow! Cuando responda una pregunta, debe incluir algún tipo de explicación, como lo que hizo mal el autor y lo que hizo para solucionarlo. Te digo esto porque tu respuesta se ha marcado como de baja calidad y actualmente se está revisando. Puede editar su respuesta haciendo clic en el botón "Editar".
Federico Grandi

Cambio real de Android: fontFamily no es necesario si ya tiene la fuente correcta. Básicamente Android: includeFontPadding es lo único necesario y se ha mencionado en respuestas anteriores del hilo.
Darek Deoniziak

@DarekDeoniziak Algunas fuentes tienen espacios
SJJ

2

Método simple trabajado:

setSingleLine();
setIncludeFontPadding(false);

Si no funcionó, intente agregar esto arriba de ese código:

setLineSpacing(0f,0f);
// and set padding and margin to 0

Si necesita varias líneas, tal vez necesite calcular exactamente la altura del relleno superior e inferior a través de TextView de una sola línea temporal (antes y después de eliminar el relleno), luego aplique el resultado de disminución de altura con relleno negativo o algún diseño de fantasma con traslación Y. Jajaja


0

Puede intentar alinear la parte inferior de la vista de texto izquierda con la parte inferior de la segunda vista de texto derecha.


Pero entonces la línea superior no se alinearía. Y en realidad no me importa que se alineen tanto como me gustaría eliminar el espacio.
Bryan Field

0

Que yo sepa, esto es inherente a la mayoría de los widgets y la cantidad de "relleno" difiere entre los fabricantes de teléfonos. Este relleno es realmente un espacio en blanco entre el borde de la imagen y la imagen en el archivo de imagen de 9 parches.

Por ejemplo, en mi Droid X, los widgets giratorios obtienen un espacio en blanco adicional que los botones, lo que hace que se vea incómodo cuando tienes una rueda giratoria en línea con un botón, ¡pero en el teléfono de mi esposa la misma aplicación no tiene el mismo problema y se ve genial!

La única sugerencia que tendría es crear sus propios 9 archivos de parche y usarlos en su aplicación.

Ahhh los dolores que son Android.

Editado: Aclarar el relleno contra el espacio en blanco.


0

Este truco funcionó para mí (para min-sdk> = 18 ).

Solía android:includeFontPadding="false"y un margen negativo como android:layout_marginTop="-11dp"y puse TextViewdentro de una FrameLayout( o cualquier ViewGroup ... )

ingrese la descripción de la imagen aquí

y finalmente códigos de muestra:

<LinearLayout
    android:layout_width="60dp"
    android:layout_height="wrap_content"
    >

    <TextView
        style="@style/MyTextViews.Bold"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/yellow"
        android:textSize="48sp"
        android:layout_marginTop="-11dp"
        android:includeFontPadding="false"
        tools:text="1"/>
</LinearLayout>

1
Este truco puede no funcionar para diferentes fuentes, tamaños o diseños.
Adil Soomro

-1

Mira esto:

Alinear ImageView con EditText horizontalmente

Parece que la imagen de fondo de EditText tiene algunos píxeles transparentes que también agregan relleno.

Una solución es cambiar el fondo predeterminado de EditText a otra cosa (o nada, pero probablemente no sea aceptable un fondo para EditText). Eso se puede hacer configurando android: atributo XML de fondo.

android:background="@drawable/myEditBackground"


-5

Use esto en su ImageView xml

android: ajustarViewBounds = "verdadero"


Agregue alguna explicación al respecto
Nico Haase

Pensé que esto debe entenderse. Solo puedo ser usado en xml.
Anshul Rawat
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.