Text styles and line spacing [feature]

[hsdk123]

Hi, I currently notice that cocos2d-html5 doesn't offer any ability to set text styles: bold, italic, etc. and the pixel height of spacing between text lines.

Bold effect is something I can somewhat replicate through Label's stroke property,
but line spacing can't be achieved currently unless I manually take apart strings and hard place each of them.

It would be great if line spacing (vertical space between lines) for label text could be set as a property through code.

An issue here was created back in Februrary asking for similar features, and was given the reply that it would be implemented after March. It's currently almost August - it would be great if this could be done by the cocos2d-html5 team.

[dingpinglv]

Hi @hsdk123,

It's easy to implement on Web(H5), but we need to consider to compatible JSB, so we're indecision.

We'll implement these feature on Web soon, I'll send the notice to you if we have finished.
Here is the task on our issue system: http://www.cocos2d-x.org/issues/5761

Thanks for feedback.
David

[hsdk123]

@dingpinglv Thanks for the reply,

Good to know this is on your list. Hope to see this soon!

[hsdk123]

@dingpinglv Hi, it's almost 3 months since I started this thread, and 8 months since the original thread - how are things going? This is the main bottleneck of my project at the moment.

If this is easy to implement on the web, but not on JSB, why don't you add the function on the web version and label it as incompatible with JSB? I feel that's much more appropriate than just pushing features to a later unknown date.

[pandamicro]

@hsdk123 I'm really sorry about the delay. As you may know, Cocos2d-html5 have been merged to Cocos2d-JS, and for more than half a year, we have been focus on it. And the main goal of 3.1 is our new renderer. It wasn't an excuse and I'm truly sorry that we haven't found time to improve the Label API. I will add a feature request for 3.2, and I think it's an important feature.

Or would you mind to do it yourself temporarily if I can give you a possible implementation suggestion ?

[hsdk123]

@pandamicro Thanks for the reply, the current estimated public release date of the project I'm currently developing is late November - I'll wait a while for an official implementation. I just wanted the team to know that this is a feature that people really care about, and have interest in.

[hsdk123]

@dingpinglv @pandamicro Hi, I've noticed the 3.1 release post on the official blog - congrats! It's also passed into November, just wondering how work is going on this.

[dingpinglv]

Hi @hsdk123 ,
we have committed a pull request to support line height : #2444
please update the labelTTF and try to use setLineHeight function.

Sorry for reply late
David

[hsdk123]

@dingpinglv Thanks for all the work, this is looking absolutely great!
Now all I need is bold and italics (or just bold if italics would take too much time) and I should be done!

[hsdk123]

@dingpinglv Hi, it's been about half a year and I was just wondering how the bold / italics implementation is progressing (just bold if italics is taking too long a time). My main aim is to create a bold labelTTF that also can have an outline around it.

[dingpinglv]

Hi @hsdk123 ,

I have a question about the bold/italics: do you want to use these feature on Web platform?

I have asked the -x team about this, they said that it's too difficult to implement on every platform(iOS, android, other).

If you want to use these only on web platform, we can give you some private function to implement.
But if the answer is no, I have no idea to that.

So sorry.
David

[hsdk123]

@dingpinglv Thanks for looking into this - I'm fine if this can be implemented just on Web. I'm currently going in the cordova / Node-Webkit route. If there's some private function I can implement, please let me know : b

[dingpinglv]

OK. We'll implement it soon.

[dingpinglv]

Hi @hsdk123 ,

We added _setFontStyle and _setFontWeight to cc.LabelTTF, usage:

aLabel._setFontStyle("italic");
aLabel._setFontWeight("bold");

screenshot:

[hsdk123]

@dingpinglv Thanks - this really looks great : b