Android UI技巧（一）——Android中伸缩自如的9patch图片切法，没有美工自给自足

Android UI技巧（一）——Android中伸缩自如的点9图片切法，没有美工自给自足

---

相信大家对.9 图片应该都很熟悉吧，有些人可能自己都会了，此篇献给那些不会的同学，咱们一起来聊聊.9图片的切法

一.分辨率

其实相对于Android和IOS两大平台来讲，Android的适配问题一直是大家工作上的一个大问题，这里，我做了一个分辨率的对照表，大家先来连接一下这个简单的东西吧

当然，现在2K的屏幕都出来了，不过这个咱不管哈

二.点9切图法

上面了解了大致的分辨率，我们就来切图了，所谓的.9图就是无论你怎么拉伸，只要我们设置一个边宽，这部分就会保持不变形，应用范围也比较广泛，比如聊天起泡什么的

我们要想切.9图，就要用到你SDK目录下/tools/draw9patch.bat,对，没错，就是这个工具，我们打开它

这里我们可以点击左上角的File-OPen 9patch，然后打开一张图片制作，也可以直接把图片拖进去，这里，我们新建一个工程——NinePatch，来测验我们制作的成果，首先拖进去一张图片

然后我们就来切

我们仔细看就会看到一条黑线，这条黑线区域的内容是可以拉伸的，而其他位置的是不可拉伸的，既然如此，那我们放进APP看看效果，首先，来看一下原图是什么样子的

图片原本的分辨率是212X130的，我直接设置成

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center" >

    <Button
        android:background="@drawable/logo"
        android:layout_width="300dp"
        android:layout_height="300dp"
        />

</RelativeLayout>

那我们来看看.9图的表现吧

我们现在只是让他在很窄的地方拉伸，当然，点9图片还是要应用在一个合适的场合，我们看看他在真机上的表现吧

我们可以发现，上面那部分我设置成不可拉伸，他就是保持原样，但是我下边那部分，也就是黑边的部分，就没那么幸运了，那就一个惨不忍睹，这样，我们答题也有一个认知，我们针对某一个特定场合的图片使用.9可能会出奇效，但是如果你乱用的话可能适得其反，现在的话，你答题应该知道怎么去切一张.9图片了吧