HTML5游戏制作之路_06_egret文本及相关属性

原创 2015年11月19日 21:50:59

一.创建文本

显示结果:

二.添加一些属性

三.绘制矩形并添加文字描边

/**
 * Created by 13641 on 2015/11/19.
 */
class Texttest extends egret.DisplayObjectContainer{

    public constructor() {
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.mainFunc, this);
    }

    private mainFunc():void{
        this.TextDisplay();
    }

    private TextDisplay():void{

        //绘制图形
        var shape:egret.Shape = new egret.Shape();
        //指定绘制颜色
        shape.graphics.beginFill(0xFF0000);
        shape.graphics.drawRect(0,0,400,400);
        shape.graphics.endFill();
        this.addChild(shape);


        var lable:egret.TextField = new egret.TextField();
        lable.text = "总有刁民想害朕";
        //描边的颜色
        lable.strokeColor = 0x0000ff;
        //描边的宽度
        lable.stroke = 2;
        lable.x = 120;
        lable.y = 150;
        this.addChild(lable);
    }
}

效果:


四.设置文字粗体(这个属性不能单独改某个文字,只能改全篇)

/**
 * Created by 13641 on 2015/11/19.
 */
class Texttest extends egret.DisplayObjectContainer{

    public constructor() {
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.mainFunc, this);
    }

    private mainFunc():void{
        this.TextDisplay();
    }

    private TextDisplay():void{

        //绘制图形
        var shape:egret.Shape = new egret.Shape();
        //指定绘制颜色
        shape.graphics.beginFill(0xFF0000);
        shape.graphics.drawRect(0,0,400,400);
        shape.graphics.endFill();
        this.addChild(shape);


        var lable:egret.TextField = new egret.TextField();
        lable.text = "总有刁民想害朕";
        lable.width = 400;
        lable.height = 400;
        //水平对其
        lable.textAlign = egret.HorizontalAlign.CENTER;
        lable.verticalAlign = egret.VerticalAlign.MIDDLE;
        //粗体
        lable.bold = true;
        //斜体
        lable.italic = true;
        this.addChild(lable);
    }
}

效果:


五.文本对齐

设置文本宽高,注意要放在显示代码之前。

六.指定文本的字体

1.

/**
 * Created by 13641 on 2015/11/19.
 */
class Texttest extends egret.DisplayObjectContainer{

    public constructor() {
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.mainFunc, this);
    }

    private mainFunc():void{
        this.TextDisplay();
    }

    private TextDisplay():void{

        //绘制图形
        var shape:egret.Shape = new egret.Shape();
        //指定绘制颜色
        shape.graphics.beginFill(0xFF0000);
        shape.graphics.drawRect(0,0,400,400);
        shape.graphics.endFill();
        this.addChild(shape);


        var lable:egret.TextField = new egret.TextField();
        lable.text = "总有刁民想害朕,总有刁民想害朕";
        lable.fontFamily = "KaiTi";
        this.addChild(lable);
    }
}


2.位图文本:自定义字体。

1)将fnt和png放在asset文件夹下

同样还是利用json和RES来加载,没什么意思了。

注意json里面的type为font


版权声明:本文为博主原创文章,未经博主允许不得转载。

HTML5游戏制作之路_06_egret关于精灵表单spritesheet

/* 采用位图的版本:2.5 采用的编辑器webstrom */ 精灵表单就是将很多图片合成在一张图片中,然后 我们可以获取其中的任何一张图,这样做可以加快游戏的图片加载,类似于unity‘中的图集,...

java工程师走向前端学习心路历程(二)

no.3、温故而知新——HTML布局篇  第一篇中写了一些java工程师需要兼顾做前端开发需要准备的工具、知识库,并且分享了一个实例。这也是我在学习过程中亲身经历的一些东西,希望对大家有用!前期...

HTML5游戏制作之路_07_egret的声音播放的三种方式

/* 我目前使用的版本是egret2.5 */ egret支持的声音格式是mp3.获取资源的方式和之前的一样。 1. 使用URLLoader方式加载 /** * 这是使用URL方法加载...

HTML5游戏制作之路_08_egret对于声音的控制

/* egret版本:2.5 */ 一.点击发声 /** * 这是使用RES方法加载。 * Created by 13641 on 2015/11/19. */ class So...

HTML5游戏制作之路_03_egret的资源加载机制

/* 前一篇的链接: 使用的egret版本为2.5 */ h5支持矢量图(目测),自带的那个例子可以自由缩放,可以自适应(这让我很爽)。在egret里面叫bitmap(位图)实际上这个名称并不...

HTML5游戏制作之路_01_白鹭引擎&&相关必要的配置安装&&创建第一个H5项目

/* html5相关的信息我都不想说了,没写过网页,新接触,搞游戏直接从引擎入手吧,也有兴趣,以后有机会慢慢往底层走。 */ 一. 白鹭引擎官网:http://www.egret-labs.org/ ...

HTML5游戏制作之路_04_来做个动画吧

/* 使用的egret版本:2.5 编辑器采用webstrom */ 通过上一篇03成功可以加载资源,这一篇我们在上一篇的基础上,通过位图来搞一个动画。 如果想参看注释请回到上一篇。 直接...

HTML5游戏制作之路_09_2D骨骼动画工具DragonBone

/* 我目前使用的egret版本为2.5 */ DragonBone是制作动画或骨骼动画的工具,具体使用教程地址:DragonBone 很简单很暴力,省去了大量的时间。 我在这里主要介绍如何使用Dra...

HTML5游戏制作之路_02_剖析项目目录结构&&在浏览器中输出helloworld

/* 上一篇:h5游戏制作之路1 声明: 使用的egret游戏引擎版本为2.5. 编辑器用的webstrom */ 复习一下新建一个工程: 1.打开node.js的cmd 2....

零基础HTML5游戏制作教程 第1章

HTML一直是网络编程的基石,其他任何编程语言,不论是PHP、Phython、CSS还是JavaScript,都必须以HTML为基础。 上一代的标准,HTML4.01在1999年制定之后,统治互联...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:HTML5游戏制作之路_06_egret文本及相关属性
举报原因:
原因补充:

(最多只允许输入30个字)