首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么使用setOrigin的精灵的旋转点没有设置在精灵的中间?

使用setOrigin函数设置精灵的旋转点时,旋转点默认是设置在精灵的中心位置的。如果旋转点没有设置在精灵的中间,可能是由于以下几个原因:

  1. 错误的坐标系:在设置旋转点时,需要确保使用的坐标系与精灵的坐标系一致。如果使用的坐标系不正确,可能导致旋转点位置错误。
  2. 精灵尺寸变化:如果在设置旋转点之前,对精灵进行了缩放、旋转或者其他尺寸变化操作,可能会导致旋转点位置不在精灵的中间。
  3. 错误的旋转点坐标:可能是在设置旋转点时,传入的坐标参数不正确,导致旋转点位置错误。

为了解决这个问题,可以尝试以下方法:

  1. 确认坐标系:确保使用的坐标系与精灵的坐标系一致,可以通过查阅相关文档或者API来确认。
  2. 设置旋转点前不进行尺寸变化:在设置旋转点之前,确保没有对精灵进行缩放、旋转或其他尺寸变化操作。
  3. 检查旋转点坐标:仔细检查传入setOrigin函数的旋转点坐标参数,确保其正确。

如果以上方法都没有解决问题,可能需要进一步检查代码逻辑或者查阅相关文档来找到问题所在。

腾讯云相关产品和产品介绍链接地址:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

CSS3 实现宝可梦剑盾精灵球 Loading 效果(带源码)

