Loading [MathJax]/jax/input/TeX/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何在动画过程中更改雪碧图的图像?

如何在动画过程中更改雪碧图的图像?
EN

Stack Overflow用户
提问于 2018-08-07 10:17:52
回答 1查看 46关注 0票数 1

每次对象worker停止时,我都想更改它的图像。

Worker类是根据this thread@sloth的答案创建的。

代码语言:javascript
运行
AI代码解释
复制
class Worker(pygame.sprite.Sprite):
    def __init__(self, image_file, location, *groups):
        # we set a _layer attribute before adding this sprite to the sprite groups
        # we want the workers on top
        self._layer = 1
        pygame.sprite.Sprite.__init__(self, groups)
        self.image = pygame.transform.scale(pygame.image.load(image_file).convert_alpha(), (40, 40))
        self.rect = self.image.get_rect(topleft=location)
        # let's call this handy function to set a random direction for the worker
        self.change_direction()
        # speed is also random
        self.speed = random.randint(1, 3)

    def change_direction(self):
        # let's create a random vector as direction, so we can move in every direction
        self.direction = pygame.math.Vector2(random.randint(-1,1), random.randint(-1,1))

        # we don't want a vector of length 0, because we want to actually move
        # it's not enough to account for rounding errors, but let's ignore that for now
        while self.direction.length() == 0:
            self.direction = pygame.math.Vector2(random.randint(-1,1), random.randint(-1,1)) 

        # always normalize the vector, so we always move at a constant speed at all directions
        self.direction = self.direction.normalize()

    def update(self, screen):
        # there is a less than 1% chance every time that direction is changed
        if random.uniform(0,1)<0.005:
            self.change_direction()

        # now let's multiply our direction with our speed and move the rect
        vec = [int(v) for v in self.direction * self.speed]
        self.rect.move_ip(*vec)

        # if we're going outside the screen, move back and change direction
        if not screen.get_rect().contains(self.rect):
            self.change_direction()
        self.rect.clamp_ip(screen.get_rect())

我尝试创建一个预加载图像的缓存

代码语言:javascript
运行
AI代码解释
复制
image_cache = {}
def get_image(key):
    if not key in image_cache:
        image_cache[key] = pygame.image.load(key)
    return image_cache[key]

然后我假设有必要将以下代码添加到def __init__

代码语言:javascript
运行
AI代码解释
复制
images = ["worker.png", "worker_stopped.png"]
for i in range(0,len(images)):
   self.images[i] = get_image(images[i])

并将以下代码放入def update(self)

代码语言:javascript
运行
AI代码解释
复制
if self.direction.length() == 0:
    self.image = self.images[1]
else:
    self.image = self.images[0]

然而,它似乎不能正常工作。旧图像worker.png不会消失,整个动画会被锁定。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-08-07 12:21:54

我认为您应该引入某种状态来指示worker是否正在运行。下面是一个例子。请注意以下注释:

代码语言:javascript
运行
AI代码解释
复制
class Worker(pygame.sprite.Sprite):

    # we introduce to possible states: RUNNING and IDLE
    RUNNING = 0
    IDLE = 1

    def __init__(self, location, *groups):

        # each state has it's own image
        self.images = {
            Worker.RUNNING: pygame.transform.scale(get_image("worker.png"), (40, 40)),
            Worker.IDLE: pygame.transform.scale(get_image("worker_stopped.png"), (40, 40))
        }

        self._layer = 1
        pygame.sprite.Sprite.__init__(self, groups)

        # let's keep track of the state and how long we are in this state already            
        self.state = Worker.IDLE
        self.ticks_in_state = 0

        self.image = self.images[self.state]
        self.rect = self.image.get_rect(topleft=location)

        self.direction = pygame.math.Vector2(0, 0)
        self.speed = random.randint(2, 4)
        self.set_random_direction()

    def set_random_direction(self):
        # random new direction or standing still
        vec = pygame.math.Vector2(random.randint(-100,100), random.randint(-100,100)) if random.randint(0, 5) > 1 else pygame.math.Vector2(0, 0)

        # check the new vector and decide if we are running or fooling around
        length = vec.length()
        speed = sum(abs(int(v)) for v in vec.normalize() * self.speed) if length > 0 else 0

        if length == 0 or speed == 0:
            new_state = Worker.IDLE
            self.direction = pygame.math.Vector2(0, 0)
        else:
            new_state = Worker.RUNNING
            self.direction = vec.normalize()

        self.ticks_in_state = 0
        self.state = new_state

        # use the right image for the current state
        self.image = self.images[self.state]

    def update(self, screen):
        self.ticks_in_state += 1
        # the longer we are in a certain state, the more likely is we change direction
        if random.randint(0, self.ticks_in_state) > 30:
            self.set_random_direction()

        # now let's multiply our direction with our speed and move the rect
        vec = [int(v) for v in self.direction * self.speed]
        self.rect.move_ip(*vec)

        # if we're going outside the screen, change direction
        if not screen.get_rect().contains(self.rect):
            self.direction = self.direction * -1

        self.rect.clamp_ip(screen.get_rect())
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51724335

