在GitHub MyGame clone 代码,添加到配置并新建好的工程中运行下来就可以看到这个画面:


中间的小点是显示的当前触摸点,本文暂不讨论。图中的蓝天是蓝色的 LayerColor

this->addChild( LayerColor::create( Color4B( 182, 228, 254, 255 ) ) );

云和山都是用 DrawNode 画的。

云的组合很简单,画四个圆调整好大小位置就可以做出不错的效果,调整下大小,位置就可以了

	Color4F color = Color4F( 0.929f, 0.972f, 1.0f, 1.0f );
auto circle = DrawNode::create( );
circle->drawSolidCircle( Vec2::ZERO, 60.0f, 0.0f, 24, color );
circle->setPosition( 0, 0 );
auto circle1 = DrawNode::create( );
circle1->drawSolidCircle( Vec2::ZERO, 35.0f, 0.0f, 24, color );
circle1->setPosition( 50, -15 );
auto circle2 = DrawNode::create( );
circle2->drawSolidCircle( Vec2::ZERO, 40.0f, 0.0f, 24, color );
circle2->setPosition( -50, -10 );
auto circle3 = DrawNode::create( );
circle3->drawSolidCircle( Vec2::ZERO, 25.0f, 0.0f, 24, color );
circle3->setPosition( -80, -22 ); auto cloud = Node::create( );
cloud->addChild( circle3 );
cloud->addChild( circle2 );
cloud->addChild( circle1 );
cloud->addChild( circle );
return cloud;

山的画法相对来说有点复杂,不过实际上用的是画多边形,其实圆也是用多边形画的,边多也看起来也就像圆了,上边画的每个圆都用24条边画的。

山和云一样多个多边形叠加,不同的多边形画不同的颜色,看起来有层次

山还有一点不同的是:山的数据保存在XML文件中,需要读取和处理后才能画,

class DrawSp :public DrawNode
{ public:
bool init( );
void drawVectArr( VectArr * va );
void drawVectArrBt( VectArr * va);
void drawSolidVectArr( VectArr * va );
void drawSolidVectArrBt( VectArr * va );
//void drawBezier( const Bezier & bz, const Color4F & color, int seg = 30 ); void drawRoad( const Vec2 * vec, unsigned int seg,
const Vec2 & offset, const Color4F & color ); CREATE_FUNC( DrawSp );
protected:
DrawSp( );
~DrawSp( ); private: };

对DrawNode 扩展了几个函数,实际上只是为了更方便的用自定义数据类(VectArr)去画多边形

结合自定义的数据快捷的画出一座山:

bool BgLayer::init( )
{
if( !Node::init( ) )
{
return false;
}
auto vsize = _director->getVisibleSize( );
auto lines = _lineLayer->getLines( ); auto arr = new VectArr*[ lines.size( )];
for( int i = 0; i < lines.size( ); i++ )
{
lines[ i ] *= vsize;
arr[ i ] = new VectArr( lines[ i ] );
}
arr[ 0 ]->stichingToBottom( );
auto d = DrawSp::create( );
d->drawSolidVectArrBt( arr[ 0 ] );
this->addChild( d );
for( int i = 1; i < lines.size( ); i++ )
{
auto l = arr[ 0 ]->stiching( arr[ i ] );
l->stichingToBottom( );
auto dl = DrawSp::create( );
dl->drawSolidVectArrBt( l );
this->addChild( dl );
} return true;
}

再画一座加上去和背景就最上面的背景图了:

背景就先说到这里,牵扯到其他的太多了,哎~~

My Game --背景的更多相关文章

  1. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  2. 冒泡,setinterval,背景图的div绑定事件,匿名函数问题

    1.会冒泡到兄弟元素么? $(function(){ $("#a").click(function(){alert("a")}) $("#b" ...

  3. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  4. CSS 3学习——box-sizing和背景

    box-sizing 在CSS 2中设置元素的width和height仅仅是设置了元素内容区的宽和高,元素实际的尺寸是margin + border + padding + 内容区. CSS 3(截止 ...

  5. .NET同步与异步之相关背景知识(六)

    在之前的五篇随笔中,已经介绍了.NET 类库中实现并行的常见方式及其基本用法,当然.这些基本用法远远不能覆盖所有,也只能作为一个引子出现在这里.以下是前五篇随笔的目录: .NET 同步与异步之封装成T ...

  6. Android—ListView条目背景为图片时,条目间距问题解决

    ListView是android开发中使用最普遍的控件了,可有的listView条目的内容颇为丰富,甚至为了美观,背景用指定图片,如下图:

  7. 在rem布局下使用背景图片以及sprite

    现在移动端页面用rem布局已经是一大流派了,成熟的框架如淘宝的flexiable.js,以及我的好友@墨尘写的更轻量级的hotcss.用rem作单位使得元素能够自适应后,还有一块需要关注的,那就是背景 ...

  8. Atitit 动态按钮图片背景颜色与文字组合解决方案

    Atitit 动态按钮图片背景颜色与文字组合解决方案 转换背景颜色,setFont("cywe_img", fontScale, 50, 5) 设置文字大小与坐标 文字分拆,使用字 ...

  9. 日常css技巧小结(1)--背景透明度改变对内容无影响

    刚开始出现的错误,内容会受到背景透明度改变的影响:如图: 代码: <!DOCTYPE html> <html lang="en"> <head> ...

  10. C# 给PDF添加图片背景

    C# 给PDF添加图片背景 今天要实现的是给PDF文件添加图片背景这个功能.PDF是近年来最流行的文件之一,无论是办公还是日常生活中都经常会用到,很多时候,PDF文件的背景色都是白色,看多了难免觉得累 ...

随机推荐

  1. Mssql Server如何修改列名

    exec sp_rename '表明.原列名','新列名','column';

  2. SQL 四种基本数据操作语句的基本使用

    SQL中含有四种基本的数据操作语句,分别是增(INSERT),删(DELETE),查(SELECT),改(UPDATE).下面简单介绍这四种语句的用法. 1:增(INSERT) 可分为两种查询情况,一 ...

  3. MVC模型的理解

  4. ClippingNode实现新手引导高亮裁切

    ClippingNode的使用 概述 ClippingNode(裁剪节点)可以用来对节点进行裁剪,可以根据一个模板切割图片的节点,生成任何形状的节点显示. ClippingNode是Node的子类,可 ...

  5. [课程设计]Sprint Two 回顾与总结&发表评论&团队贡献分

    [课程设计]Sprint Two 回顾与总结&发表评论&团队贡献分 ● 一.回顾与总结 (1)回顾 燃尽图: Sprint计划-流程图: milestones完成情况如下: (2)总结 ...

  6. Worker Thread

    http://www.codeproject.com/Articles/552/Using-Worker-Threads Introduction Worker threads are an eleg ...

  7. 【20160924】GOCVHelper MFC增强算法(4)

    //string替换     void string_replace(string & strBig, const string & strsrc, const string & ...

  8. JAVA线程同步辅助类Exchanger-交换

    可以在对中对元素进行配对和交换的线程的同步点.每个线程将条目上的某个方法呈现给 exchange 方法,与伙伴线程进行匹配,并且在返回时接收其伙伴的对象.Exchanger 可能被视为 Synchro ...

  9. Javascript 学习

    title: Javascript tags: javascript,学习 grammar_cjkRuby: true --- 定义变量 三种形式 var name; var name = " ...

  10. uploadify springMVC

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...