《入门级-Cocos2dx4.0 塔防游戏开发》---第七课：游戏界面开发（自定义Layer）

news2024/12/24 20:42:42

目录

 一、开发环境

二、开发内容

2.1 添加资源文件

2.2 游戏MenuLayer开发

2.3 GameLayer开发

三、演示效果

四、知识点

4.1 sprite、layer、scene区别

4.2 setAnchorPoint

 一、开发环境

操作系统：UOS1060专业版本。

cocos2dx:版本4.0

环境搭建教程：统信UOS下配置安装cocos2dx开发环境

本课主要内容：

  1. 自定义Layer开发
  2. 游戏餐单按钮相关开发

文章地址:

二、开发内容

我们把开发游戏的menu相关元素放在一个Layer进行处理。

新建Layer目录，在其中新建文件GameLayer.h、GameLayer.cpp、GameMenuLayer.h、GameMenuLayer.cpp。

GameLayer:用于管理游戏相关内容。

GameMenuLayer：用于管理游戏餐单相关内容。

2.1 添加资源文件

前面的文章其实已经提到我们可以在LoadingScene.cpp中先加载资源，等到我们使用的时候可以直接通过资源的名字获取该资源信息。

在loadSource函数添加以下内容：

    SpriteFrameCache::getInstance()->addSpriteFramesWithFile("map_spritesheet_32-hd.plist");
    SpriteFrameCache::getInstance()->addSpriteFramesWithFile("map_spritesheet_32_2-hd.plist");
    SpriteFrameCache::getInstance()->addSpriteFramesWithFile("map_spritesheet_16_na-hd.plist");

注意需要将对应的plist文件以及png图片拷贝到Resources目录中。否则精灵在创建是需要通过名称获取图片获取不到而导致程序崩溃。

2.2 游戏MenuLayer开发

GameMenuLayer.h文件内容代码如下：

#ifndef __LAYER_GAME_MENU_LAYER_H__
#define __LAYER_GAME_MENU_LAYER_H__

#include "cocos2d.h"
USING_NS_CC;

class GameMenuLayer : public Layer
{
public:

    virtual bool init();
        
    // implement the "static create()" method manually
    CREATE_FUNC(GameMenuLayer)

    MenuItemSprite *book_,*shop_,*update_;

    Sprite * sprite_map_stars_container_;

    Label * lable_star_,*lable_diamonds_;

    bool isFirst;
    void touchBook(Ref *pSender);
    void touchShop(Ref *pSender);
    void touchUpdate(Ref *pSender);

    void onEnterTransitionDidFinish();

};

#endif // __LAYER_GAME_LAYER_H__

GameMenuLayer.cpp文件内容代码如下：
#include "GameMenuLayer.h"


