Cocos2d-x基础:透视投影与正交投影

Cocos2d-x默认的透视投影可能导致图片模糊,通过设置为正交投影可以解决此问题。正交投影保持物体大小不变,适合需要清晰显示的场景;透视投影则产生近大远小的效果,提供更真实的视觉感受。了解这两种投影的基本概念及在OpenGL中的应用,有助于优化Cocos2d-x项目中的显示质量。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Cocos2d-x在默认的投影方式下,当用sprite或其他方式显示图片时,会发现图片变得模糊了。这是由于默认的投影方式是透视投影,透视投影可以将画面显示效果模拟成三维的,有距离感,可以设置相机的位置,而改变显示效果。

可以直接使用语句将投影模式改为正交投影:


CCDirector::sharedDirector()->setProjection(kCCDirectorProjection2D);

图片显示变清晰了。


相关知识:

投影:光线照射到物体,在某个平面(墙壁、地面)上得到的影子,叫做物体的投影。

正交投影:平行投射线垂直于投影面的称为正交投影,也称为正射投影。

透视投影:透视投影是用中心投影法将形体投射到投影面上,从而获得的一种较为接近视觉效果的             


OpenGL相关知识:

正交投影(Orthographic Projection)

无论物体距离相机多远,投影后的物体大小尺寸不变。此种模式下,不需要设定照相机位置、方向以及视点的位置。

透视投影(Perspective Projection)

离视点近的物体大,离视点远的物体小,远到极点即为消失,成为灭点。它的视景体类似于一个顶部和底部都被切除掉的棱椎,也就是棱台。





### Cocos 引擎中相机画布的配置及常见错误解决 在游戏开发过程中,Cocos 引擎中的 **Camera(相机)** 和 **Canvas(画布)** 是两个非常重要的组件。它们共同决定了场景的内容如何呈现给玩家。 #### Camera 的基本功能 在 Cocos Creator 中,`Camera` 组件负责捕捉并渲染场景的一部分到屏幕上。通过设置不同的参数,可以控制视口大小、清晰度以及显示区域等内容[^1]。 以下是 `Camera` 常见的关键属性及其作用: - **Clear Flags**: 定义摄像机清除屏幕的方式,可以选择只清除颜色、深度缓冲区或者两者都不清。 - **Culling Mask**: 控制哪些节点会被该摄像机捕获渲染。 - **Projection Mode**: 投影模式分为正交投影 (Orthographic) 和透视投影 (Perspective),前者适用于 UI 渲染,后者适合 3D 场景。 - **Viewport Rect**: 设定摄像机所占屏幕的比例范围,默认全屏覆盖。 ```javascript // 获取当前场景下的第一个相机实例 let cameraNode = cc.find("Main Camera"); if (!cameraNode || !cameraNode.getComponent(cc.Camera)) { console.error("未找到有效的相机!"); } else { const cameraComponent = cameraNode.getComponent(cc.Camera); // 修改 ClearFlags 属性 cameraComponent.clearFlags = cc.ClearFlag.SKY; // 调整 ViewportRect 参数 cameraComponent.setViewportRect(0, 0, 0.5, 1); // 占据左半部分屏幕 } ``` #### Canvas 配置详解 `Canvas` 是 Cocos 引擎用来管理所有 UI 元素的核心容器。它提供了统一的世界坐标系转换机制,使得开发者能够轻松定位和调整界面布局[^2]。 主要涉及以下几个方面: - **Design Resolution**: 指定设计分辨率,在此尺寸下所有的 UI 元件比例都是标准状态; - **Fit Height/Width**: 自动适配高度或宽度来保持画面不失真; - **Alignment Options**: 提供多种锚点选项满足不同需求如居中对齐等操作方式。 如果遇到绘制异常情况,则可能是由于以下原因引起: 1. **Resolution Mismatch**: 实际运行设备像素密度设定不符造成错位现象。 2. **Anchor Point Misconfiguration**: 子对象相对于父级 canvas 的位置计算失误。 3. **Z-order Conflicts**: 多层叠加时顺序混乱影响最终效果展示。 针对上述问题可采取如下措施修复: - 确认项目 settings 下 Graphics Settings 是否开启 DPI Adaptation 功能支持多分辨率适应性处理[^3]。 - 对于复杂嵌套结构建议逐一排查各层级 anchor point 设置准确性。 - 利用调试工具查看 z-index 排列状况及时修正冲突项。 ```javascript const canvas = cc.director.getScene().getChildByName('Canvas'); canvas.designResolution = new cc.Size(720, 1280); // 启用自定义缩放策略 cc.game.setPreferredFramesPerSecond(60); cc.view.enableAutoScale(cc.ResolutionPolicy.SHOW_ALL); ``` ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值