如何使TextView中的冒号垂直居中

Question

我有一个TextView显示时间，每秒更新一次。

我使用了DIN字体。我已经将TextView设置为垂直居中对齐。但是为什么冒号会对齐到基线？谁知道如何解决这个问题？

更新

               <TextView
                    android:id="@+id/time"
                    android:layout_width="wrap_content"
                    android:layout_height="48px"
                    android:layout_below="@id/temperature"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="-5px"
                    android:fontFamily="DIN"
                    android:gravity="center"
                    android:textColor="@color/white"
                    android:textSize="39px" />

- smallTong

---

取决于你的 XML。发布它。 - Nabin

请尝试检查此链接：http://stackoverflow.com/questions/22826411/how-do-i-align-text-view-to-be-in-center-vertically-of-two-numberpickers - Rahul Gopi

如果字体呈现“：”符号的方式是这样的，那么除非将其分成多个视图，否则你无法做太多事情。 - Karakuri

可能是重复的问题：如何在安卓中垂直居中文本 - Sufian

检查另一个冒号的字体--一些字体具有基线对齐的冒号和更垂直居中的冒号，因为每个冒号都适用于不同的目的。 - Matt Gibson

Answer 1

一个选择是将整个TextView分成5个不同的TextView，并对带有数字的TextView添加android:layout_marginTop="3px"。

- Phyrum Tea

Answer 2

这是字体默认渲染冒号字符的方式。除非为冒号创建单独的TextView，否则无法更改。或者您可以使用不同的字体，并检查其他字体是否实际上将冒号字符居中。使用以下内容执行此操作：

android:fontFamily="sans-serif"           // roboto regular
android:fontFamily="sans-serif-light"     // roboto light
android:fontFamily="sans-serif-condensed" // roboto condensed
android:fontFamily="sans-serif-thin"      // roboto thin (android 4.2)
android:fontFamily="sans-serif-medium"    // roboto medium (android 5.0)

为了更好地解释可以使用的字体，您可以查看官方文档。

希望这有所帮助 :)

- Michele La Ferla

Answer 3

由于冒号是一个非常简单的形状，您可以从小型元素构建它，如文本视图、图形基元或仅两个视图，以垂直线性布局。

例如，首先创建一个简单的点作为形状可绘制对象（位于drawable文件夹中的dot.xml）：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="oval">
    <solid android:color="#ccc"/>
</shape>

使用这个可绘制对象作为背景创建一个视图（在布局文件夹中的 clock_dot.xml 文件）：

<?xml version="1.0" encoding="utf-8"?>
<View xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="3sp"
    android:layout_height="3sp"
    android:background="@drawable/dot"
    android:layout_margin="3sp"
    android:layout_weight="0" />

将两个点堆叠在一起以创建冒号字符（在布局文件夹中的clock_colon.xml）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="vertical"
          android:layout_gravity="center_vertical"
          android:gravity="center_vertical"
          android:layout_width="wrap_content"
          android:layout_height="match_parent">
    <include layout="@layout/clock_dot"/>
    <include layout="@layout/clock_dot"/>
</LinearLayout>

创建一个带有两个数字的文本视图（clock_digits.xml）：

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="0"
    android:textColor="#ccc"
    android:textSize="24sp"
    android:text="12" />

然后从数字布局和冒号布局构建计时器布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="horizontal"
          android:gravity="center_vertical"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content">
    <include layout="@layout/clock_digits"/>
    <include layout="@layout/clock_colon"/>
    <include layout="@layout/clock_digits"/>
    <include layout="@layout/clock_colon"/>
    <include layout="@layout/clock_digits"/>
</LinearLayout>

你会得到类似这样的东西：

- x-code

---

最终我使用了另一种字体。但非常感谢你的帮助，你的建议也很有用。 - smallTong