复制
相关文章
photoshop 制作雪碧图
好了,有了透明背景之后,就可以打开那三个图片,抠出图像部分,复制+黏贴到透明背景中。
Devops海洋的渔夫
2019/06/02
2K0
什么叫 “雪碧图”?
我们喝的雪碧,它的英文也是 sprite,应该直译为 “精灵” 的。但要符合中国市场,因为你不能说我喝的饮料叫“精灵”,那特别怪。于是就走音译的路线,翻译成 “雪碧” 了。
前端西瓜哥
2022/12/21
6.5K0
什么叫 “雪碧图”?
一键制作自适应等比缩放的雪碧图帧动画
雪碧图并不陌生,将多张图片合在一起来减少请求数,从而提升网站的性能。在你的网站未支持 HTTP2 前,还是值得这么处理。
疯狂的技术宅
2019/03/28
2.4K0
一键制作自适应等比缩放的雪碧图帧动画
CSS3: animate 帧动画和雪碧图-完成一个盒子打开动画
写在最前面 最近做一个关于抽奖活动的项目,会涉及到很多动画,这里来探讨一下 scss 函数和 css 动画的制作 需求:如图 一个打开的盒子,其中有许多不规则的星星✨不规则的运动动,看着这个复杂的动画
西南_张家辉
2021/02/02
1.5K0
matlab 图像填充斜线_怎么更改柱形图的填充
针对这种情况,MATLAB提供了若干特殊图形绘 制函数。接下来主要介绍特殊图形的绘制方法,主 要图形包括:条形图、区域图、饼状图、柱状图、 离散图、罗盘图、羽毛图、……
全栈程序员站长
2022/11/02
2K0
学习 PixiJS — 精灵状态
如果你有复杂的游戏角色或交互式对象,你可能希望该角色根据游戏环境中发生的情况,以不同的方式运行。每个单独的行为称为状态。如果你在精灵上定义状态,那么只要游戏中出现与该状态相对应的事件,就可以触发这些状态。 比如,通过键盘的方向键控制一个游戏角色时,按下左箭头,角色就向左移动,其实可以理解为,按下左键头时,触发了角色的向左移动的状态。
FEWY
2019/05/26
2.1K0
CSS样式更改——过渡、动画
上篇文章主要讲述了CSS样式更改中的2D转换,这篇文章我们来介绍下CSS样式更改中的过渡、动画基础用法。
前端皮皮
2020/11/25
1.2K0
猿人学第四题,雪碧图、样式干扰
里面用到了类似于字体加密,但是是把数字用base64转成了图片,但是有个规律就是每个数字都是固定的base64,然后就可以取到很多数字,然后有一个class用到了MD5和base64加密,最后删除包含这个class的img,就得到了四位数,但是四位数顺序是乱的,然后就需要根据style里面的margin去换位置,最终就可以将正确的数字取出来,如上图,然后再整一整就是下图了 Python代码:
SingYi
2022/07/13
1.2K0
猿人学第四题,雪碧图、样式干扰
记GIF动画转CSS逐帧动画工具
翻到了 2018 年左右团队支持的一个项目,当时看重构同学不断的在和设计师来回沟通调动画细节,就在想能不能提升下这里的效率,于是了解了下当时的实现过程,大概是这样的:
GhostZhang
2022/08/22
1.4K0
记GIF动画转CSS逐帧动画工具
使用grunt对css中的background图片自动生成雪碧图
公司研发的系统为B/S架构,用户使用浏览器访问系统时,使用浏览器自带工具查看,对图片的请求数极多,多为小图片。 今天想对这个现状进行改善,网上查到一种雪碧图的方案,其实就是使用工具将数量很多的小图片拼成一张大图片,然后css里都引用这张大图片,并指定显示该图片的某一个区域,但这个方案需要手工作很多处理。 于是就想到能不能用目前比较成熟的grunt对前端样式文件自动进行处理,自动生成雪碧图,自动修改样式文件。一搜索果然找到了方案,下面为Gruntfile.js文件的片断: module.exports = f
jeremyxu
2018/05/09
1.6K0
postcss-lazysprite: 一种生成CSS 雪碧图的懒惰姿势
postcss-lazysprite 是一个基于PostCSS 开发的用于生成雪碧图图片及其CSS 的插件,经过半年持续迭代,现已稳定用在旗下两款产品的Web 业务中。其与市面上的雪碧图插件不同在于生成雪碧图的“懒惰”姿势。 前言 前端界,伴随着雪碧图这个概念出现,自动化产生雪碧图这类工具就层出不穷。无论是早期GUI 工具,还是现在流行的配合Gulp/Grunt/Webpack 这类构建工具而产生的雪碧图插件。总之是百花齐放,长江后浪推前浪,后浪死在沙滩上。 根据输入方式的不同,现在市面上基于Node.js
Jeff
2018/01/22
1.7K0
threejs 贴图动画总结
在三维可视化中,会涉及到很多动画,其中贴图动画是其中很重要的一种,本文介绍几种贴图动画的思路,供大家一起探讨。
用户3158888
2022/03/22
2.7K0
threejs 贴图动画总结
如何使用几何画板画函数图像,如极坐标函数图像?
1、点击[绘图] 2、点击[网格样式] 3、点击[极坐标网格] 4、点击[绘图] 5、点击[绘制新函数] 6、点击[3] 7、点击[函数] 8、点击[cos] 9、点击[θ] 10、点击[确定] 11、点击[是]
裴来凡
2022/05/28
1.3K0
如何使用几何画板画函数图像,如极坐标函数图像?
webpack生成雪碧图案例
使用到的插件是: webpack-spritesmith 依赖项: "webpack-spritesmith": "^1.1.0" "webpack": "^4.29.6" "webpack-cli": "^3.3.0" 预设命令: "build:dev": "npx webpack --mode development" "build:prod": "npx webpack --mode production" 配置webpack.config.js 配置输出模板: // 定义输出模板函数 const
前端小鑫同学
2022/12/25
5700
如何在Linux中更改SSH端口?
SSH(Secure Shell)是一种安全的远程登录协议,它允许您通过网络远程连接到Linux系统并进行管理操作。默认情况下,SSH使用22端口进行通信。然而,为了增强系统的安全性,有时候我们需要更改SSH端口,以减少潜在的攻击。
网络技术联盟站
2023/05/25
9.6K0
如何在Linux中更改SSH端口?
如何在Mac上轻松更改Finder的外观
macOS Finder是一个方便的实用程序,但是如果您自定义外观,它可能会为您提供更好的服务。这里有一些改变Finder外观的技巧!
office小助手
2020/12/24
6.2K0
如何在Mac上轻松更改Finder的外观
如何在 Git 上更改分支名称?
在 Git 版本控制系统中,分支是非常重要的概念。分支允许你在项目中进行并行开发和实验,同时保持主分支的稳定性。有时候,你可能需要更改已存在的分支名称,例如纠正拼写错误或者为了更好地描述分支的内容。本文将详细介绍如何在 Git 上更改分支名称。
网络技术联盟站
2023/06/19
1.9K0
如何在 Git 上更改分支名称?
[可视化]盘旋光束如幽灵的Wi-Fi信号图
英国大学生绘制Wi-Fi信号图,盘旋光束如幽灵。 据英国《每日邮报》6月19日报道,英国纽卡斯尔大学博士生路易斯·赫南(Luis Hernan)日前绘制出一系列展现人类周围无形网络Wi-Fi连接情况的
大数据文摘
2018/05/21
1K0
点击加载更多

相似问题

雪碧图动画的CAKeyframeAnimation

12

旋转动画雪碧图?

12

Unity 5.2 -雪碧图动画

110

雪碧图动画Android Studio

13

如何在Andengine中延迟动画雪碧图?

20
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
社区富文本编辑器全新改版!诚邀体验~
全新交互,全新视觉,新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能,全面提升创作效率和体验
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文