Cocos2d-JS 3.1 custom font and image pvr.ccz problem

cocos2d-x JavaScript
#1

Hi,

Currently, i coding the project with the Cocos Code IDE 1.0.1 and Cocos2d-JS 3.1.

Does Cocos2d-JS 3.1 support custom font in Mac?

And the browser version support using spriteFrame with encrypted pvr.ccz extension by texture packer?

var testLabel = new cc.LabelTTF("Custom Font", "FontName", 38);

cc.spriteFrameCache.addSpriteFrames(PlistName);
 var testSprite = cc.Sprite.createWithSpriteFrameName('test.png');

For the testLabel, the custom font work when run in browser, but not the Mac Runtime.

For the testSprite, the sprite showing properly in Mac Runtime with or without encryption, but the browser not showing the sprite at all.

Thanks,
Zinitter

#2
  1. Have you import the custom ttf font file in your project ? And how ?
  2. AFAIK, the pvr.ccz is not supported on Web
  3. To create a sprite with a frame name, you should use this: var testSprite = new cc.Sprite('#test.png'). Adding a ‘#’ before the sprite frame name is important
  4. The unencrypted plist file should work correctly on Web, but have you preload those files ? both plist and png
#3

@pandamicro

Thanks for your fast reply.

For the custom ttf, i added this in default var res of resource.js

 Custom_font : {type:"font", name:"CustomName", srcs:["res/CustomName.ttf"]}

Then create the label with

var testLabel = new cc.LabelTTF("Custom Font", "CustomName", 38);

The custom font is working on browser, but not the Mac runtime.
The Mac runtime showing the label with default font which looks like “Arial”

Thanks for the remind of adding ‘#’ in the sprite frame name.
I’m testing the sprite with pvr.ccz extension because it support encryption.

As you said pvr.ccz is not supported on web, so i create the image with png extension

I preload the plist and image with

cc.spriteFrameCache.addSpriteFrames(plistName, imageName);

Create the sprite with

var testSprite = new cc.Sprite("#test.png");

The sprite still working only on Mac Runtime but not browser.

With the ‘#’ in image name, Mac Runtime run properly, without ‘#’ it crashed.
With the ‘#’ in image name, Browser cant run at all, without ‘#’ it run without showing the sprite.

Should i use single quote ‘’ or double quote “” for the name?

Can you suggest solution to protect the resources with encryption?

Thanks,
Zinitter

#4

  1. About Mac TTF Font, you need to add entries for your CustomName.ttf in Fonts provided by application array in info.plist

So what’s the error ?

It’s irrelevant in JavaScript

Sorry, I can’t say I have a real solution

#5

After testing with reduce case, found solution.

  1. The custom font needed to be installed on Mac in order to working in the Mac Debug.

  2. With ‘#’ in image name, it just not working properly, so just don’t use ‘#’ in the image name.

  3. For the CCSprite, i have to addSpriteFrames and get the frame then create the ccsprite with the frame

     cc.spriteFrameCache.addSpriteFrames(res.plistName, res.pngName);
 var frame = cc.spriteFrameCache.getSpriteFrame("test.png");
 var sprite = new cc.Sprite(frame);

Thanks for your help and info.