基线（Baseline）的含义以及在Android中的使用

基线的含义  

 首先说一下基线的含义（具体参考：http://zh.wikipedia.org/wiki/%E5%9F%BA%E7%B7%9A）：

        字体排印学中，基线（英语：Baseline）指的是多数字母排列的基准线。如下图所示，大多字母都沿着红色基线排列，唯有“p”向下延伸超过基线，超过的部分称为降部。

原则上，多数字体会有以下关于基线的准则：

• 大写字母位于基线上。最常见的例外是J和Q。
• 不齐线数字（见阿拉伯数字）位于基线上。
• 以下不齐线数字有降部：3 4 5 7 9。
• 以下小写字母有降部：g j p q y。
• 有着圆形上下区段的字符，如（0 3 6 8 c C G J o O Q），它们比基线略微有所下沉（overshoot）来造成了一种它们坐落于基线以上的光学幻觉，通过比X字高或大写高度略高来制造它们和flat glyphs如（H x X 1 5 7）同样高度的错觉。Peter Karowand的Digital Typefaces中建议，标准的overshoot应当在1.5%左右。

段落中连续行的基线间的垂直距离也被称为行高或Leading（行距），尽管后者也可指基线距离减去字体大小的值。

东亚字体没有基线，每个字符坐落在一个方形盒子中，既无升部也无降部。当它与具有低基线的字体混合使用时，东亚字符应当被调整，使其字符底部在低基线字体的基线和降部高度之间。

   上面的解释看出，原则上汉字是没有基线的，只有字框和字框中心。
但大陆与日本的横排标点都居左下，于是实际上可以分析出一条「汉字基线」：像西文字母坐在基线上一样，汉字和标点符号也都坐在汉字基线上。汉字基线比汉字字面的下边缘要高。

Android中关于基线的属性

1、 android:layout_alignBaseline：
       相对布局（RalativeLayout）中使用，设置当前组件与参照组件的基线对齐，该属性为参照组件的ID。
       如果作为基线的控件的内容为多行，则以第一行作为基线。
       可以参考一篇博文写的例子：http://www.cnblogs.com/loulijun/archive/2012/10/17/2727580.html

2、android:baselineAligned：
      线性布局（LinearLayout）中使用，设置是否允许用户调整它内容的基线。默认为ture，即LinearLayout中的控件的内容是基线对齐的。
     可以参考一篇博文写的例子：http://xiaxveliang.blog.163.com/blog/static/2970803420139126302496/

3、android:baselineAlignedChildIndex：
      线性布局（LinearLayout）中使用，设置LinearLayout中第几个（从0开始计数）子组件作为基线对齐的控件，来和LinearLayout外的基线对齐。
       我们以Android官方的APIDemos中的例子（Views--Layouts--Baseline--Nested Example 1）看一下该属性，布局代码为：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="3dip"
        android:layout_gravity="center_vertical"
        android:text="@string/baseline_nested_1_label" />

    <!-- We want the middle textview of this vertical linear layout to
      be baseline aligned with the others.-->
    <LinearLayout
            android:orientation="vertical"
            android:baselineAlignedChildIndex="1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/arrow_up_float"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dip"
            android:text="@string/baseline_nested_1_label" />
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/arrow_down_float"/>
    </LinearLayout>


    <!-- We'll point to the linear layout to baseline align by, which
      in turn will point to a text view inside of it -->
    <LinearLayout
        android:orientation="vertical"
                android:baselineAlignedChildIndex="1"
                android:layout_width="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_height="wrap_content">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/arrow_up_float"/>
        <LinearLayout
                android:orientation="vertical"
                android:baselineAlignedChildIndex="2"
                android:layout_width="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_height="wrap_content">
            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/arrow_up_float"/>
            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/arrow_up_float"/>
            <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="5dip"
                    android:text="@string/baseline_nested_1_label"/>
        </LinearLayout>
    </LinearLayout>


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:layout_gravity="center_vertical"
        android:text="@string/baseline_nested_1_label" />


</LinearLayout>

运行结果：

关于Baseline的属性，可以看一下Android官方的APIDemos中的例子（Views--Layouts--Baseline），里面举了9个例子，可以看一下效果，帮助理解关于Baseline的这些属性。

参考：http://zh.wikipedia.org/wiki/%E5%9F%BA%E7%B7%9A

http://www.zhihu.com/question/22183501/answer/20585814