// on "init" you need to initialize your instance
bool GameMenuLayer::init()
{
    //
    // 1. super init first
    if ( !Layer::init() )
    {
        return false;
    }
    isFirst =  true;
    // 获取窗口大小
    auto winSize = Director::getInstance()->getWinSize();

    // 商店精灵
    shop_ = MenuItemSprite::create(Sprite::createWithSpriteFrameName("butShop_0001.png"),
                                   Sprite::createWithSpriteFrameName("butShop_0002.png"),
                                   CC_CALLBACK_1(GameMenuLayer::touchShop,this));
    // 百科全书精灵
    book_ = MenuItemSprite::create(Sprite::createWithSpriteFrameName("butEncyclopedia_0001.png"),
                                   Sprite::createWithSpriteFrameName("butEncyclopedia_0002.png"),
                                   CC_CALLBACK_1(GameMenuLayer::touchBook,this));
    // 升级精灵
    update_ = MenuItemSprite::create(Sprite::createWithSpriteFrameName("butUpgrades_0001.png"),
                                    Sprite::createWithSpriteFrameName("butUpgrades_0002.png"),
                                    CC_CALLBACK_1(GameMenuLayer::touchUpdate,this));

    book_->setPosition(Point(winSize.width - book_->getContentSize().width/2,book_->getContentSize().height/2 -130));
    update_->setPosition(Point(book_->getPosition().x - 160 , update_->getContentSize().height/2-130));
    shop_->setPosition(Point(update_->getPosition().x - 160 , shop_->getContentSize().height/2-130));

    auto menu = Menu::create(shop_,update_,book_,nullptr);
    menu->setPosition(Vec2::ZERO);
    addChild(menu);

    sprite_map_stars_container_ = Sprite::createWithSpriteFrameName("mapStarsContainer.png");
    sprite_map_stars_container_->setPosition(Point(winSize.width - sprite_map_stars_container_->getContentSize().width/2 - 10,
                                                   winSize.height - sprite_map_stars_container_->getContentSize().height/2 + 60));
    addChild(sprite_map_stars_container_);

    // 星星的数量
    lable_star_ = Label::createWithTTF("0","SohoGothicProMedium.ttf",26);
    lable_star_->setPosition(Point(sprite_map_stars_container_->getContentSize().width/4*3 + 20,sprite_map_stars_container_->getContentSize().height/2));
    sprite_map_stars_container_->addChild(lable_star_);

    // 砖石的数量
    lable_diamonds_  = Label::createWithTTF("0","SohoGothicProMedium.ttf",26);
    lable_diamonds_->setPosition(Point(sprite_map_stars_container_->getContentSize().width/4,sprite_map_stars_container_->getContentSize().height/2));
    sprite_map_stars_container_->addChild(lable_diamonds_);

    return true;
}

void GameMenuLayer::touchBook(Ref *pSender)
{

}

void GameMenuLayer::touchShop(Ref *pSender)
{

}

void GameMenuLayer::touchUpdate(Ref *pSender)
{

}

void GameMenuLayer::onEnterTransitionDidFinish()
{
    if(isFirst){
        book_->runAction(MoveBy::create(0.3f,Point(0,130)));
        update_->runAction(MoveBy::create(0.3f,Point(0,130)));
        shop_->runAction(MoveBy::create(0.3f,Point(0,130)));

        sprite_map_stars_container_->runAction(MoveBy::create(0.3f,Point(0,-70)));
        isFirst = false;
    }
}

2.3 GameLayer开发

其实GamelLayer添加了GameMenuLayer，并并且添加了一个背景就没啥了。


#ifndef __LAYER_GAME_LAYER_H__
#define __LAYER_GAME_LAYER_H__

#include "cocos2d.h"
USING_NS_CC;

class GameLayer : public Layer
{
public:
    static cocos2d::Scene* createScene();

    virtual bool init();
        
    // implement the "static create()" method manually
    CREATE_FUNC(GameLayer)

    Size win_size_;
    Sprite *sprite_background_;
};

#endif // __LAYER_GAME_LAYER_H__

内容如下：

#include "GameLayer.h"
#include "GameMenuLayer.h"
USING_NS_CC;

Scene* GameLayer::createScene()
{
    auto scene = Scene::create();
    auto game_layer = GameLayer::create();
    auto game_menu_layer = GameMenuLayer::create();
    scene->addChild(game_layer);
    scene->addChild(game_menu_layer);
    return scene;
}

// on "init" you need to initialize your instance
bool GameLayer::init()
{
    //
    // 1. super init first
    if ( !Layer::init() )
    {
        return false;
    }
    win_size_ = Director::getInstance()->getWinSize();
    sprite_background_ = Sprite::createWithSpriteFrameName("MapBackground.png");
    sprite_background_->setAnchorPoint(Vec2::ZERO);
    sprite_background_->setPosition(Vec2::ZERO);

    addChild(sprite_background_);
    return true;
}

三、演示效果

  

四、知识点

4.1 sprite、layer、scene区别

在 cocos2d-x 游戏引擎中，`Sprite`、`Layer` 和 `Scene` 都是用于构建游戏场景和图层的类，但它们在功能和用途上有一些区别。