缘起11.18「宝可梦朱·紫」正式发售,我才记起还没在 Switch 上玩过「宝可梦剑·盾」,赶紧趁着双十一,某宝上下单了一张卡带,为双十一做出了一微博贡献。到手才发现,买是二手卡带。...精灵球图案不复杂,拆分下来就是几个图层背景叠加:第一层是线性渐变背景,上半部分 46% 面积是红色(色值:#cb0905),中间 8% 部分是黑色(色值:#000000),下半部分 50% 面积是白色...图片可以看到虽然使用了渐变背景,但图案上并没有渐变效果,这里用了一个小技巧:同一个位置同时设置两个颜色,达到颜色跳变效果。...另外这里需要注意一 HTML 里,元素重叠时,后书写元素会覆盖在前面书写元素上。...(0deg); } 100% { transform: rotate(360deg); }}第二步动画就比较棘手了:静态精灵使用是线性渐变实现,而不是使用扇形实现而且 CSS 没提供绘制扇形

1.5K130

第二章:图形绘制TextureSpriteBatch 类(相当于画笔)为什么要2N次方?TextureRegion 可用于图片截取。Sprite类清屏

2.用途:其实就是承装获取到目的图片容器 3.使用:Gdx.files.* 文件模块 Gdx.files....256 2^7 = 128 2^6 = 64 2^5 = 32 2^4 = 16 2^3 = 8 2^2 = 4 2^1 = 2 为什么要...libGDX使用OpenGL ES ,分为两个版本 OpenGL ES 1.x 和 OpenGL ES 2.0,1.x 图片大小必须是2整次数幂,而 2.0 无此要求。...截取512*512 ---- Sprite类 1.定义:持有几何形状,颜色,和纹理信息使用加载绘制2D精灵 2.用途:TextureRegion加强版,SpriteBatch加强版,比TextureRegion...多了一些功能:指定位置,颜色,旋转,等…… 3.特点:可以处理Texture,TextureRegion等纹理 方法: 1.大小:sprite.setSize(120,120) 2.旋转中心:sprite.setOrigin

89720

CocosCreator基础教程—color属性妙用

,整体色调会变暗 纯红、绿、蓝三元色精灵使用color属性,颜色只能在当前图片颜色范围变化,应用范围有限 2. color属性字体上应用 上图中,我不仅在精灵组件上设置了颜色,同时也设置了他们下方...绿色字体叠色后变黑色了 所以制作字体时,尽量先用纯白色,或者再用浅灰色做字体外发光,这样可以让字体文件使用范围更大,发挥更大价值。 3....透明度对图片影响 中间和左边两个精灵透明(opactiy)为155,但中间这个精灵节点放在了一个白色图片上面,精灵节点颜色与它背景颜色做了叠加。...最右边精灵没有设置透明,与最左边对比,左边精灵颜色要暗些,也是因为透过了当前节点加入了背景色原因。...另外需要注意,图片透明和节点透明度都会影响游戏最终渲染出颜色效果,合理利用color、size、锚旋转、九宫等属性特性,扬长避短,可以让游戏更加出色。

5K40

【Cocos2d-x】Sprite精灵类-创建Sprite精灵对象

精灵Cocos2d-x中地位就像一场电影中主角,男主角/女主角,是一场电影中灵魂所在。...创建Sprite精灵对象 创建精灵对象 创建精灵对象有多种方式,其中常用函数如下: static Sprite* create(); //创建一个精灵对象,纹理等属性需要在创建后设置 static Sprite...我们不会简单把每个精灵做一个图片,这样会消耗更多IO读写时间 //可以放在大图中(合成图),进行一次读取,使用中再截取,也就是下面的创建方法(这样内存会消耗多,但是IO操作少) //如果使用是...,第三个参数是否旋转纹理,默认不旋转 从纹理缓存区来裁剪矩形区域创建精灵 //旋转就是,可能某些情况下,我们合图时为了节省空间,将小图旋转再合图了,这个时候就需要旋转了 static Sprite*...一般而言,游戏里叫纹理或纹理图片,这是没问题 使用纹理对象创建Sprite对象 场景设计: image.png 两个精灵(具体几个,看美工给几张图咯): 草地图片: image.png

75610

使用 phaser3 从零实现一个战疫小游戏

前言 本文中,我将从零开发一个 H5 游戏,主要使用 phaser3 来制作游戏。...添加怪物和食物 右键新建对象层重命名成 Enimes 添加一些锚,这些锚位置可以游戏中渲染成怪物,同理也需要添加一些食物。...当前我们英雄是静态,想让我们英雄移动时候跑起来,我们可以使用精灵图,先来看下我们精灵图,特意给精灵图加上了口罩。...还需要加载一个描述精灵 json ,我们一起来看下 json 数据结构 JSON 描述了精灵图每一帧位置和中心,当然这个 JSON 不是手写,我们可以借助 Texture Packer 这个工具打包生成...包括精灵图,精灵表,设计地图,动画、碰撞检查、事件通知等。 相信通过以上学习,以后工作中,对类似的 H5 游戏,有一定认知,并且能够快速开发出一款小游戏。

3.6K40

手把手教你写一个经典躲避游戏

例如上上图中代码,我们将 600x600 画布渲染在一个 600px x 600px 元素上,高清屏(DPR >= 2)场景下,会出现模糊现象。具体感兴趣为什么模糊可以自行搜索。...因为需要三角形面向移动方向,所以我们还得加上旋转角度,因为 rotate 默认是基于 (0, 0) 旋转,而我们需要基于三角形重心进行旋转,所以我们先使用 translate 进行偏移,偏移到重心旋转完再移动回去...123): 第一种是A左边时 u 是负数,最近为 A 第二种是B右边时投影超出边长度,最近为 B 第三种就是圆正好在边正上方,最近为 C 得到圆心距离边最近后,...,发现不对劲,因为之前玩家精灵旋转是 canvas 自带 API rotate 旋转,而之后碰撞检测用的确是未旋转三角形去判断,所以会出现明明没接触也触发碰撞情况。...摇杆相关配置项: 实现上其实也很简单,就是玩家精灵多加个参数,可以选择控制方式,如果是使用触摸控制,则加入摇杆,我们这里默认是将摇杆中心设定在左下角 然后判断如果是触摸控制,则监听触摸事件 然后加个字段记录下手指按住地方即可

1.3K20

Cocos Creator | 飞刀大乱斗开发教程系列(二)!

使用几个精灵,都需要根据不同等级,进行纹理更换,于是就封装了一个通用方法,传入精灵节点和纹理所在路径,使用 cc.loader 动态加载纹理,加载成功以后,直接显示出来。 ? ? ?...动画显示 ? ? ■ 这一部分,有 3 个节点需要使用到动画:旋转光、放大缩小光球、旋转刀。...每一个节点都挂载一个启动播放动画,动画具体实现,直接在 Cocos Creator 编辑器内编辑好保存就行。 ? ■ 光旋转效果,只需要做旋转动画即可。动画中,加入旋转角度,就可以简单实现。...■ 以上所有动画,游戏中是同时进行播放,最后看起来效果就如同最开始预览一样,球和武器一起旋转,同时光球不断放大缩小。 ? ? 武器添加 ? ?...■ 这里将武器添加,是指初始化时,根据不同等级英雄,默认添加添加到英雄周围旋转飞刀,都是一次性添加没有动态添加几把效果,这个后期会讲到。 ?

