Quantcast
Channel: CSDN博客移动开发推荐文章
Viewing all articles
Browse latest Browse all 5930

Android踩坑日记:Android字体属性及测量(FontMetrics)

$
0
0

Android字体属性及测量(FontMetrics)

  • 字体的几个参数,以Android API文档定义为尊,见下图

要点如下:

  1. 基准点是baseline
  2. Ascent是baseline之上至字符最高处的距离
  3. Descent是baseline之下至字符最低处的距离
  4. Leading文档说的很含糊,其实是上一行字符的descent到下一行的ascent之间的距离
  5. Top指的是指的是最高字符到baseline的值,即ascent的最大值
  6. bottom指的是最下字符到baseline的值,即descent的最大值
为了帮助理解,我特此搜索了不同的示意图。对照示意图,会很容易理解FontMetrics的参数。

图1

图2

图3

图4

图5

图6

  • 测试
    我们使用自定义的View和Textview里的字符串作为研究对象
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    android:orientation="vertical"
    >
    <!--PaintView画字体-->
   <video.ketu.com.fontmeasure.PaintView
       android:id="@+id/v_fontview"
       android:layout_width="match_parent"
       android:layout_height="1dp"
       android:layout_weight="1"
       />
   <!--Textview设置文字-->
   <TextView
       android:id="@+id/tv_fontview1"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:text="中国话fgiqÃÇŸŒú"
       android:textColor="@android:color/white"
       android:textSize="80px"
       android:layout_weight="1"/>
</LinearLayout>

MainActivity.class

public class MainActivity extends AppCompatActivity {
    TextView textView;
    View paintView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        paintView = findViewById(R.id.v_fontview);
        textView = (TextView) findViewById(R.id.tv_fontview1);
        //String text = "中国话fgiqÃÇŸŒúcqazweyghnhgd;lc,kjssnhjjomoomcod";
        String text = "中国话fgiqÃÇŸŒú";
        /*设置字体带下80px*/
        textView.setTextSize(TypedValue.COMPLEX_UNIT_PX,80);
        textView.setText(text);
        Paint.FontMetrics fontMetrics = textView.getPaint().getFontMetrics();
        Log.d("textView", "fontMetrics.top        is:" + fontMetrics.top);
        Log.d("textView", "fontMetrics.ascent     is:" + fontMetrics.ascent);
        Log.d("textView", "fontMetrics.descent    is:" + fontMetrics.descent);
        Log.d("textView", "fontMetrics.bottom     is:" + fontMetrics.bottom);
        Log.d("textView", "fontMetrics.leading    is:" + fontMetrics.leading);
    }
}

PaintView.class

public class PaintView extends View {
    private Paint mPaint = new Paint();
    public PaintView(Context context) {
        super(context);
    }
    public PaintView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    public PaintView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub
        mPaint.reset();
        mPaint.setColor(Color.WHITE);
        /*设置字体带下80px*/
        mPaint.setTextSize(80);
        //设置字体为斜体
        //mPaint.setTypeface(Typeface.create("", Typeface.ITALIC));
        // FontMetrics对象
        Paint.FontMetrics fontMetrics = mPaint.getFontMetrics();
        String text = "中国话fgiqÃÇŸŒú";
        // 计算每一个坐标
        float textWidth = mPaint.measureText(text);
        float baseX = 0;
        float baseY = 100;
        float topY = baseY + fontMetrics.top;
        float ascentY = baseY + fontMetrics.ascent;
        float descentY = baseY + fontMetrics.descent;
        float bottomY = baseY + fontMetrics.bottom;
        float leading = baseY + fontMetrics.leading;

        Log.d("paintview", "baseX    is:" + baseX);
        Log.d("paintview", "baseY    is:" + baseY);

        Log.d("paintview", "fontMetrics.top        is:" + fontMetrics.top);
        Log.d("paintview", "fontMetrics.ascent     is:" + fontMetrics.ascent);
        Log.d("paintview", "fontMetrics.descent    is:" + fontMetrics.descent);
        Log.d("paintview", "fontMetrics.bottom     is:" + fontMetrics.bottom);
        Log.d("paintview", "fontMetrics.leading    is:" + fontMetrics.leading);

        Log.d("paintview", "topY     is:" + topY);
        Log.d("paintview", "ascentY  is:" + ascentY);
        Log.d("paintview", "descentY is:" + descentY);
        Log.d("paintview", "bottomY  is:" + bottomY);

截面图


PaintView和TextView设置的字体大小都是80px,Log打印结果

PaintView结果

TextView结果


      Note 1:以上可见,字体属性类的FontMetrics类的top,ascent,descent,bottom,leading的值是正负数,是以基线baseline为0的相对值。当baseline是100时,各个参数的坐标就是正数。
所以对于文本框的文字的行高:fontMetrics.top-fontMetrics.bottom

      Note 2:以上的TextView的文本长度是单行,获得leading=0,那么如果TextView的文本是多行,并且设置行间距后,leading的变化

public class MainActivity extends AppCompatActivity {
    TextView textView;
    View paintView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        paintView = findViewById(R.id.v_fontview);
        textView = (TextView) findViewById(R.id.tv_fontview1);
        String text = "中国话fgiqÃÇŸŒúcqazweyghnhgd;lc,kjssnhjjomoomcod";
        //String text = "中国话fgiqÃÇŸŒú";
        /*设置字体带下80px*/
        textView.setTextSize(TypedValue.COMPLEX_UNIT_PX,80);
        textView.setText(text);

        Paint.FontMetrics fontMetrics = textView.getPaint().getFontMetrics();

        Log.d("textView", "fontMetrics.top        is:" + fontMetrics.top);
        Log.d("textView", "fontMetrics.ascent     is:" + fontMetrics.ascent);
        Log.d("textView", "fontMetrics.descent    is:" + fontMetrics.descent);
        Log.d("textView", "fontMetrics.bottom     is:" + fontMetrics.bottom);
        Log.d("textView", "fontMetrics.leading    is:" + fontMetrics.leading);
    }
<TextView
       android:id="@+id/tv_fontview1"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:text="中国话fgiqÃÇŸŒúcqazweyghnhgd;lc,kjssnhjjomoomcod"
       android:textColor="@android:color/white"
       android:lineSpacingExtra="5px"
       android:textSize="80px"
       android:layout_weight="1"/>


截面图

结果Log

Note:显然,即使是多行,并且设置5px行距的情况下,仍不能获得leading。

作者:tuke_tuke 发表于2017/9/20 14:17:45 原文链接
阅读:10 评论:0 查看评论

Viewing all articles
Browse latest Browse all 5930

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>