1. Sprite（精灵）：

  •   `Sprite` 是游戏中可见的图像元素，通常用于表示游戏中的角色、物体、背景等。
  •   你可以将纹理（图像）加载到 `Sprite` 中，使其显示特定的图像。
  •   `Sprite` 可以进行位置、大小、旋转等的设置，还可以添加动画和事件监听器。
  •   用法示例：创建角色、敌人、道具、特效等可见的游戏元素。

2. Layer（图层）：

  •  `Layer` 是场景中的可视化图层，用于呈现游戏中的各种元素，如精灵、文本、UI 等。
  •   一个 `Layer` 通常是某种类型的视觉容器，可以用来组织和管理一组相关的游戏元素。
  •  `Layer` 可以添加到 `Scene` 中，一个 `Scene` 可以包含多个 `Layer`，从而实现图层的层次结构。
  •   用法示例：创建游戏界面、UI 图层、特效图层等。

3. Scene（场景）：

  •  `Scene` 是一个可视化的游戏场景容器，用于表示游戏中不同的画面、状态或关卡。
  • 一个 `Scene` 通常由多个 `Layer` 组成，每个 `Layer` 呈现不同的游戏元素。
  • `Scene` 可以管理场景之间的切换，实现从一个画面切换到另一个画面。
  • 用法示例：创建游戏的不同关卡、主菜单、游戏结束画面等。

区别总结：

  • `Sprite` 是游戏中的可见元素，用于表示角色、物体等。
  •  `Layer` 是图层容器，用于组织和呈现游戏元素。
  • `Scene` 是画面容器，用于管理不同画面之间的切换。

通常的开发实践是，一个游戏会有多个 `Scene`，每个 `Scene` 包含多个 `Layer`，而每个 `Layer` 中包含多个 `Sprite`。这样的层次结构可以帮助你有效地组织和管理游戏中的元素。

4.2 setAnchorPoint

`setAnchorPoint` 是 cocos2d-x 中 `Node` 类的成员函数之一，用于设置节点的锚点位置。锚点是节点相对于自身位置的一个点，影响了节点的定位和旋转。

节点的锚点是一个具有两个坐标值（x 和 y）的点，取值范围通常是从 0 到 1，表示节点的宽度和高度的相对比例。

示例用法：

auto sprite = Sprite::create("image.png");
sprite->setPosition(Vec2(200, 200)); // 设置节点的位置

// 设置锚点为节点宽度的中心（x=0.5），高度的底部（y=0）
sprite->setAnchorPoint(Vec2(0.5, 0.0));

this->addChild(sprite);

在上述示例中，`setAnchorPoint` 函数被用来设置精灵节点的锚点位置。在这个例子中，锚点被设置在精灵的底部中心，这意味着节点的位置 `(200, 200)` 将会指向精灵底部中心，而不是默认的左下角。

通过调整锚点，你可以更好地控制节点的旋转、缩放和定位行为。需要注意的是，节点的位置和锚点相互作用，所以改变锚点可能会导致节点的位置发生变化。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/938002.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

【核磁共振成像】部分傅里叶重建

【核磁共振成像】部分傅里叶重建

目录 一、部分傅里叶重建二、部分傅里叶重建算法2.1 填零2.2 零差处理 一、部分傅里叶重建 在部分傅里叶采集中，数据并不是绕K空间中心对称收集的，而是K空间的一半是完全填充的，另一半只收集了一小部分数据。   部分傅里叶采集所依据的原理…
阅读更多...
bindService的调用流程

bindService的调用流程

使用bindService去调用service，如果有多个客户端调用，onBind方法只会被调用一次，由于bindService嗲处理中，AMS是一个中间商，猜测这个处理也是AMS里进行的，这里我们再看看bindService的调用流程 public clas…
阅读更多...
剑指 Offer 19. 正则表达式匹配（C++实现）

剑指 Offer 19. 正则表达式匹配（C++实现）

