美文网首页
cocos2dx 3.x 公告栏 通知栏 滚动字幕 区域弹幕 区

cocos2dx 3.x 公告栏 通知栏 滚动字幕 区域弹幕 区

作者: 程序猿老D | 来源:发表于2016-12-07 10:14 被阅读0次

本文介绍游戏中常见的滚动播放的公告栏实现

要点

  • 文字内容横向或者纵向滚动
  • 文字只在区域内显示,超出区域部分不显示

相关头文件

** "2d/CCClippingNode.h" **
注意:在cocos2dx 3.x版本中,方法名中的CC命名方式已经弃用,但是文件名中的CC依然有,所以此处的头文件名中的CC打头无法去除

实现

头文件

#pragma once
#include "cocos2d.h"
#include "2d/CCClippingNode.h"
USING_NS_CC;

class PannelNews :public Node
{
protected:
  Node* _holder;
  Sprite* _newsBg;
  Label* _news;
  DrawNode* _shap;
  ClippingNode* _cliper;

public:
  PannelNews();
  ~PannelNews();
  virtual bool init() override;

  void layout();
  void scrollText(float);

  CREATE_FUNC(PannelNews);
};

源文件

#include "PannelNews.h"

PannelNews::PannelNews()
{
  _holder = NULL;
  _newsBg = NULL;
  _news = NULL;
  _shap = NULL;
  _cliper = NULL;
}

PannelNews::~PannelNews() {}

bool PannelNews::init()
{
  if (!Node::init())
    return false;
  setPosition(Point(640.f, 585.f));
  _holder = Node::create();
  addChild(_holder);
  _newsBg = Sprite::create("newsBg.png");
  _holder->addChild(_newsBg);

  _shap = DrawNode::create();
  Point point[4] = { Point(60.f,0.f), Point(710.f,0.f), Point(710.f,35.f),   Point(60.f,35.f)};
  //标记显示的矩形区域

  _shap->drawPolygon(point, 4, Color4F(355, 255, 255, 255), 2, Color4F(255, 255, 255, 255));
  //剪切用于显示的矩形区域,参数对应:用于标识区域的Point(Vec2)数组指针,数组长度,填充颜色,边框宽度,边框颜色
  _cliper = ClippingNode::create();
  _cliper->setStencil(_shap);
  _cliper->setAnchorPoint(Point(0.5, 0.5));
  _newsBg->addChild(_cliper);

  _news = Label::createWithSystemFont(UserDefault::getInstance()->getStringForKey(KEY_LOCAL_NEWS, "公告内容"), "Microsoft Yahei", 24);
  _news->setColor(Color3B(214, 213, 213));
  _cliper->addChild(_news);

  layout();
  return true;
}

void PannelNews::layout()
{
 _news->setAnchorPoint(Point::ZERO);
 _news->setPosition(Point(720, 10));//设置公告文字内容的初始位置
 schedule(schedule_selector(PannelNews::scrollText));//实现公告文字滚动
}

void PannelNews::scrollText(float)
{
 _news->getPosition().x < (-1 * _news->getContentSize().width) ? _news->setPositionX(720) : _news->setPositionX(_news->getPositionX() - 2);
}
  • ClippingNode可以用于设定一个区域作为其显示区域,其子节点只可在该区域内才可显示,超出区域部分则无法显示,可用于公告、通知、聊天框、区域弹幕、弹幕游戏的保护罩等

相关文章

  • cocos2dx 3.x 公告栏 通知栏 滚动字幕 区域弹幕 区

    本文介绍游戏中常见的滚动播放的公告栏实现 要点 文字内容横向或者纵向滚动 文字只在区域内显示,超出区域部分不显示 ...

  • 滚动的公告栏

    作者博客:漂小泊的博客作者主站:小泊随記原文地址:文章地址 因为心无所恃,所以才随遇而安​​。​ 标签源码 在小泊...

  • 滚动的公告栏

    显示一条条信息向上滚动,直接贴代码 html js

  • Android 滚动的公告栏

    实现的效果:是一个滚动的公告栏,是这样的: 可以看到这个公告栏一方面是滚动,另外一方面是可点击。 实现的思路:1....

  • clientY,offsetY,screenY/layerY,p

    1.clientY鼠标在页面可视区域(不包括工具栏和滚动条)的位置。如果有滚动条,以滚动到的位置的可视区的左上角为...

  • 不断向上滚动的公告栏

    不知道该如何控制TextView的 TextSize 和TextView大小用inflate 填充xml布局?求大...

  • 跑马灯效果/发文公告栏滚动

    一、想要得到的效果: 数据在公告栏处由右向左滚动,如图: 二、解决思路: 第一次使用的标签来实现数据滚动的,但是兼...

  • 我爱三六班(2)为姨妈捡纸

    校园右边的草坪边竖着一块公告栏,学校各种通知,表扬或批评都张贴在这里。公告栏是师生关注的焦点,今天那儿又里三层外三...

  • [前端]css3 transition实现顶部滚动公告栏/通知

    最近需要做一个顶部的滚动栏。内容向上滚动。 大概的原理,是让整个列表的margin-top从0再不断的减小,直到第...

  • 公告栏

    浏览量: 3281 您的账号已授权!,欢迎登录《3D转料区》走势图。。。 0 0 0 0 0 18A01119.5...

网友评论

      本文标题:cocos2dx 3.x 公告栏 通知栏 滚动字幕 区域弹幕 区

      本文链接:https://www.haomeiwen.com/subject/vkjdmttx.html