0

我在 Adob​​e Animate CC 2015.2 中创建了一个带有 3 行标题的基本 HTML5 Canvas 动画。我需要能够从外部文件中输入文本,以便能够将其更改为翻译成不同的语言。

是否有捷径可寻?还是应该只是绝对位于顶部的标准 HTML?

4

2 回答 2

2

我知道这是一个老问题,但这是我的解决方案,因为我花了一段时间才找到一个运作良好的解决方案。

我需要在 Animate CC 中创建的一系列 HTML 5 动画中包含多个动态文本框,这些动画用作 Bootstrap Carousel 幻灯片放映的一部分。我希望以后能够添加多种语言 - 所以我为每种语言使用了一个 json 文件来存储文本内容并按需加载。

示例 json:

{
  "1": {
    "name": "default_text", 
    "text": {"0" : "Error locating text content for this animation?"}
   }, 
  "2": {
    "name": "coating_systems", 
    "text": {"0" : "this animation has one text field"}
   }, 
  "3": {
    "name": "compatability_chart", 
    "text": {"0" : "this animation has more than one dynamic text field", "1" : "another text field"}
  }
}

该名称由父站点使用 - 这里我们只需要“文本”

在我的 Adob​​e CC 动画时间轴中:

    var that = this; 
    var loaded = false;
    json = {};  
    var loadJson = function(url)  
    {  
        var queue = new createjs.LoadQueue(true);  
        queue.on("fileload", onJsonLoaded, that);  
        queue.on("error", onJsonLoadError, that);  
        queue.loadFile({id:"json", src:url});  
    }  
    var onJsonLoaded = function(e)  
    {  
        that.json = e.target.getResult("json");  
        setText();  
    }  
    var onJsonLoadError = function(e)  
    {  
        console.log(e);  
    }  
    var setText = function()  
    {  
        var blocks = that.json; 
        var numblocks = Object.keys(blocks[id].text).length;
        // loop through the text block to assign to the matching count in the animation
        for (var i=0; i < numblocks; i++) {
            var txtField = eval('that.textField'+i);
            txtField.text = blocks[id].text[i];
        }
    }  

    //in my case, the "id" and "lang" gets passed from the parent window into the iframe with the animation in a bs carousel - uses data attributes
    var $anim_iframe = parent.document.querySelectorAll('.item.active .animation_iframe');
    if($anim_iframe.length > 0){
        var id = $anim_iframe[0].dataset.id;
        var lang = $anim_iframe[0].dataset.lang;
        var json_file = '/path/to/lang/'+lang+'.json';
        // load json, but don't bother if the animation loops
        if(loaded == false){
            loadJson(json_file);
        }
        loaded = true;
    }

在您的舞台上,您将拥有名为 textField0、textField1、textField2 等的动态文本框,它们与 json 文件中的“文本”相匹配。

于 2018-09-25T10:28:08.160 回答
1
$.ajax({
    type: 'GET', // changed from 'tybe'
    url: externalurl,
    dateType: 'xml',
    success: function (xml) {
        var Text_Cta1 = $(xml).find("BtnText1")
            root.feedTitle.text = titles[0].textContent;
            $(xml).find("BtnText1").each(function () (
            $item = $(this);
            var itme = new Object();
            item.title = $item.find("Text_Cta1").text();
        feedItems.push('Text_Cta1');
        )};
    })
于 2016-11-03T12:53:58.967 回答