[Hanjiang Guye の Cocos2d-x Journey_33]RichTextEx は、HTML タグを通じてテキスト スタイルを制御するリッチ テキスト コントロールです_html/css_WEB-ITnose

RichTextEx は、HTML タグを通じてテキスト スタイルを制御するリッチ テキスト コントロールです

ブログ アドレス:

ダウンロード アドレス

Github リンク

これは何をしますか

次のテキスト コンテンツを変更します
"<#F37C2A>【世】<#3AB5B3>Hanjiang Guye<#F8F4D7>:HelloWorld"
画像に示されているスタイルでリッチテキストを生成します ( 画像とフラッシュをサポート、回転やその他のカスタマイズされたエフェクトとコントロール)

それについて

これは LUA バージョンです。CPP バージョンはまだ書かれていません。CPP バージョンと JS バージョンの移植を歓迎します
LUA ファイルは、によって書かれたファイルで変更されています。他の誰か (いくつかの機能を追加し、いくつかのバグを修正してください...前に実行できません、親愛なる...一体どういうことですか)
また、申し訳ありませんが、彼の Github リンクが見つかりません...
· TTF フォントストロークをサポートするシステムです フォントはサポートされていません

手順

RichTextEx の使い方は非常に簡単です。RichTextEx.lua をプロジェクト ディレクトリにコピーして必要とするだけです
例:

APUtils = APUtils or {}  APUtils.RichTextEx = APUtils.RichTextEx or require("APUtils/gui/RichTextEx.lua")

RichText を使用してリッチ テキストを作成します非常に単純です:

local txt = RichTextEx:create() -- 或 RichTextEx:create(26, cc.c3b(10, 10, 10))txt:setText("<outLine 5><underLine true><#EFB65C><font res/fonts/pw.ttf><24>您的元宝和银券不足请<#FF0000><35>充值<#EFB65C><24>,或领取抽取元宝奖励！")-- 多行模式要同时设置 ignoreContentAdaptWithSize(false) 和 contentSizetxt:setMultiLineMode(true)  -- 这行其实就是 ignoreContentAdaptWithSize(false)txt:setContentSize(200, 400)someNode:addChild(txt)

文字列がユーザーによって入力された場合は、RichTextEx.htmlEncode("") を呼び出してユーザー入力コンテンツをエンコードし、ユーザーによるキー文字の入力によって引き起こされる予期せぬエラーを回避することをお勧めします
RichTextEx.htmlDecode は、文字列を生成する前に自動的に呼び出されます。テキスト コンテンツを表示するためにコントロールをカスタマイズした場合は、必ずそれを呼び出して文字列をデコードしてください

RichTextEx の基本オプション

<#F00> = <#FF0000>  = 文字颜色<32>                = 字体大小<font Arial>        = 文字字体 支持TTF<img filename>      = 图片（filename 可以是已经在 SpriteFrameCache 里的 key，或磁盘文件）<img_32*32 fname>   = 指定大小的图片<+2> <-2> <*2> </2> = 当前字体大小 +-*/<!>                 = 颜色、字体和字体大小恢复默认\n \t               = 换行 和 tab，可能暂时实现得不是很好 最好不要用 如果需要换行你可以创建多个RichText然后依次放好<outLine 1>         = 设置1像素描边，只支持TTF字体<underLine true>    = 是否开启下划线

RichTextEx の例のオプション (で提供されています)。 RichTextEx.defaultCb)

<blink 文字>      = （动画）闪烁那些文字<rotate 文字>     = （动画）旋转那些文字<scale 文字>      = （动画）缩放那些文字(但如果你做了 setText(t, callback) 除非你在 callback 主动调用 defaultCb，否则以上选项会被忽略)   

関数を拡張できます

`<img_w*h http://path/image> 例如从网络下载图片`

カスタムの特別な構文もサポートしています。

txt:setText("XXXXX <aaaa haha> <bbbb> <CCCC> xxx", function(text, sender) -- 第二个参数 sender 可选    -- 对每一个自定义的 <***> 都会调用此 callback    -- text 就等于 *** (不含<>)    -- 简单的返回一个 Node 的子实例就可，如    -- 如果接收第二个参数 sender，就可获取当前文字大小、颜色: sender._fontSize、sender._textColor    if string.sub(text, 1, 4) == "aaaa" then        return ccui.Text:create("aaa111" .. string.sub(text, 6)), "", 32)        --这里如果为了代码的健壮性最好加入self:htmlDecode        --return ccui.Text:create(self:htmlDecode("aaa111" .. string.sub(text, 6))), "", 32)    elseif text == "bbbb" then        -- 用当前文字大小和颜色        local lbl = ccui.Text:create("bbb111", "", sender._fontSize)        lbl:setTextColor(sender._textColor)        return lbl    elseif string.sub(text, 1, 4) == "CCCC" then        local img = ccui.ImageView:create(....)        img:setScale(...)        img:runAction(...)        return img    endend)

