android中.9图如何制作

在工作中我们需要做界面往往需要设计师给我们提供图标,我们才能把界面友好的显示出来,普通的图标用png、jpg等都可以显示出来,为了让界面更与众不同,设计师们通常会设计一些弯角、弯钩如果我们要作为背景使用的话就不能设置高度,以防里面包含的内容不能显示完整不美观,为了更好的适配这就让我们不得不另辟蹊径,我们不用设计师的切图,知道背景图的角度,就能自己画了,自己动手,丰衣足食,那么接下来就看一下什么叫.9图吧!

1. 什么是.9.png图片,和普通png图片的区别?

.9.png图片本质上还是png图片,区别是.9.png图比正常的png图片在最外围多了1px的边框,这就允许我们在这个1px的边框上定义图片的可拉伸区域以及图片的内容区域。这也就是说.9.png的制作实际上就是我们在这1px的边框上按我们的需求,把对应位置设置为黑线,然后系统帮我们自动拉伸了。

2. .9图四个边的黑线(黑点)的意义?

正常图片都有四个边,.9图的左上(左边和上边两条边)表示可以拉伸区域,其中上面黑线(或者点)表示横向可拉伸的区域;左边黑线(或者点)表示纵向可拉伸的区域.在图片拉伸时只有黑线区域内的图像会被拉伸,黑线两边的图像保持原状。

右下(右边和下边两条边)表示间隔区域,其中下边表示横向填放内容的区域;右边表示纵向填放内容的区域,在图片拉伸时,控件内部的文字上下左右边界只能放在黑线区域(有点类似垂直居中显示)。

3. 制作工具?

如果你还用eclipse开发,在你sdk中的tools文件夹找Draw9patch.bat文件,这是一个Windows 批处理文件,双击进入界面,拖入图片开始制作.
如果是studio直接以.9.png为后缀,双击编辑进入图片界面,选择左下角的9-patch即可开始制,或者图片右击在列表选则Create 9-Patch file即可。

4.演练一波

接下来以我正在做的背景图为例子


背景图里面的文字不是固定的,想让背景图根据文字的多少变化,就要使用.9图了

先说一下as底下黑色部分的介绍

1.首先我们要把图片下方的showbad patches勾选上,此时(如果点九图片绘制有误的话)会看到图片出现 报错的区域。
2.说明一下:图片下方的showcontent如果勾选上,会看到右侧的小图中出现蓝色的区域,代表的是可以自动 拉伸的部分。
3.如果发现你的点9图片太小或者极小,可以拖动图片下方的zoom放大图片,然后就可以精确操作了。

如上图 最左边黑色部分是编辑部分,右边白色部分是预览部分,

最左边分别对应横向和竖向拉伸区域

好了 这就轻松解决了问题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/417535.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【 Qt 快速上手】-①- Qt 背景介绍与发展前景

文章目录 1.1 什么是 Qt1.2 Qt 的发展史1.3 Qt 支持的平台1.4 Qt 版本1.5 Qt 的优点1.6 Qt的应用场景1.7 Qt的成功案例1.8 Qt的发展前景及就业分析行业发展方向就业方面的发展前景 1.1 什么是 Qt Qt 是一个跨平台的 C 图形用户界面应用程序框架。它为应用程序开发者提供了建立…

349. 两个数组的交集(力扣)(OJ题)

题目链接:349. 两个数组的交集 - 力扣(LeetCode) 个人博客主页:https://blog.csdn.net/2301_79293429?typeblog 专栏:https://blog.csdn.net/2301_79293429/category_12545690.html 给定两个数组 nums1 和 nums2 &a…

协议网关BL110轻松实现多种协议转MQTT、OPC UA,支持8种主流工业协议转换

随着工业4.0的迅猛发展,人们深刻认识到在工业生产和生活中,实时、可靠、安全的数据传输至关重要。而在工厂自动化领域,工业设备之间的联动控制离不开各种工业通信协议。在此背景下,高性能的工业自动化数据传输解决方案——协议转换…

mac查看maven版本报错:The JAVA_HOME environment variable is not defined correctly

终端输入mvn -version报错: The JAVA_HOME environment variable is not defined correctly, this environment variable is needed to run this program. Java环境变量的问题,打开bash_profile查看 open ~/.bash_profile export JAVA_8_HOME/Library/Java/JavaVirtualMachine…

心跳检测与服务剔除

社保中心的忧桑 今天社保中心来了一位钉子户,90多岁的王大爷又兴高采烈的来给自己快120岁的老父亲领社保了! 工作人员这一-想,好像哪里不对啊,这老父亲120岁的年纪都可以上吉尼斯世界纪录了,要不咱帮老爷子去申请一下?王大爷一听…

vue3-侦听器

侦听器 计算属性允许我们声明性地计算衍生值。 需求在状态变化时进行一些操作&#xff0c;比如更改 Dom,根据异步操作结果去修改另外的数据状态。 watch 监听异步请求结果 <script lang"ts" setup> import { ref, watch } from "vue"const ques…

开发实践8_REST

一、Django REST Framework, Django View & APIView MTV模式实现前后端分离。Representational State Transfer 表现层状态转化。Representation 资源&#xff08;Resource a specific info. on net.&#xff09;具体呈现形式。ST 修改服务端的数据。修改数据 POST请求。…

用VSCode玩STM32的烧录工具 CooCox Cortex Flash Programmer

一、下载软件 经热心兄弟推荐的版本&#xff0c;不知道有没有版权&#xff0c;如有版权问题&#xff0c;请通知删除。 CSDN - 0积分下载&#xff1a;https://download.csdn.net/download/qq_49053936/88744187 二、生成bin文件 插件不同&#xff0c;方法有所不同&#xff0c;各…

云轴科技ZStack位列IDC云系统软件市场教育行业TOP2

近日&#xff0c;全球IT市场研究和咨询公司IDC发布 《中国云系统软件市场跟踪报告2023H1》 ZStack作为产品化的云基础软件提供商 位居云系统软件市场第一梯队 市场份额位列独立云厂商*第一 增速最快 教育行业TOP2 在教育行业&#xff0c;云计算已成为教育行业信息化的重要基础…

C++PythonC# 三语言OpenCV从零开发(3):图像读取和显示

文章目录 相关链接前言Mat是什么读取图片CC#Python 灰度处理CCSharpPython 打印图像信息CCsharpPython 总结 相关链接 C&Python&Csharp in OpenCV 专栏 【2022B站最好的OpenCV课程推荐】OpenCV从入门到实战 全套课程&#xff08;附带课程课件资料课件笔记&#xff09; …

python使用jupyter记笔记

目录 一、安装 二、运行jupyter 三、使用 四、记笔记 Jupyter Notebook&#xff08;此前被称为 IPython notebook&#xff09;是一个交互式笔记本&#xff0c;支持运行 40 多种编程语言。 Jupyter Notebook 的本质是一个 Web 应用程序&#xff0c;便于创建和共享程序文档&a…

debian12.4配置

文章目录 debian12.4配置概述笔记将非root用户添加到sudo组更换国内源配置ssh的客户端访问END debian12.4配置 概述 在虚拟机中装了一个debian12.4, 想配置ssh客户端连接, 出了问题. 配置乱了, 还好长了个心眼, 做了快照. 发现2个问题: debian12.4默认安装完, 有ssh, 先检查…