83910

【H5游戏】 pixijs 需求级入门

,控制精灵元素大小,位置,旋转,缩放,原点,层叠 等等 所有显示效果都可以简单地设置属性 宽高大小 sprite.width =10 sprite.height =10 位置 设置xy两个坐标 sprite.x...如果在图片没有加载完成时候,就直接给精灵元素设置了 宽高和 scale,那么此时 scale 无效 比如 使用 Sprite.from("https://图片链接")创建精灵 const sprite...64*64,并不会缩小成0.1倍 最好办法是把图片放进缓存, 图片加载完毕后 设置属性,或者 保证设置 scale 图片loaded 之后 旋转则是修改rotation属性 sprite.rotation...官方没有 基点这个概念,只是我为了统一叫,而是分为 原点 和 锚 原点属性叫做 sprite.pivot,锚属性叫做 sprite.anchor ,他们都包含为 x 和 y 两个坐标 这两个属性作用都是设置基点...则以渲染结果为准 5事件 canvas 添加事件非常麻烦,不过 PIXI 把这个事情做好了,我们使用起来就和 dom 监听事件一样简单 暂时使用起来还没有发现什么坑 怎么添加事件 主要是给 元素设置

2.7K21

【Cocos2d-x】Cocos2d-x精灵性能优化

Cocos2d-x精灵性能优化-使用纹理图集和精灵帧缓存 使用纹理图集 纹理图集(Texture)也称为精灵表(Sprite Sheet) 使用纹理图集优点: 1、减少文件读取次数,读取一张图片比读取一推小文件要快...那么运用这种图片集方式将会减少内存碎片。 虽然Cocos2d-x v2.0后使用OpenGL ES2.0,它不会再分配2几次幂内存块了,但是减少读取次数和绘制优势依然存在。...:create("SpriteSheet.png",Rect(2,391, 934, 388));//截取图片 mountain1->setAnchorPoint(Vec2::ZERO);//设置...(plist文件)移除精灵帧 void removeUnusedSpriteFrames();//移除没有使用精灵帧 建议初学者不要轻易使用清除缓存函数!...>setAnchorPoint(Vec2::ZERO);//设置 mountain1->setPosition(Vec2(-200,80)); this->addChild(mountain1,0

54820

眨个眼就学会了Pixi.js

本文将为工友们介绍PixiJS基础知识和使用方法,希望可以和工友们**快速光速入门**,掌握 Pixi.js 用法。 实际工作中我还没有用上 Pixi.js,本文只是记录我学习过程。...你可以使用 Pixi.js 创建画布时候设置好画布宽高。...radius 是多边形半径,也就是中心点到各个距离。 sides 是多边形边数,最小值是3。 rotation 是多边形旋转弧度,默认值是0。...sprite.y = 100 // 将精灵添加到画布中 app.stage.addChild(sprite) 旋转 通过设置 rotation 属性旋转图片。...细心工友可能发现了,矩形是围绕这它左上角进行旋转。 如果想让矩形进行中心旋转,可以设置 pivot 值为自身宽高一半。

6.6K10

从零开始学会用Python3做捕鱼达人游

Python3Python2基础之上做了非常多改进,比如字符串编码,Python3中默认字符使用是unicode编码,可以涵盖这个地球上所有的字符,当然了,优势不仅仅只有这一。...cocos2d中,如果想要加载一张图片,则必须使用精灵(Sprite),以后我们游戏中将会使用鱼、炮筒、网,都是通过精灵来实现。...撒网: 旋转炮筒后,要把网撒出去,撒到鼠标点击地方,并且网撒出去时候要从小变大(网图片素材搜裙:526929231),代码如下: ?...添加鱼: 到目前位置,我们游戏场景中还没有一条鱼,因此我们这里添加鱼类,并且让他继承自sprite.Sprite,鱼游动过程中,会不断更新自己动作,因此不能简单使用一张图片,而要使用到一组图片...鱼和网碰撞检测: 当网撒出去后,应该判断有没有和鱼发生碰撞,如果碰撞到了,就要让这条鱼设置为被捕获状态。

1.1K20

学习 PixiJS — 补间动画