などのコールバックを追加するだけです

他に何をしたいですか

トレースをサポートするには、エッジと下線、Cocos のソース コードも変更する必要があります
UIRichText.h と UIRichText.cpp は、元のものを置き換えるためにプロジェクトのソース コード ディレクトリに配置されます
パス: Frameworks/cocos2d-x/cocos/ui
(メイン変更は 3 つの側面で行われます: アンダースコアの追加設定、ストローク設定の追加、リッチテキストは高さを自動的に変更できます)
さらに、toLua ファイルを変更する必要があります
Frameworks/cocos2d-x/cocos/scripting/lua-bindings/auto/lua_cocos2dx_ui_auto .cpp
18878 行目あたりに 2 つの関数があります
int lua_cocos2dx_ui_RichElementText_init(lua_State* tolua_S)
と
int lua_cocos2dx_ui_RichElementText_create(lua_State* tolua_S)
これら 2 つの関数の実装を次のように置き換えます次の形式:

int lua_cocos2dx_ui_RichElementText_init(lua_State* tolua_S){    int argc = 0;    cocos2d::ui::RichElementText* cobj = nullptr;    bool ok  = true;#if COCOS2D_DEBUG >= 1    tolua_Error tolua_err;#endif#if COCOS2D_DEBUG >= 1    if (!tolua_isusertype(tolua_S,1,"ccui.RichElementText",0,&tolua_err)) goto tolua_lerror;#endif    cobj = (cocos2d::ui::RichElementText*)tolua_tousertype(tolua_S,1,0);#if COCOS2D_DEBUG >= 1    if (!cobj)     {        tolua_error(tolua_S,"invalid 'cobj' in function 'lua_cocos2dx_ui_RichElementText_init'", nullptr);        return 0;    }#endif    argc = lua_gettop(tolua_S)-1;    if (argc == 8)    {        int arg0;        cocos2d::Color3B arg1;        uint16_t arg2;        std::string arg3;        std::string arg4;        double arg5;        int arg6;        bool arg7;        ok &= luaval_to_int32(tolua_S, 2,(int *)&arg0, "ccui.RichElementText:init");        ok &= luaval_to_color3b(tolua_S, 3, &arg1, "ccui.RichElementText:init");        ok &= luaval_to_uint16(tolua_S, 4,&arg2, "ccui.RichElementText:init");        ok &= luaval_to_std_string(tolua_S, 5,&arg3, "ccui.RichElementText:init");        ok &= luaval_to_std_string(tolua_S, 6,&arg4, "ccui.RichElementText:init");        ok &= luaval_to_number(tolua_S, 7,&arg5, "ccui.RichElementText:init");        ok &= luaval_to_int32(tolua_S, 8,&arg6, "ccui.RichElementText:init");        ok &= luaval_to_boolean(tolua_S, 9,&arg7, "ccui.RichElementText:init");        if(!ok)        {            tolua_error(tolua_S,"invalid arguments in function 'lua_cocos2dx_ui_RichElementText_init'", nullptr);            return 0;        }        bool ret = cobj->init(arg0, arg1, arg2, arg3, arg4, arg5,arg6,arg7);        tolua_pushboolean(tolua_S,(bool)ret);        return 1;    }    luaL_error(tolua_S, "%s has wrong number of arguments: %d, was expecting %d \n", "ccui.RichElementText:init",argc, 6);    return 0;#if COCOS2D_DEBUG >= 1    tolua_lerror:    tolua_error(tolua_S,"#ferror in function 'lua_cocos2dx_ui_RichElementText_init'.",&tolua_err);#endif    return 0;}int lua_cocos2dx_ui_RichElementText_create(lua_State* tolua_S){    int argc = 0;    bool ok  = true;#if COCOS2D_DEBUG >= 1    tolua_Error tolua_err;#endif#if COCOS2D_DEBUG >= 1    if (!tolua_isusertable(tolua_S,1,"ccui.RichElementText",0,&tolua_err)) goto tolua_lerror;#endif    argc = lua_gettop(tolua_S) - 1;    if (argc == 6)    {        int arg0;        cocos2d::Color3B arg1;        uint16_t arg2;        std::string arg3;        std::string arg4;        double arg5;        ok &= luaval_to_int32(tolua_S, 2,(int *)&arg0, "ccui.RichElementText:create");        ok &= luaval_to_color3b(tolua_S, 3, &arg1, "ccui.RichElementText:create");        ok &= luaval_to_uint16(tolua_S, 4,&arg2, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 5,&arg3, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 6,&arg4, "ccui.RichElementText:create");        ok &= luaval_to_number(tolua_S, 7,&arg5, "ccui.RichElementText:create");        if(!ok)        {            tolua_error(tolua_S,"invalid arguments in function 'lua_cocos2dx_ui_RichElementText_create'", nullptr);            return 0;        }        cocos2d::ui::RichElementText* ret = cocos2d::ui::RichElementText::create(arg0, arg1, arg2, arg3, arg4, arg5);        object_to_luaval<cocos2d::ui::RichElementText>(tolua_S, "ccui.RichElementText",(cocos2d::ui::RichElementText*)ret);        return 1;    }    if (argc == 7)    {        int arg0;        cocos2d::Color3B arg1;        uint16_t arg2;        std::string arg3;        std::string arg4;        double arg5;        int arg6;        ok &= luaval_to_int32(tolua_S, 2,(int *)&arg0, "ccui.RichElementText:create");        ok &= luaval_to_color3b(tolua_S, 3, &arg1, "ccui.RichElementText:create");        ok &= luaval_to_uint16(tolua_S, 4,&arg2, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 5,&arg3, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 6,&arg4, "ccui.RichElementText:create");        ok &= luaval_to_number(tolua_S, 7,&arg5, "ccui.RichElementText:create");        ok &= luaval_to_int32(tolua_S, 8,&arg6, "ccui.RichElementText:create");        if(!ok)        {            tolua_error(tolua_S,"invalid arguments in function 'lua_cocos2dx_ui_RichElementText_create'", nullptr);            return 0;        }        cocos2d::ui::RichElementText* ret = cocos2d::ui::RichElementText::create(arg0, arg1, arg2, arg3, arg4, arg5, arg6);        object_to_luaval<cocos2d::ui::RichElementText>(tolua_S, "ccui.RichElementText",(cocos2d::ui::RichElementText*)ret);        return 1;    }    if (argc == 8)    {        int arg0;        cocos2d::Color3B arg1;        uint16_t arg2;        std::string arg3;        std::string arg4;        double arg5;        int arg6;        bool arg7;        ok &= luaval_to_int32(tolua_S, 2,(int *)&arg0, "ccui.RichElementText:create");        ok &= luaval_to_color3b(tolua_S, 3, &arg1, "ccui.RichElementText:create");        ok &= luaval_to_uint16(tolua_S, 4,&arg2, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 5,&arg3, "ccui.RichElementText:create");        ok &= luaval_to_std_string(tolua_S, 6,&arg4, "ccui.RichElementText:create");        ok &= luaval_to_number(tolua_S, 7,&arg5, "ccui.RichElementText:create");        ok &= luaval_to_int32(tolua_S, 8,&arg6, "ccui.RichElementText:create");        ok &= luaval_to_boolean(tolua_S, 9,&arg7, "ccui.RichElementText:create");        if(!ok)        {            tolua_error(tolua_S,"invalid arguments in function 'lua_cocos2dx_ui_RichElementText_create'", nullptr);            return 0;        }        cocos2d::ui::RichElementText* ret = cocos2d::ui::RichElementText::create(arg0, arg1, arg2, arg3, arg4, arg5, arg6, arg7);        object_to_luaval<cocos2d::ui::RichElementText>(tolua_S, "ccui.RichElementText",(cocos2d::ui::RichElementText*)ret);        return 1;    }    luaL_error(tolua_S, "%s has wrong number of arguments: %d, was expecting %d\n ", "ccui.RichElementText:create",argc, 6);    return 0;#if COCOS2D_DEBUG >= 1    tolua_lerror:    tolua_error(tolua_S,"#ferror in function 'lua_cocos2dx_ui_RichElementText_create'.",&tolua_err);#endif    return 0;}  

プロジェクトを再コンパイルし、次にプロジェクトで使用できます

次のバージョンで更新される内容

1. タブと改行のサポートを改善するために、引き続き Cocos2d-x の RichText のソース コードを変更します
2. クリック可能なテキストを追加し、クリック後の色を変更します
3. システムフォントのストロークを追加する（システムフォントと判定された場合、ストロークを影に置き換えます）

その他

下線の実装が非常に不器用なので、もっと良い方法があれば教えて下さい。
Cocos2d-x ソース コードの変更を必要としないバージョンが必要かもしれません (このバージョン はストロークと下線をサポートしていません)
QQ: 446569365

への連絡を歓迎します。

著作権声明: この記事はブロガーによるオリジナル記事、ブロガーの許可なく転載を禁じます。 🎜