When I have a TextView
with a \n
in the text,, on the right I have two singleLine
TextView
s, one below the other with no spacing in between. I have set the following for all three TextView
s.
当文本中有一个带\n的TextView时,在右边有两个单行文本视图,一个在另一个下面,中间没有间隔。我为所有三个textview设置了以下内容。
android:lineSpacingMultiplier="1" android:lineSpacingExtra="0pt" android:paddingTop="0pt" android:paddingBottom="0pt"
The first line of the left TextView
lines up perfectly with the top right TextView
. The second line of the left TextView
is a little higher than the second line of the bottom right TextView
.
左侧TextView的第一行与右上角TextView完全一致。左TextView的第二行比右下角的第二行稍高一些。
It seems that there is some kind of hidden padding on the top and the bottom of the TextView
s. How can I remove that?
似乎在textview的顶部和底部都有某种隐藏的填充。我该如何删除它呢?
12 个解决方案
#1
367
setIncludeFontPadding (boolean includepad)
or in XML
this would be:
或者用XML表示
android:includeFontPadding="false"
Set whether the TextView
includes extra top and bottom padding to make room for accents that go above the normal ascent and descent. The default is true.
设置TextView是否包含额外的顶部和底部填充,为高于正常上升和下降的口音留出空间。默认是正确的。
#2
32
I feel your pain. I've tried every answer above, including the setIncludeFontPadding
to false, which did nothing for me.
我觉得你的痛苦。我尝试过上面的每一个答案,包括setdefontpadding为false,这对我来说毫无用处。
My solution? layout_marginBottom="-3dp"
on the TextView
gives you a solution for the bottom, BAM!
我的解决方案吗?TextView上的layout_marginBottom="-3dp"为底部提供了解决方案,BAM!
Although, -3dp on layout_marginTop
fails....ugh.
尽管如此,3 dp layout_marginTop失败....啊。
#3
17
I searched a lot for proper answer but no where I could find an Answer which could exactly remove all the padding from the TextView
, but finally after going through the official doc got a work around for Single Line Texts
我找了很多合适的答案,但是找不到一个可以从TextView中删除所有空格的答案,但是在经过官方文档之后,我终于找到了一个关于单行文本的工作
android:includeFontPadding="false"
android:lineSpacingExtra="0dp"
Adding these two lines to TextView
xml will do the work.
First attribute removes the padding reserved for accents and second attribute removes the spacing reserved to maintain proper space between two lines of text.
将这两行代码添加到TextView xml中就可以了。第一个属性删除为重音保留的填充,第二个属性删除为在两行文本之间保持适当空间保留的间隔。
Make sure not to add
lineSpacingExtra="0dp"
in multiline TextView as it might make the appearance clumsy确保不要在多行TextView中添加lineSpacingExtra="0dp",因为它可能会使外观显得笨拙
#4
6
This annoyed me too, and the answer I found was that there is actually additional space in the font itself, not the TextView. It is rather irritating, coming from a document publishing background, the limited amount of control you have with Android over typographic elements. I'd recommend using a custom typeface (such as Bitstream Vera Sans, which is licensed for redistribution) that may not have this issue. I'm not sure specifically whether or not it does, though.
这也让我很恼火,我发现字体本身实际上有额外的空间,而不是TextView。这是相当令人恼火的,来自于文档发布背景,Android对排版元素的控制是有限的。我建议使用自定义字体(如Bitstream Vera Sans,它被授权进行再分配),可能没有这个问题。但我不确定它是否确实如此。
#5
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>
With an extra ImageView we can set the TextView to be baseline aligned with the ImageView and set the android:baselineAlignBottom
on the ImageView to true, which will make the baseline of ImageView to bottom. Other views can align itself using the bottom of the ImageView which itself is the same as the TextView's baseline.
通过一个额外的ImageView,我们可以将TextView设置为与ImageView对齐的基线,并将ImageView上的android:baselineAlignBottom设置为true,这将使ImageView的基线降到底部。其他视图可以使用ImageView的底部进行对齐,它本身与TextView的基线相同。
This however only fixes the padding bottom not the top.
但是,这只修复底部而不是顶部的填充。
#6
3
I think this problem can be solved in this way:
我认为这个问题可以这样解决:
<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" />
Those are the results:
这些结果:
ScreenShot-1
ScreenShot-3
Though the line of special characters in rightLowerText looks a little bit higher than the second line of leftText, their baselines are stilled aligned.
虽然右小写字体中的特殊字符行看起来比leftText的第二行稍高一些,但它们的基线仍然保持对齐。
#7
3
I remove the spacing in my custom view -- NoPaddingTextView.
我移除自定义视图中的空格——NoPaddingTextView。
https://github.com/SenhLinsh/NoPaddingTextView
https://github.com/SenhLinsh/NoPaddingTextView
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;
}
}
#8
1
Since my requirement is override the existing textView get from findViewById(getResources().getIdentifier("xxx", "id", "android"));
, so I can't simply try onDraw()
of other answer.
因为我的要求是覆盖findViewById(getResources()中的现有textView get。getIdentifier(“xxx”,“id”,“android”)),所以我不能简单地尝试其他答案。
But I just figure out the correct steps to fixed my problem, here is the final result from Layout Inspector:
但是我只是找到了正确的步骤来解决我的问题,这是布局检查器的最终结果:
Since what I wanted is merely remove the top spaces, so I don't have to choose other font to remove bottom spaces.
因为我想要的只是删除顶部的空格,所以我不需要选择其他字体来删除底部的空格。
Here is the critical code to fixed it:
下面是修复它的关键代码:
Typeface mfont = Typeface.createFromAsset(getResources().getAssets(), "fonts/myCustomFont.otf");
myTextView.setTypeface(mfont);
myTextView.setPadding(0, 0, 0, 0);
myTextView.setIncludeFontPadding(false);
The first key is set custom font "fonts/myCustomFont.otf" which has the space on bottom but not on the top, you can easily figure out this by open otf file and click any font in android Studio:
第一个键是设置自定义字体“字体/myCustomFont。otf“底部有空格,顶部没有空格,打开otf文件,点击android Studio中的任意字体,你就可以轻松搞定:
As you can see, the cursor on the bottom has extra spacing but not on the top, so it fixed my problem.
正如您所看到的,底部的光标有额外的间距,但不是顶部,所以它解决了我的问题。
The second key is you can't simply skip any of the code, otherwise it might not works. That's the reason you can found some people comment that an answer is working and some other people comment that it's not working.
第二个关键是您不能简单地跳过任何代码,否则它可能无法工作。这就是为什么你会发现有些人会说答案是有效的,有些人会说答案是无效的。
Let's illustrated what will happen if I remove one of them.
让我们举例说明如果我移除其中一个会发生什么。
Without setTypeface(mfont);
:
没有setTypeface(mfont);:
Without setPadding(0, 0, 0, 0);
:
没有setPadding(0,0,0,0,0,0);
Without setIncludeFontPadding(false);
:
没有setIncludeFontPadding(假),:
Without 3 of them (i.e. the original):
没有三个(即原始的):
#9
0
You might want to try aligning the bottom of the left text view with the bottom of the 2nd right text view.
您可能想尝试将左侧文本视图的底部与第二个右文本视图的底部对齐。
#10
0
To my knowledge this is inherent to most widgets and the amount of "padding" differs among phone manufacturers. This padding is really white space between the image border and the image in the 9 patch image file.
据我所知,这是大多数小部件所固有的,手机制造商之间的“填充”量是不同的。这种填充实际上是图像边界和9个补丁图像文件中的图像之间的空白。
For example on my Droid X, spinner widgets get extra white space than buttons, which makes it look awkward when you have a spinner inline with a button, yet on my wife's phone the same application doesn't have the same problem and looks great!
例如,在我的Droid X上,spinner小部件比按钮有更多的空白,这使得当你有一个带有一个按钮的spinner时看起来很尴尬,但是在我妻子的手机上同一个应用程序没有同样的问题,看起来很好!
The only suggestion I would have is to create your own 9 patch files and use them in your application.
我唯一的建议是创建您自己的9个补丁文件并在您的应用程序中使用它们。
Ahhh the pains that are Android.
啊,安卓的痛苦。
Edited: Clarify padding vs white space.
编辑:澄清填充与空白。
#11
0
See this:
看到这个:
Align ImageView with EditText horizontally
将ImageView与EditText水平对齐
It seems that the background image of EditText has some transparent pixels which also add padding.
EditText的背景图像似乎有一些透明的像素,也添加了填充。
A solution is to change the default background of EditText to something else (or nothing, but no background for a EditText is probably not acceptable). That's can be made setting android:background XML attribute.
解决方案是将EditText的默认背景更改为其他内容(或者什么都不做,但是EditText的任何背景都可能是不可接受的)。可以设置android:background XML属性。
android:background="@drawable/myEditBackground"
#12
0
Simply use
简单地使用
android:padding="0dp"
#1
367
setIncludeFontPadding (boolean includepad)
or in XML
this would be:
或者用XML表示
android:includeFontPadding="false"
Set whether the TextView
includes extra top and bottom padding to make room for accents that go above the normal ascent and descent. The default is true.
设置TextView是否包含额外的顶部和底部填充,为高于正常上升和下降的口音留出空间。默认是正确的。
#2
32
I feel your pain. I've tried every answer above, including the setIncludeFontPadding
to false, which did nothing for me.
我觉得你的痛苦。我尝试过上面的每一个答案,包括setdefontpadding为false,这对我来说毫无用处。
My solution? layout_marginBottom="-3dp"
on the TextView
gives you a solution for the bottom, BAM!
我的解决方案吗?TextView上的layout_marginBottom="-3dp"为底部提供了解决方案,BAM!
Although, -3dp on layout_marginTop
fails....ugh.
尽管如此,3 dp layout_marginTop失败....啊。
#3
17
I searched a lot for proper answer but no where I could find an Answer which could exactly remove all the padding from the TextView
, but finally after going through the official doc got a work around for Single Line Texts
我找了很多合适的答案,但是找不到一个可以从TextView中删除所有空格的答案,但是在经过官方文档之后,我终于找到了一个关于单行文本的工作
android:includeFontPadding="false"
android:lineSpacingExtra="0dp"
Adding these two lines to TextView
xml will do the work.
First attribute removes the padding reserved for accents and second attribute removes the spacing reserved to maintain proper space between two lines of text.
将这两行代码添加到TextView xml中就可以了。第一个属性删除为重音保留的填充,第二个属性删除为在两行文本之间保持适当空间保留的间隔。
Make sure not to add
lineSpacingExtra="0dp"
in multiline TextView as it might make the appearance clumsy确保不要在多行TextView中添加lineSpacingExtra="0dp",因为它可能会使外观显得笨拙
#4
6
This annoyed me too, and the answer I found was that there is actually additional space in the font itself, not the TextView. It is rather irritating, coming from a document publishing background, the limited amount of control you have with Android over typographic elements. I'd recommend using a custom typeface (such as Bitstream Vera Sans, which is licensed for redistribution) that may not have this issue. I'm not sure specifically whether or not it does, though.
这也让我很恼火,我发现字体本身实际上有额外的空间,而不是TextView。这是相当令人恼火的,来自于文档发布背景,Android对排版元素的控制是有限的。我建议使用自定义字体(如Bitstream Vera Sans,它被授权进行再分配),可能没有这个问题。但我不确定它是否确实如此。
#5
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>
With an extra ImageView we can set the TextView to be baseline aligned with the ImageView and set the android:baselineAlignBottom
on the ImageView to true, which will make the baseline of ImageView to bottom. Other views can align itself using the bottom of the ImageView which itself is the same as the TextView's baseline.
通过一个额外的ImageView,我们可以将TextView设置为与ImageView对齐的基线,并将ImageView上的android:baselineAlignBottom设置为true,这将使ImageView的基线降到底部。其他视图可以使用ImageView的底部进行对齐,它本身与TextView的基线相同。
This however only fixes the padding bottom not the top.
但是,这只修复底部而不是顶部的填充。
#6
3
I think this problem can be solved in this way:
我认为这个问题可以这样解决:
<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" />
Those are the results:
这些结果:
ScreenShot-1
ScreenShot-3
Though the line of special characters in rightLowerText looks a little bit higher than the second line of leftText, their baselines are stilled aligned.
虽然右小写字体中的特殊字符行看起来比leftText的第二行稍高一些,但它们的基线仍然保持对齐。
#7
3
I remove the spacing in my custom view -- NoPaddingTextView.
我移除自定义视图中的空格——NoPaddingTextView。
https://github.com/SenhLinsh/NoPaddingTextView
https://github.com/SenhLinsh/NoPaddingTextView
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;
}
}
#8
1
Since my requirement is override the existing textView get from findViewById(getResources().getIdentifier("xxx", "id", "android"));
, so I can't simply try onDraw()
of other answer.
因为我的要求是覆盖findViewById(getResources()中的现有textView get。getIdentifier(“xxx”,“id”,“android”)),所以我不能简单地尝试其他答案。
But I just figure out the correct steps to fixed my problem, here is the final result from Layout Inspector:
但是我只是找到了正确的步骤来解决我的问题,这是布局检查器的最终结果:
Since what I wanted is merely remove the top spaces, so I don't have to choose other font to remove bottom spaces.
因为我想要的只是删除顶部的空格,所以我不需要选择其他字体来删除底部的空格。
Here is the critical code to fixed it:
下面是修复它的关键代码:
Typeface mfont = Typeface.createFromAsset(getResources().getAssets(), "fonts/myCustomFont.otf");
myTextView.setTypeface(mfont);
myTextView.setPadding(0, 0, 0, 0);
myTextView.setIncludeFontPadding(false);
The first key is set custom font "fonts/myCustomFont.otf" which has the space on bottom but not on the top, you can easily figure out this by open otf file and click any font in android Studio:
第一个键是设置自定义字体“字体/myCustomFont。otf“底部有空格,顶部没有空格,打开otf文件,点击android Studio中的任意字体,你就可以轻松搞定:
As you can see, the cursor on the bottom has extra spacing but not on the top, so it fixed my problem.
正如您所看到的,底部的光标有额外的间距,但不是顶部,所以它解决了我的问题。
The second key is you can't simply skip any of the code, otherwise it might not works. That's the reason you can found some people comment that an answer is working and some other people comment that it's not working.
第二个关键是您不能简单地跳过任何代码,否则它可能无法工作。这就是为什么你会发现有些人会说答案是有效的,有些人会说答案是无效的。
Let's illustrated what will happen if I remove one of them.
让我们举例说明如果我移除其中一个会发生什么。
Without setTypeface(mfont);
:
没有setTypeface(mfont);:
Without setPadding(0, 0, 0, 0);
:
没有setPadding(0,0,0,0,0,0);
Without setIncludeFontPadding(false);
:
没有setIncludeFontPadding(假),:
Without 3 of them (i.e. the original):
没有三个(即原始的):
#9
0
You might want to try aligning the bottom of the left text view with the bottom of the 2nd right text view.
您可能想尝试将左侧文本视图的底部与第二个右文本视图的底部对齐。
#10
0
To my knowledge this is inherent to most widgets and the amount of "padding" differs among phone manufacturers. This padding is really white space between the image border and the image in the 9 patch image file.
据我所知,这是大多数小部件所固有的,手机制造商之间的“填充”量是不同的。这种填充实际上是图像边界和9个补丁图像文件中的图像之间的空白。
For example on my Droid X, spinner widgets get extra white space than buttons, which makes it look awkward when you have a spinner inline with a button, yet on my wife's phone the same application doesn't have the same problem and looks great!
例如,在我的Droid X上,spinner小部件比按钮有更多的空白,这使得当你有一个带有一个按钮的spinner时看起来很尴尬,但是在我妻子的手机上同一个应用程序没有同样的问题,看起来很好!
The only suggestion I would have is to create your own 9 patch files and use them in your application.
我唯一的建议是创建您自己的9个补丁文件并在您的应用程序中使用它们。
Ahhh the pains that are Android.
啊,安卓的痛苦。
Edited: Clarify padding vs white space.
编辑:澄清填充与空白。
#11
0
See this:
看到这个:
Align ImageView with EditText horizontally
将ImageView与EditText水平对齐
It seems that the background image of EditText has some transparent pixels which also add padding.
EditText的背景图像似乎有一些透明的像素,也添加了填充。
A solution is to change the default background of EditText to something else (or nothing, but no background for a EditText is probably not acceptable). That's can be made setting android:background XML attribute.
解决方案是将EditText的默认背景更改为其他内容(或者什么都不做,但是EditText的任何背景都可能是不可接受的)。可以设置android:background XML属性。
android:background="@drawable/myEditBackground"
#12
0
Simply use
简单地使用
android:padding="0dp"