持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第9天，点击查看活动详情
Android中点9图的使用
前言
点九图是 Android 开发的必备知识了，把一个png图片转换拿为点9图之后，它的四周有一圈1px的边框，设置这些边框就可以定义图片中可扩展部分和不变的部分。
我发现很多同学都只会定义left和top的边框。不懂right和bottom的作用，这里我单独说下并截图详细说明不同的设置有哪些不同的效果。
如何定义
可以看到一张点9图如下：
定义不同的高度，我们看看拉伸的效果：
<FrameLayout
android:background="@drawable/item_white_shadow_bg"
android:layout_width="match_parent"
android:layout_height="50dp">
<TextView
android:background="@color/gray"
android:text="查看内部空间"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
<FrameLayout
android:background="@drawable/item_white_shadow_bg"
android:layout_width="match_parent"
android:layout_height="100dp">
<TextView
android:background="@color/gray"
android:text="查看内部空间"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
<FrameLayout
android:background="@drawable/item_white_shadow_bg"
android:layout_width="match_parent"
android:layout_height="200dp">
<TextView
android:background="@color/gray"
android:text="查看内部空间"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
复制代码效果：
可以看到背景的灰色，并没有铺满整个点9图背景，不是别的问题，是我们的自己的图有问题，因为我们的图有间距，外层有一些阴影。我们修改让它可以充满真个布局呢？
答案就是right和bottom，它们定义的是内容填充的范围，而我们最常用的left和top的边框只是定义可以可扩展拉伸的范围。我们修改点9图如下，再次使用看看效果：
可以看到上下左右的点9图都设置了，效果：
可以看到这样就能把内容沾满了，不管是什么样的点9图都可以这么设置。
再设置一个点9图如下：
效果如下：
到此大家就会了left和top的设置和right和bottom的设置效果了，另外一点这些线只是设置范围，并不是一定要连续的设置的。如下图气泡背景的点9图
如果不这么设置宽度就会变形了，那么right的高度大家可以看看 一个充满全部高度，一个是内容宽度高度，大家看效果图就能很明显的看出效果：
布局：
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:background="@drawable/popwindow_bg"
android:layout_width="150dp"
android:layout_height="65dp">
<TextView
android:textColor="@color/white"
android:gravity="center"
android:text="特殊的点9图设置1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
<FrameLayout
android:layout_marginLeft="@dimen/d_15dp"
android:background="@drawable/popwindow_bg2"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="65dp">
<TextView
android:textColor="@color/white"
android:gravity="center"
android:text="特殊的点9图设置2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
</LinearLayout>
复制代码可以看到文本都是同样的布局，居中展示的，效果如下：
总结
现在的设计师真的很喜欢圆角加阴影，搞这些效果真是令Android开发者头大，还好有点9能很方便的实现，常用的就是left和top的设置和right和bottom设置这些不同的效果，掌握了之后图片就任你操作了。
需要注意的是带有圆角的点9图制作之后可能出现圆角与效果图圆角不符合的问题，这里需要找对drawable中的倍数图片，不同的倍数图片做出的点9图圆角都是不一致的，如果还是不行，需要找设计师协商制作圆角的。
好了，点9图的使用还是很简单的额，如果有错漏或有疑问都可以在评论区指出。
觉得本文不错，还请点赞支持一下！
到此完结！