[Adobe Animate CC注意点] ダイナミックテキストが複数行にならない！日本語だと特に注意です！

少し間が空きましたが、Adobe Animate CCの使い方講座のコンテンツを進めていきたいと思います。今回からしばらく、Adobe Animate CCの注意点について記述していこうと思っています。

Adobe Animate CCは注意しなければいけない点がたくさんあります。特に日本語環境だと注意が必要な場合がいくつかあり、意図した通りに動かない時があるんです。その「上手くいかない場合」のパターンをおさえておかないと、かなり苦労します。

ということで、今回からしばらく、その「意図した通りに動かないパターン」を列挙していこうかなと思います。これさえ抑えれば、Adobe Animate CCを思った通りに動かせるようになるかと思います！今回は、ダイナミックテキストに関する注意点です。

Adobe Animate CC注意点：ダイナミックテキストが複数行にならない場合があります！

これはかなり致命的な不具合です。ダイナミックテキストにすると「複数行のテキストでも、単一行にしかならない」という不具合があります。ダイナミックテキストは静的テキストの反対で、プログラム(JavaScript)で動的に変更可能なテキストのことです。変更可能なテキストのことですね。このダイナミックテキストに不具合があります。

例えば、下図のようなダイナミックテキストをつくったとします。パブリッシュ前は、下図のように枠によって3行になっている状態です。

しかし、パブリッシュすると…↓のように、全て1行になってしまうんです！これじゃ、枠の意味がないですし、最悪です。ちなみに、静的テキストの場合はこんな事になりません。ちゃんと複数行で意図した通りに出力されます。

英語だと上手くいく。何故なら、文章の中にスペースがあるからです。

実は、上の複数行にならない仕様は、日本語でのみおきる現象です。英語だと、それなりにうまく表示されます。↓のとおり、ちゃんと複数行になっていますよね。

その理由は、Adobe Animate CCが下記のような仕様になっているからです。

仕様：英語で単語の途中で改行が入ると読みにくいので、単語の区切り(空白)で改行するようにする

Adobe Animate CCは親切なのか、不親切なのか、「スペースで区切った単語を意識して、適度に改行を入れる」処理をしています。しかし、

文章の中に空白が入らない日本語は、全文が1単語とみなされる

のです。明らかに英語の文章に合わせた仕様になっているんです！今のところ改善される気配はないです…。ということで、こういった動きをすることを前提とした対策を取る必要があります。

対策

対策1:プログラムで自分で改行を入れる

1つ目の対策は、自分でプログラム中で、テキスト内に改行を入れてしまうという方式です。JavaScriptのプログラム中でstring(文字列)に「\n」を入れると、そこで改行されるようになります。ですので、自分のプログラム内で「20文字ごとに\nを挿入して改行するようにする」といった対処をとることで、一応対応はできます。行ごとで文字ズレとかあるんでなかなか難しいんですけどね…　でもこうするしかないです。

対策2:文章内で空白を適度に入れる

もう一つの方式は「適度に空白」を入れることです。空白がないから、1単語とみなされているのであれば、適度に空白を入れるしかないです。でも、日本語内で空白があるってちょっと変ですけどね。

↓文章の節の間に空白を入れた場合。ちゃんと改行されます。謎の空白が入ってしまいますが。

対策3:英語を使う(日本語を使わない)

最後の対策は究極論です。英語を使うこと。日本語を使わないことです。こうすると、空白が適度にはいるため、枠通りに表示がされます。でも、Adobe Animate CCの仕様のために言語まで変えるって、ちょっとおかしいですよね。

基本的には、自然に処理するためには対策1の通り、自分で改行を入れて対処するしかないと思います。プログラムに慣れている人は別に対した問題ではないはずですが、なかなか厳しい仕様だなあと思います。とにかく、この仕様を意識してコンテンツを作る必要がありますので、注意して下さい！

　

⇒「Adobe Animate CC [旧Flash]」カテゴリ記事一覧

その他関連カテゴリ

↓デジハリならAdobe Creative Cloudが45%OFFで契約可能です！