Pixi 没有内置补间引擎,但是你可以使用很多很好开源补间库,比如 Tween.js 和 Dynamic.js 。如果要制作非常专业自定义补间效果,可以使用这两个库中其中一个。...如果你需要使精灵中点沿着曲线移动,还需要设置精灵(anchor)居中,如下所示: sprite.anchor.set(0.5, 0.5); 查看示例 slide 和 followCurve 方法适用于简单来回动画效果...沿路径移动 你可以使用 Charm walkPath 方法连接一系列,并使精灵移动到每个。该系列中每个都称为 waypoint 。...delayBetweenSections 0 一个以毫秒为单位数字,用于确定精灵移动到路径下一部分之前应该等待时间。 接下来,使用 walkPath 方法使精灵按顺序移动到所有这些。...第一条曲线中最后一个应与下一条曲线中第一个相同。你可以根据需要使用尽可能多曲线。

2.2K30

three.js 带更新文字旋转地球

查看旋转地球效果 主要用到几个知识 (1)显示文字是使用了three.js 精灵(Sprite),精灵文字方向始终面向相机,文字是canvas中画精灵材质就是加载带有文字canvas...canvasTexture }) sprite = new THREE.Sprite(spritMaterial) sprite.position.set(-280,0,0); //精灵默认大小很小估计是...[1,1,1] sprite.scale.set(0.64*256,0.64*64,1); scene.add(sprite) } (2)文字更新方法是为canvas文字重新赋值,并在动画中移除上次加载精灵...,否则精灵会重叠 scene.remove(sprite) 也可以更新spritematerial属性 function animate() { text="new text";...,那么中间物体相对于整个场景来说,就越小了 camera = new THREE.PerspectiveCamera(45, width / height, 1, 10000);

9.8K113

Cocos Creator | 挤水果小游戏实现 ( 一 )

■ 水果上水滴和掉落水滴,分开控制,因为掉落水滴需要添加刚体,水果上水滴需要随着父节点运动。 ■ 随水果转动水滴,就用普通精灵即可,控制显示逻辑部分,也是控制这个精灵显示和隐藏。 ?...■ 掉落水滴,单独做预制,需要添加物理组件,因为是不规则形状,就选择 Polygon 物理碰撞组件,设置好碰撞边界。 ?...■ 触发掉落事件时,实例化一个水滴节点,添加到和水果上运动节水滴精灵相同位置,包括位置、旋转角度、父节点。也就是实例化带刚体水滴,运动初始位置就是水果上精灵当前位置。 ?...■ 设置好初始位置后,就是控制水滴运动,根据当前转盘旋转角度,即可计算出水滴运动方向,只需要在质心施加一个力即可(为了保证和 Cocos Creator 2.1.4 中 angle 角度一直,水滴初始位置放到了右边...,上述图中可以看出),使用 API 提供 applyForceToCenter 施加力。

1.3K20

小程序实践:基础内容icon,关于图标的5个实现方案等

4)color改变是像素颜色 图标可以看作是一些像素区域集合,至于这些像素是什么颜色,是由color属性决定。像上面绿色success图标,它默认色是绿色,中间对勾部分是镂空。...html中是没有原生icon标签,小程序基于浏览器引擎渲染,它icon组件是怎么实现? A)最简单粗暴方法,是使用img标签,每个图标对应一个图片。...由于矢量字体是绘制出来,所以它可以实时填充任意颜色,可以无极缩放而没有锯齿。 回到我们矢量字体图标方案上来。既然字符可以字体文件里定义,图标为什么不可以呢?...对于“晴”这个图标,iconfont这个网站上可以直接进行简单编辑,包装位移、大小、旋转、颜色等设置。 ?...即使是别人写好了样式,批量引入进来,也有不便控制问题。它本身并不是字符,如果每个图标绘制时没有一个统一中心使用时仅控制位置就比较麻烦。 E)最后,还有一个方案,就是使用svg。

1.8K00

【CSS3】CSS3 动画 ⑥ ( 动画属性示例 | 精灵图帧动画效果实现 )

一、需求说明 给定一张精灵图 , 其中有多个 动画帧 对应图片 , 下图大小是 1600 x 100 像素 , 截图展示如下 : 实际图片 : 二、代码分析 ---- 1、动画属性 使用上图实现...逐帧动画 效果 ; 实现逻辑是 设置 元素 animation-timing-function 动画属性 , 使用 steps(n) 属性值指定动画步长 ; 设置一个盒子模型 , 显示指定背景图片...动画实现 : 直接设置 盒子模型 绝对定位 属性 , 初始状态显示最左侧 , 最终状态 盒子模型 处于中间位置 , 需要先移动到 50% 位置 left: 50%; , 此时盒子模型左侧中间位置.../* 绝对定位到中间位置 此时盒子模型左侧中间位置 */ left: 50%; /* 往回走自身 50% 确保走到中间位置 */...此时盒子模型左侧中间位置 */ left: 50%; /* 往回走自身 50% 确保走到中间位置 */

