Skip to content

Single-Header Arabic Text Renderer Shaping Engine for axmol/cocos2dx in C++ || Renders arabic text with numbers, vowels, multiline & scrolling!

License

Notifications You must be signed in to change notification settings

DelinWorks/arabic-text-renderer-cpp-axmol

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

43 Commits
 
 
 
 
 
 
 
 

Repository files navigation

arabic text renderer

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

Getting Started

Installation

  • 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!

Usage

  • 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!

Example

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

    image

  • Using ✨ ShapingEngine::render() ✨ :

    image

  • 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

    image

  • render_with_symbols set to true

    image

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

    image

  • 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!

    image

    image

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

    image

  • 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:

    image

  • 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));

image

  • 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));
}

ezgif com-video-to-gif (1)

Contributing

  • 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!

License

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

(back to top)

About

Single-Header Arabic Text Renderer Shaping Engine for axmol/cocos2dx in C++ || Renders arabic text with numbers, vowels, multiline & scrolling!

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages