文档章节

UI系统-版本1

梦想游戏人
 梦想游戏人
发布于 2017/05/12 15:33
字数 434
阅读 37
收藏 0

cocos2dx 3.10版本提供了 cocos studio 界面导出到lua,还提供了一套基本的MVC框架。

再次基础上改进代码,实现以下功能

1.无需手动填写 RESOURCE_BINDING 的内容,

2.Button 自动根据ui名字绑定到 函数名,比如 btnClose,的单击会被绑定到函数 ui_btnCloseClicked,这样,只需要在cocostudio重命名,然后lua在脚本添加函数ui_btnCloseClicked 即可。

3.ui的元素自动绑定到table成员,比如有个txtTips,lua脚本,里面使用直接self.ui.txtTips:setString("11");,方便快速开发

 

eg:添加一个新按钮流程

cocostudio 添加一个按钮名字为btnNew,导出资源为lua格式

MainScene.lua添加函数 ui_btnNewClicked ,即为点击事件回调

 

重构后的代码

MainScene.lua


local t = class("MainScene", cc.load("mvc").ViewBase)

t.RESOURCE_FILENAME = "res/MainScene.lua"
t.RESOURCE_BINDING =
{
    -- ["Button_1"]={["varname"]="Button_1",["events"]={{["event"]="touch",["method"]="onBtnTouch"}}},
    --  ["Text_1"] = {["varname"] = "txt_info"},
    -- ["Panel"] = {["varname"] = "Panel"},
};

function t:onCreate()
    printf("resource node = %s", tostring(self:getResourceNode()))
end

function t:ui_btnCloseClicked()
    print("  close");
end

function t:ui_btnSendClicked()
    print("  send");
    self.counter =(self.counter and self.counter + 1) or 0;
    self.ui.txtInfo:setString("12344 " .. self.counter);
end

function t:ui_Panel_Panel2_btnShowClicked()
    print("  pp show");
end

function t:ui_Panel_btnShowClicked()
    print("show   " .. self.counter);
end

return t

 

ViewBase.lua


function ViewBase:ctor(app, name)
    self:enableNodeEvents()
    self.app_ = app
    self.name_ = name

    -- check CSB resource file
    local res = rawget(self.class, "RESOURCE_FILENAME")
    if res then
        self:createResoueceNode(res)
    end

    local binding = rawget(self.class, "RESOURCE_BINDING")
    if res and binding then
        self:createResoueceBinding(binding)
    end

    if self.onCreate then self:onCreate() end
    self.ui = { };
    self.ui.root = self.resourceNode_;
    self:autoBind(self.resourceNode_);
end

function ViewBase:getFullParentName(node)
    local parent = "";
    if node and node ~= self.ui.root then
        local tmp = node;
        while tmp:getParent() ~= self.ui.root do
            parent = tmp:getParent():getName() .. "_" .. parent;
            tmp = tmp:getParent();
        end
    end
    return parent;
end

function ViewBase:autoBind(node)
    for _, v in pairs(node:getChildren()) do
        print(v:getName());
        local node_name = v:getName();

        if string.find(node_name, "btn") then
            -- bind button
            v:onTouch( function(e)
                if e.name == "ended" then
                    local name = self:getFullParentName(v) .. node_name .. "Clicked";
                    local cb = self["ui_" .. name];
                    if cb then
                        cb(self);
                    else
                    end

                end
            end );
        end
        self.ui[self:getFullParentName(v) .. node_name] = v;
        -- bind var
        self:autoBind(v);
        -- bind child
    end
end

 

 

© 著作权归作者所有

共有 人打赏支持
梦想游戏人
粉丝 35
博文 436
码字总数 124021
作品 0
成都
私信 提问
笔记53 | 管理系统UI(一)

淡化状态栏和系统栏 如果要淡化状态和通知栏,在版本为4.0以上的Android系统上,你可以像如下使用这个标签。 一旦用户触摸到了状态栏或者是系统栏,这个标签就会被清除,使系统栏重新显现(无...

项勇
2017/12/19
0
0
客户要求项目9月中旬完成,也就再有一个月的时间,

客户要求项目9月中旬完成,也就再有一个月的时间, 我提议: 1.细化系统的功能模块,制定开发进度计划,分配开发任务 2.电商后台管理UI 就使用现有的,我们先实现前端UI界面和微信界面 3.现在...

魏江龙
2015/08/11
0
0
会议纪要PM-06.30.2015

主要内容: 一、关于620版本: 620版本目标未达成,4个系统的UI没换,程序也还没开发,怪物AI、竞技场规则、自动战斗等还没修复,缺少执行与反馈,美术进展慢。 二、720版本目标: 完成度较高...

索亚之息
2015/07/01
1
0
会议纪要-04.24.2015

祁博: 01.装备,今日完成 凯庆: 01.背包,今日完成 02.商店UI 雷鹏: 01.推图界面 国雄: 01.调数据,收尾工作 艳明: 01.英雄召唤协议修改 晓秋: 01.召唤数值 徐刚: 01.好友系统细化 光...

索亚之息
2015/04/24
0
0
centos 6 下pinpoint搭建

Centos 6 Pinpoint 环境搭建 一安装jdk1.6、1.7、1.8 备注:在安装过程中发现,最新的pinpoint 1.5.2与最新的JDK1.8好像不兼容,所以设置系统环境变量和jre用jdk1.7,pinpoint安装1.5.1版本,...

孤单一吻灬
2016/01/06
2.9K
9

没有更多内容

加载失败,请刷新页面

加载更多

中国龙-扬科
23分钟前
2
0
使用vuex的state状态对象的5种方式

vuex是一个专门为vue.js设计的状态管理模式,并且也可以使用devtools进行调试。 下面给大家来贴一下我的vuex的结构 下面是store文件夹下的state.js和index.js内容 //state.jsconst state =...

peakedness丶
26分钟前
1
0
NetCore MVC Demo

地址:http://114.116.9.72:5411

whltian
34分钟前
1
0
Netty handle方法周期 (四)

写了一个练习之后,发现自定义的助手类每次肯定是必须的,对于不同的业务逻辑需求,会写相对应的逻辑 最简单的查看Handle生命周期的方式,就是重写上级方法,看名字差不多应该可以知道方法的作用 ...

_大侠__
38分钟前
7
0
vue主动刷新页面及列表数据删除后的刷新实例

1.场景 在处理列表时,常常有删除一条数据或者新增数据之后需要重新刷新当前页面的需求。 2.遇到的问题 1. 用vue-router重新路由到当前页面,页面是不进行刷新的 2.采用window.reload(),或者...

前端小攻略
49分钟前
13
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部