剑指 Offer 19. 正则表达式匹配https://leetcode.cn/problems/zheng-ze-biao-da-shi-pi-pei-lcof/ 动态规划&#xff1a;通过dp数组剪枝 只需要对各种情况进行分类处理即可 vector<vector<int>> dp;bool helper(const string& s, const int i, const string&am…
阅读更多...
R语言常用数学函数

R语言常用数学函数

目录 1. - * / ^ 2.%/%和%% 3.ceiling,floor,round 4.signif,trunc,zapsamll 5.max,min,mean,pmax,pmin 6.range和sum 7.prod 8.cumsum,cumprod,cummax,cummin 9.sort 10. approx 11.approx fun 12.diff 13.sign 14.var和sd 15.median 16.IQR 17.ave 18.five…
阅读更多...
YOLOv5、YOLOv8改进：NAMAttention注意力机制

YOLOv5、YOLOv8改进：NAMAttention注意力机制

目录 1.简介 2.YOLOv5代码修改 2.1增加以下NAMAttention.yaml文件 2.2common.py配置 2.3yolo.py配置 1.简介 paper:https://arxiv.org/pdf/2111.12419.pdf code:https://github.com/Christian-lyc/NAM 摘要 注意机制是近年来人们普遍关注的研究兴趣之一。它帮助…
阅读更多...
day 28 地图

day 28 地图

from pyecharts.charts import Map from pyecharts.options import VisualMapOpts# 创建一个地图对象 map Map() # 准备数据 data [("北京市", 99),("上海市", 199),("湖南省", 399),("广东省", 499) ] # 添加数据 map map.add(&qu…
阅读更多...
Redis数据结构全解析【万字详解】

Redis数据结构全解析【万字详解】

文章目录 前言一、SDS1、SDS的必要性2、SDS的数据结构3、SDS的优势O&#xff08;1&#xff09;复杂度获取字符串长度二进制安全不会发生缓冲区溢出节省空间 二、链表1、结构设计2、优缺点 三、压缩列表1、结构设计2、连续更新3、压缩列表的缺陷 四、哈希表1、结构设计2、哈希冲…
阅读更多...
Python小知识 - 八大排序算法

Python小知识 - 八大排序算法

八大排序算法 排序算法是计算机科学中非常重要的一个研究领域。排序算法可以分为内部排序和外部排序&#xff0c;内部排序是数据记录在计算机内部&#xff0c;而外部排序是数据记录在计算机外部&#xff0c;这里我们主要讨论内部排序。 内部排序中的算法大致可以归纳为四类&…
阅读更多...
Matlab图像处理-乘法运算

Matlab图像处理-乘法运算

乘法运算 两幅图像进行乘法运算主要实现两个功能&#xff1a; 一是可以实现掩模操作&#xff0c;即屏蔽图像的某些部分&#xff1b; 二是如果一幅图像乘以一个常数因子&#xff0c;如果常数因子大于1&#xff0c;将增强图像的亮度&#xff0c;如果因子小于1则会使图像变暗。…
阅读更多...
day 28 折线图

day 28 折线图

from pyecharts.charts import Line from pyecharts.options import TitleOpts, LabelOpts# 分别打开三哥国家文件 import jsonf_us open("D:/美国.txt", "r", encoding"UTF-8") f_jp open("D:/日本.txt", "r", encoding&…
阅读更多...
OpenCV基础知识（9）— 视频处理（读取并显示摄像头视频、播放视频文件、保存视频文件等）

OpenCV基础知识（9）— 视频处理（读取并显示摄像头视频、播放视频文件、保存视频文件等）

前言&#xff1a;Hello大家好&#xff0c;我是小哥谈。OpenCV不仅能够处理图像&#xff0c;还能够处理视频。视频是由大量的图像构成的&#xff0c;这些图像是以固定的时间间隔从视频中获取的。这样&#xff0c;就能够使用图像处理的方法对这些图像进行处理&#xff0c;进而达到…
阅读更多...
无涯教程-Python机器学习 - Unsupervised Learning函数