35920

android游戏引擎andengine学习系列三:绘制游戏虚拟摇杆

andengine中绘制虚拟游戏摇杆非常简单,只需要实现AnalogOnScreenControl模拟摇杆类,设置一些属性即可。...先看效果图: 左边摇杆是控制精灵上下左右移动,右边摇杆空值精灵旋转。代码结构跟andengine学习系列二一样,其中很多注释系列二中有说明,该章内便不多复述。...,我在这里把他理解成界面的延时程度,值设越高,则精灵跟随摇杆变换越缓慢;但是如果设成0,则两个摇杆失灵,于是我们在这里把他设置成0.1f,便可以看到精灵跟随摇杆很灵活变换而没有卡壳和延时现象 备注...备注3:onControlClick(),这个方法是当我们点击摇杆时候会触发方法,比如我们在这里可以把摇杆设置放大1.5倍,当没有点击时候又恢复原来状态,给人一种真实感觉。...备注5:face.setRotation(),精灵转动也是这一句代码便可实现,MathUtils.radToDeg方法返回是:(180/PI)*方法中参数; Math.atan2()函数返回(x

81920

16 Python 基础: 重点知识--Pygame基础知识梳理

# 通过设置多个绘制线段,参数1绘制到窗口,参数2设置线段颜色,参数3设置线段是否是闭合线段,参数4设置多个列表,参数5设置线段宽度 # pygame.draw.lines(screen...,图片加载这些有一个IO操作,我们都知道磁盘读取速度跟内存读取速度是没有办法比,一个天一个地区别,所以像这个磁盘加载东西你最好一次性将图片加载进来,不要每一次(比如说,再循环过程中,就是每一帧渲染时候加载图片...pygame.sprite.collide_rect - 两个精灵之间碰撞检测,使用rects。...pygame.sprite.collide_rect_ratio - 两个精灵之间碰撞检测,使用缩放比例rects。...pygame.sprite.collide_circle - 两个精灵之间碰撞检测,使用圆圈。

3K30

领英精灵安全吗?附LinkedIn(领英)开发客户关键

2.提交批量添加好友任务时候,弹出对话框里,还可以勾选多个自己提前设置添加好不同风格内容好友添加邀请消息,一个一个发送添加好友邀请时,领英精灵会自动在所勾选添加好友邀请消息里智能切换发送...完全避免了手工操作时,简单粗暴发送没有任何称呼指向消息内容,客户拒绝通过并容易被举报骚扰所带来风险。领英精灵注册使用网站:http://linkedinjl.com/r?...想着肯定有意向客户会回复,心里总算也可以有一安慰。但是没想到第二天上班登录LinkedIn却只看到一个冷冰冰提示:“亲爱用户,您账号受到了限制,暂时无法使用”。...完全避免了手工操作时,简单粗暴发送没有任何称呼指向消息内容,客户不愿意回复并容易被举报骚扰所带来风险。​其实例子一和例子二里所说内容逻辑是相同,但是为什么我会拆开来重复一遍呢?...这些工作都是要不断坚持去做,每天去做,量变基础上带来质变。领英精灵注册使用网站:http://linkedinjl.com/r?

60240

54个CSS重难点整理,12-24篇,进阶高薪必需要掌握知识

本次我把CSS中重难点整理出来,总共54个核心知识,供大家复习,希望能帮到大家。这些重难点是进阶高薪必需要掌握知识,同时也是面试必问内容。...24、transform先平移旋转和先旋转再平移有什么区别? 13、如何判断元素是否到达可视区域(图片懒加载原理)?...16、对CSS Sprites(精灵图)理解?...减少使用 @import,建议使用 link,因为 link 页面加载时一起加载,import 是页面加载完成之后再加载。...24、transform先平移旋转和先旋转再平移有什么区别 先平移后旋转,并不会改变坐标轴方向 但是如果先旋转后平移,旋转时坐标轴方向也随着发生了改变 然后再平移,移动方向也就发生了改变了 <style

1.2K10
领券