android自定义首屏图
配置
首先点开manifest.json找到App启动页面配置,勾选自定义启动图。然后选择你的图片。
建议每个分辨率都设计一张.9.png图片。
图片自适应
android下在不同分辨率下,首图会不有同程度的拉伸,导致图片变形。android推出了一种.9.png(9patch)的图片用来处理这方面的困扰,可以自定义拉伸区域,保持图片显示区域正常。
制作9patch图片
下载android studio
下载地址,选择你需要的版本下载即可。
安装步骤跟着操作提示走就可以,基本上除了你需要选择自定义安装位置之外不用做其他特别处理。
开始制作
创建一个新项目,然后将你的图片放入 res/drawable/ 目录下。双击图片进行编辑
图片后缀必须要以.9.png格式,这样才能编辑。
图片需要有1px的透明白边才能进行描边绘制,切记切记,否则无法识别进行描边处理。鼠标左键在白边上按下并拖动即可画出黑色边,黑边的大小和位置决定你的图片以何种方式进行拉伸缩放。
四条边的含义
顶部:在水平拉伸的时候,保持其他位置不动,只在这个点的区域做无限的延伸(拷贝)
左边:在竖直拉伸的时候,保持其他位置不动,只在这个点的区域做无限的延伸(拷贝)
底部:在水平拉伸的时候,指定图片里的内容显示的区域
右边:在竖直拉伸的时候,指定图片里的内容显示的区域
在白色区域鼠标左侧点击拉伸后就会出现黑边,拖动黑边 就可设置区域。
设置后的黑边
控制栏说明
Zoom 调整绘图区域中图形的缩放级别
Patch scale 调整预览区域中图像的比例
Show lock 在鼠标悬停时可视化图形的不可绘制区域
Show content 突出显示预览图像中的内容区域(紫色是允许内容的区域)
Show patches 在绘图区域中预览可伸展的修补程序(粉红色是可伸缩的修补程序)
Show bad patches 在补丁区域周围添加红色边框,在拉伸时可能会在图形中产生伪影。如果消除所有不良补丁,将保持拉伸图像的视觉一致性。
一般只需要勾选 show patches 即可
绘制完毕
右侧是预览图,经过拉伸后依然保持中间核心区域完整显示 当你每次编辑时就已经在保存了,所以没有保存按钮。只需要打开文件夹就可看到修改后的图片,直接使用即可。
前后对比,可以清晰的看出黑边
注意事项
uniapp打包时,对.9.png图片有校验,如果你设置的图片不符合规则就会打包失败。需要重新设计黑边。 四条边都需要绘制。
绘制后的.9图片不要进行压缩和分辨率修改进行适配,打包编译可能会失败。