Single-Header Arabic Text Renderer Shaping Engine for axmol/cocos2dx in C++

• Put the ShapingEngine.hpp file anywhere in your c++ project.
• Include the ShapingEngine.hpp file and everything will be under ShapingEngine Namespace
• There are arabic fonts you can try in the arabic-fonts folder
• There are also pixel art fonts!

• Create a new std::wstring object containing utf16 text.
• Call the function ShapingEngine::render(your_wstring), a narrowed std::string will be returned that displays arabic letters correctly with the correct vowels too!

std::wstring str = L"السَلامُ عَليكُمْ ورَحْمَةُ اللّهِ وبَركَاتُهْ";
auto label = Label::createWithTTF(ShapingEngine::render(str, false), "bitsy-font-with-arabic.ttf", 20);

• Without using ShapingEngine::render():

  

• Using ✨ ShapingEngine::render() ✨ :

  

• The second optinal parameter in ShapingEngine::render() is called render_with_symbols which simply treats the charachters ".,<>(){}[]~!@#$%^&*?"':;\" as arabic characters, this makes it easier to write arabic text inside parantheses, number ordering, and so much more!

• render_with_symbols set to false

  

• render_with_symbols set to true

  

• You can also try other fonts! like this pixel art font:

  

• All these cool fonts and more are in the arabic-fonts folder in this repo, Enjoy! :D

• This also supports mixed languages (english and arabic) and also newlines!

  

  

• You can make pixel art fonts look crespier by calling label->getFontAtlas()->setAliasTexParameters();

  

• If you want to render multiline arabic text or text that contains numbers you need to use the ShapingEngine::render_wrap(), NOTE: for multilines unfortunetly it doesn't work with setDimension and overflow texts in general, that's why render_wrap needs to be used.

label = Label::createWithTTF("", "bitsy-font-with-arabic.ttf", 20);
label->setVerticalAlignment(TextVAlignment::TOP);
label->setHorizontalAlignment(TextHAlignment::RIGHT);
label->getFontAtlas()->setAliasTexParameters();
label->setColor(Color3B(255, 255, 255));


std::wstring str = L"هذا نص طويل جدًا لن يقرأه أحد ويركز عليه ، ويستخدم بشكل أساسي للاختبار ، النص لا يزال مستمراً ... سأقوم بالعد تنازلياً 3 2 1";
std::string arText = ShapingEngine::render_wrap(label->getTTFConfig(), str, true, 340);

• The first parameter for render_wrap is a ttf config object coming from a label, this gives the function the ability to tell what glyphs have what size and how to wrap multilines accordingly.

• seond parameter is your favourite string!

• third is whether to use symbols or not.

• and fourth is for horizontal wrap size in pixels, this will make sure that the text never exceeds that, if it does then it moves the rest to a new line and so on.

• This is a text rendered in multilines:

  

• Notice how the numbers are in correct order! (In the text, I said I would do a count down in arabic)

• If you want arabic numbers (١ ٢ ٣ ٤ ٥ ٦ ٧ ٨ ٩ ١٠) you can call the ShapingEngine::arabify_numbers();

label->setString(ShapingEngine::arabify_numbers(arText));

• Text Scrolling, Unfortunately std::string.substr doesn't work with arabic text but ShapingEngine::substr() can be used instead, This is different from your typical substr because it scrolls from right to left (not left to right like std::string.substr does)

void HelloWorld::update(float dt)
{
    auto str1 = ShapingEngine::substr(arText, (int)currentIndex++);
    label->setString(ShapingEngine::arabify_numbers(str1));
}

• Contribute and add your own language! or you can improve upon this implmentation, greatly appreciated.

• If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue. Don't forget to give the project a star! Thanks again!

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)