egret纹理填充模式(上下填充)

简介: egret纹理填充模式(上下填充)
推荐阅读:

首先,我们准备两张图片,一张作为背景“瓶子”,一张作位填充物“饮料”。
在这里插入图片描述
在皮肤里我们设置右边图片的填充模式为“repeat”,修改Y的缩放为:-1。,调整图片位置使之与地图重合,如下:
在这里插入图片描述
现在,我们可以通过修改填充图片的高度来增加或减少填充物,代码如下:

//更新聊天界面好感度
let heartNum=50;//数字
//假设填充物的计算方法为:heartNum*0.75+25
if (heartNum < 100) {
this.goodImg.height = heartNum * 0.75 + 25;
}

需要特别说明的是。填充图片须为正常方向旋转180度后的图片。
如下:

       ![在这里插入图片描述](https://ucc.alicdn.com/images/user-upload-01/img_convert/874e10f9145ff33ff4f206bc7876a596.png)&emsp; &emsp; ![在这里插入图片描述](https://ucc.alicdn.com/images/user-upload-01/img_convert/7cd235a13af27263cfcec18fe04b2433.png)                 
    &emsp; 正常                                       &emsp; &emsp; &emsp; &emsp;  旋转180度后

效果如下:
在这里插入图片描述

相关文章
|
3月前
|
监控 API 计算机视觉
OpenCV这么简单为啥不学——1.4、基础标识绘制(绘制线line函数、rectangle函数绘制四边形、circle函数绘制圆形、putText函数绘制文字、putText绘制中文文字)
OpenCV这么简单为啥不学——1.4、基础标识绘制(绘制线line函数、rectangle函数绘制四边形、circle函数绘制圆形、putText函数绘制文字、putText绘制中文文字)
32 0
|
8月前
|
C#
C# GDI+绘图(四)实现网格绘制,并填充相应的表格内容
C# GDI+绘图(四)实现网格绘制,并填充相应的表格内容
126.设置填充类型和填充颜色
126.设置填充类型和填充颜色
62 0
|
缓存 索引
OpenGL学习笔记(九):索引缓冲器(EBO /IBE)的理解与使用,引入线框/填充模式
OpenGL学习笔记(九):索引缓冲器(EBO /IBE)的理解与使用,引入线框/填充模式
OpenGL学习笔记(九):索引缓冲器(EBO /IBE)的理解与使用,引入线框/填充模式
|
异构计算
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(一)
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(一)
405 0
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(一)
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(二)
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(二)
144 0
【OpenGL】十、OpenGL 绘制点 ( 初始化 OpenGL 矩阵 | 设置投影矩阵 | 设置模型视图矩阵 | 绘制点 | 清除缓冲区 | 设置当前颜色值 | 设置点大小 | 绘制点 )(二)
|
API Android开发
【Android 内存优化】自定义组件长图组件 ( 获取图像宽高 | 计算解码区域 | 设置图像解码属性 复用 像素格式 | 图像绘制 )
【Android 内存优化】自定义组件长图组件 ( 获取图像宽高 | 计算解码区域 | 设置图像解码属性 复用 像素格式 | 图像绘制 )
141 0
【Android 内存优化】自定义组件长图组件 ( 获取图像宽高 | 计算解码区域 | 设置图像解码属性 复用 像素格式 | 图像绘制 )
|
前端开发 Android开发
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(一)
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(一)
367 0
|
Android开发
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)
254 0
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)