无涯教程-Python机器学习 - Unsupervised Learning函数

无监督学习 顾名思义,它与监督式机器学习方法或算法相反,这意味着在无监督的机器学习算法中,我们没有任何监督者可以提供任何类型的指导。在没有监督学习算法那样的自由的情况下,无监督学习算法非常方便,因为在这种情况下我们没有预先标签训练数据,而我们想从输入数据中提取有…
阅读更多...
学信息系统项目管理师第4版系列03_文件与标准

学信息系统项目管理师第4版系列03_文件与标准

审核未通过&#xff0c;删除文件部分&#xff0c;仅保留标准化相关内容&#xff0c;重发 12. 标准化 12.1. 采用国际标准和国外先进标准的程度分为等同采用、修改采用和等效采用 3 种 12.1.1. 【高21上选20】 12.1.2. 采用指与国际标准在技术内容和文本结构上相同,或者与国…
阅读更多...
图的邻接矩阵与邻接表

图的邻接矩阵与邻接表

目录 一、图的概念 二、邻接矩阵 2.1 邻接矩阵存储 2.2 邻接矩阵结构 2.3 构造邻接矩阵 2.4 边的添加 三、邻接表 3.1 邻接矩阵存储 3.2 邻接表结构 3.3 构造邻接表 3.4 边的添加 三、 图的遍历 一、图的相关概念 图是由顶点集合及顶点间的关系组成的一种数据结构&…
阅读更多...
微服务dubbo

微服务dubbo

微服务是一种软件开发架构风格&#xff0c;它将一个应用程序拆分成一组小型、独立的服务&#xff0c;每个服务都可以独立部署、管理和扩展。每个服务都可以通过轻量级的通信机制&#xff08;通常是 HTTP/REST 或消息队列&#xff09;相互通信。微服务架构追求高内聚、低耦合&am…
阅读更多...
Mybatis学习|第一个Mybatis程序

Mybatis学习|第一个Mybatis程序

1.创建一个数据库以及一个用户表&#xff0c;并插入三条数据用来测试 2.创建一个空的maven项目 在pom.xml中导入本次测试用到的三个依赖&#xff0c;mysql驱动、mybatis依赖、以及单元测试junit依赖 将这个 空的maven项目当成一个父项目&#xff0c;再创建一个空的maven子项目用…
阅读更多...
并发编程基础知识篇--进程和线程的区别

并发编程基础知识篇--进程和线程的区别

目录 进程和线程 进程 线程 进程与线程的区别总结 扩展小知识 程序计数器为什么是私有的? 虚拟机栈和本地方法栈为什么是私有的? 简单了解堆和方法区 多进程和多线程区别 Java中的多线程 进程和线程 进程 在一个操作系统中&#xff0c;每个独立执行的程序都可称之…
阅读更多...
Linux操作系统--shell编程(运算符)

Linux操作系统--shell编程(运算符)

语法: "$((运算式))" 或 "$[运算式]" 下面我们介绍几种Linux操作系统中的运算符的使用方式: 方式1:这一个使用比较麻烦，不推荐使用 方式2:推荐使用
阅读更多...
软考A计划-系统集成项目管理工程师-小抄手册(共25章节)-中

软考A计划-系统集成项目管理工程师-小抄手册(共25章节)-中

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例点击跳转>软考全系列点击跳转>蓝桥系列 &#x1f449;关于作者 专注于Android/Unity和各种游…
阅读更多...
BUUCTF [SWPU2019]Web1

BUUCTF [SWPU2019]Web1

​ 这是一道sql二次注入题目&#xff0c;但是注入点并不在登录处 注册一个用户然后登录 广告申请处进行sql注入 你会发现过滤了很多关键字 空格#information等等 这里用到了一些绕过技巧 使用 /**/ 代替空格 union/**/select/**/1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,1…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023