如何制作9.png图片

article/2025/9/14 19:05:47
什么是9.png图片:

.9.PNG是安卓开发里面的一种特殊的图片,这种格式的图片通过ADT自带的编辑工具生成,使用九宫格切分的方法,使图片支持在android 环境下的自适应展示。

9.png图片如何优势:

(1)允许开发人员定义可扩展区域,当需要延伸图片以填充比图片本身更大区域时,可扩展区的内容被延展。
(2)允许开发人员定义内容显示区,用于显示文字或其他内容

效果展现,没制作前和制作后效果:

制作流程

1.给大家介绍一个网站:

阿里巴巴适量图标库链接
注册后,你就可以搜索你想要安卓图标,你输入气泡,就可以查到我将要使用的图片

2.将图片命名为message_left,并复制到mipmap中
3.右击图片,点击Create 9-patch file,初步完成9.png图片,双击message_left.9.png图片,就可以进入这个界面

这里写图片描述

4.制作阶段:

图片的四个边框(最外面的正方形)分别表示不同的意思
上边框黑线:图片拉伸时图片上下拉升的区域
左边框黑线:图片拉升时图片左右拉升的区域
右边框下边框黑线:文字显示的区域
鼠标键可以直接绘制黑线
按住shift+鼠标可以撤销你的操作
这里写图片描述
最后ctrl+s保存

5.不过这样还是不行的,我们需要将9.png图片保存到drawable文件夹下,之前使用Android模式的项目结构,直接将图片剪切到drawable文件夹下,结果报错,后来发现drawable文件夹有两个,默认会把你放到drawable-v24文件夹下,这样应用图片时就会报错,所以应该选用Project模式的项目结构,把图片剪切过来

这里写图片描述

5.最后在布局中引用图片就可以看到他们的差别了:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"tools:context="com.example.uibestpractice.MainActivity"><LinearLayout
        android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@mipmap/message_left"></LinearLayout><LinearLayout
        android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@drawable/message_left"></LinearLayout></LinearLayout>
over

http://chatgpt.dhexx.cn/article/vJDHZg9d.shtml

相关文章

9.png图片的处理

1. PNG格式。 在这里不过多的讨论PNG格式的定义问题。但是.9.PNG确实是标准的PNG格式&#xff0c;只是在最外面一圈额外增加1px的边框&#xff0c;这个1px的边框就是用来定义图片中可扩展的和静态不变的区域。特别说明&#xff0c;left和top边框中交叉部分是可拉伸部分&#xf…

如何在线压缩png图片?png压缩图片大小的方法介绍

压缩PNG图片大小的优点 随着数字化时代的发展&#xff0c;PNG格式已成为一种常见的图片格式。然而&#xff0c;由于高分辨率、高色深等原因&#xff0c;PNG图片通常具有较大的文件体积&#xff0c;导致在传输、存储和网页加载等方面会产生不必要的负担。因此&#xff0c;对于需…

InternImage

终于有对抗Transformer 的了~~ 来自浦江实验室、清华等机构的研究人员提出了一种新的基于卷积的基础模型&#xff0c;称为 InternImage&#xff0c;与基于 Transformer 的网络不同&#xff0c;InternImage 以可变形卷积作为核心算子&#xff0c;使模型不仅具有检测和分割等下游…

图片<img>

图像标签演示源代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>图像标签</title> </…

拉伸图片的两种方法

在开发时&#xff0c;常常会遇到一个图片作为控件的image显示时&#xff0c;图片太小&#xff0c;此时图片被拉伸后,图片四周显示的并不是我们想要的结果&#xff0c;此时我们就需要对图片进行拉伸操作&#xff0c;有两种方法可以去拉伸图片&#xff0c; 一种是进入资产文件夹中…

css控制图片拉伸不变形,css+background实现 图片宽高自适应,拉伸裁剪不变形

图片宽高不固定 &#xff0c;一样实现自适应&#xff0c;拉伸裁剪不变形&#xff0c;适应各大兼容性。 下面咱们在网上找两张宽高不一样的照片&#xff1a; No.1 No.2 从上图看一个宽的一个窄的&#xff0c;很难做到自适应&#…

html背景图片 纵向拉伸,背景图片拉伸(CSS方法)_html/css_WEB-ITnose

在布局现在的网站首页的时候&#xff0c;发现一个问题。我使用了一张1440*900的png图片作为背景图片。页面内的Div使用了较多的百分比自适应框体大小&#xff0c;原body元素的CSS如下 html { width: 100%; height: 100%;}body { background: url(../img/bg.png) no-repeat; mar…

ios图片局部拉伸

