Android入门第63天-解决同一行里ImageView或者是组件和TextView不能置顶对齐

Posted 2023-02-19 TGITCIC

开篇

我们直奔主题。

在实际应用场景中，我们经常会碰到这样的情况，就是如下图这样的场景：

我们需要把这个文字和左边的图片“置顶对齐”。

但随便怎么样调，我们发觉我们的这个字不能和左边的图片置顶对齐。

我们使用了layout_gravity="top"，gravity，甚至网上一堆人还说改用relative layout。

结果很多新手调几天都搞不定一个对齐。

分析

其实这个问题已经简单了不能再简单了，这是因为TextView默认在文字四边留有“白边”，它有一个看不到的“壳”。

如果把这个“壳”去了就能对齐了。下面从代码上来看就明白了。

不能对齐的布局写法

   <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="150dp"
            android:layout_height="110dp"
            android:layout_gravity="top"
            android:scaleType="fitStart"
            android:src="@mipmap/nearby_store_1" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:gravity="top"
            android:orientation="vertical"
            android:padding="0dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:padding="0dp"
                android:text="叮叮宠物"
                android:textColor="@color/black"
                android:textSize="12dp"
                android:textStyle="bold" />

正确的置顶对齐的布局写法

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="150dp"
            android:layout_height="110dp"
            android:layout_gravity="top"
            android:scaleType="fitStart"
            android:src="@mipmap/nearby_store_1" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:gravity="top"
            android:orientation="vertical"
            android:padding="0dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:includeFontPadding="false"
                android:layout_marginLeft="5dp"
                android:padding="0dp"
                android:text="叮叮宠物"
                android:textColor="@color/black"
                android:textSize="12dp"
                android:textStyle="bold" />

 看，其实关键就在于一行android:includeFontPadding="false"。把这个“壳”给它去了，就对齐了。

自己不妨动一下手吧！

”