转载自http://justsee.iteye.com/blog/1973358 下面张图片&#xff0c;本来是设计来做按钮背景的&#xff1a; button.png&#xff0c;尺寸为&#xff1a;24x60 现在我们把它用作为按钮背景&#xff0c;按钮尺寸是150x50&#xff1a; C代码 // 得到view的尺寸 CGSize viewS…

Qt部分拉伸的背景图片

目录 引言代码实现 引言 QSS是Qt客户端开发中非常重要的一环&#xff0c;也是非常容易被忽略的一环。因为网上有太多的博文直接给出了相对美观的样式&#xff0c;导致多数人只是将样式表拷贝使用&#xff0c;而没有细究其中的语法。这也是我在面试时分辨Qt界面开发经验的重要标…

android 九宫格 拉伸,CAScale9ImageView(九宫格图片拉伸)

类说明 CAScale9ImageView是CrossApp提供的一种九宫格拉伸图片的解决方案,我们先来了解一下什么是九宫格图片拉伸。 在App的设计过程中,为了适配不同的手机分辨率,图片大小需要拉伸或者压缩,这样就出现了可以任意调整大小的拉伸样式。 CAScale9ImageView 属性(点击方法名可…

Android自适应拉伸图片

这篇文章是android开发人员的必备知识&#xff0c;内容摘选自网络&#xff0c;友我为大家整理和总结&#xff0c;不求完美&#xff0c;但是有用。 视频教程地址&#xff1a;http://player.youku.com/player.php/sid/XMTMwODc3Njc2/v.swf 1.背景自适应且不失真问题的存在 制作自…

android 图片自动拉伸,解决关于ImageView自适应的问题(拉伸变形,图片模糊)

今天接手一个项目发现有个地方的图片显示非常小&#xff0c;而且还不够清晰&#xff0c;也没办法自适应屏幕的显示&#xff0c;非常的影响美观&#xff0c;于是 就像这优化一下。 先看看优化前的效果和优化后的效果。 修复后 修复前 布局文件修复前&#xff1a; 修复前 布局文件…

html背景图片纵向拉伸,html网页背景图片拉伸 关于html背景图片往下拉伸问题

html 如何让背景图片充满全图&#xff0c;就是拉伸 html语言背景图片拉伸代码&#xff1a;background-size:cover&#xff0c;可以使图片拉伸铺满背景。 拓展资料 背景 (background) 属性定义元素的背景效果 元素的背景区包括前景之下直到边框边界的所有空间。因此&#xff0c;…

android 拉伸图片

Android拉伸图片用的是9.png格式的图片&#xff0c;这种图片可以指定图片的那一部分拉伸&#xff0c;那一部分显示内容&#xff0c;美工给的小图片也能有很好的显示效果。 原背景图片 可以看到原背景图片很小&#xff0c;即使在再长的文字&#xff0c;背景图片的圆角也不会拉伸…

html js 修改img 图片不拉伸,防止图片拉伸的自适应处理

在web开发中,作为前端经常会遇到处理图片拉伸问题的情况。 例如banner、图文列表、头像等所有和用户或客户自主操作图片上传的地方, 而一旦牵扯图片,就会涉及到图片拉伸的问题, 当然,在图片上传时做手动裁切,让用户或客户清晰的感知到图片的有效内容才是最优的解决方案,…

html平铺 拉伸 图片,[CSS]背景图片中平铺与拉伸

在某业务场景下,需要支持背景图的平铺和拉伸,那么在CSS中的这俩属性表现有何区分关系到是否符合业务表现,因此有必要清晰知道其差别。 原本以为只有自己会遇到,没想到群里有小伙伴也问到了。 0x00 background-size 在CSS中有background-size属性,平铺与拉伸可以通过下面两…

html 如何完美的显示图片,不拉伸图片,完整显示等等。

效果图&#xff1a; 代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document<…

html插入背景图片如何拉伸,css怎样拉伸背景图片?

在css中可以使用background-size属性来拉伸背景图片。background-size属性规定背景图像的尺寸&#xff0c;此属性可以使用数值、百分比、cover等设置图片拉伸。 background-size属性规定背景图像的尺寸。 语法&#xff1a;background-size: length|percentage|cover|contain; 属…

html如何拉伸一个图片,css怎么拉伸图片?

css可以使用background-size属性设置图片拉伸&#xff0c;background-size属性规定背景图像的尺寸。此属性可以使用数值、百分比、cover等设置图片拉伸。 background-size属性规定背景图像的尺寸。 background-size属性介绍&#xff1a; 语法&#xff1a;background-size: leng…