制作記録 2011/07/10 html表示周りを何とかする

昨日からやってきたhtmlの表示周りがようやく動き始めた。

この部分は案外厄介だけど、すでに以前のバージョンでは動いているので、新しいAPI用に書き直しつつスマートにしたい、と思っていたけど難儀した。

HtmlTextのメモ http://outcloud.blogspot.com/2010/08/htmltext.html

as3には標準で、htmlを表示する機能があるけど、webkitを搭載したairのそれとは大きくかけ離れた貧弱なものだ。それも表示できればまだいい、という感じで、フラッシュの提供者によってコントロールされたhtmlなら問題なく表示できるけど、GoogleリーダーAPIで取得した有象無象なhtmlとなると難しくなる。

imgによってはエラーが出てしまうのが、TextFieldでは対処できない。またイメージのサイズによってはイメージと文字が被ってしまったり、文字が消えてしまう。

よってimgについては別途クラスに置き換えてやる。これにはgetImageReferenceを使うけど、情報が少なく使い方が分からない。今回は嵌ったのはgetImageReferenceでリプレイスするクラスのおき場所で、srcのルートか別ライブラリにしておく必要がある。気持ち悪いので、htmlレンダラークラスの中に置いたら、案の定動かなかくてしばらく嵌った。また置き換えるクラスをBitmapを拡張したクラスにしたら、ロード中と実際に取得したイメージが2重に表示されて解消できなかった。


また文字が消えてしまう件は、イメージのサイズを表示エリアの70%までとして、リサイズをかける。しかし大抵のimgタグにはwidthやheightが書かれていないので、img取得後に適宜にhtmlを書き換えることとなる。


さて、書き換えといっても簡単ではなくて、TextFieldには穏便にhtmlTextを更新する方法がないみたいだ。imgのwidthやheightを更新するにはhtmlTextを再設定する。すると今度はstyleSheetが効かなくなるので（再設定しても無視されるみたい）、結局TextFieldを削除して再生成する。その後再度getImageReferenceを拾って、別に控えておいたBitmapDataを戻していく。

これまででようやく、imgの表示とイメージサイズ取得後のimgのリサイズができた。

もっとスマートにできないものかな。。。以前のものから進歩がない。。。

最後に、imgタグのwidthやheightはブラウザのレンダリング負荷を下げることができるので、ぜひ設定しておきましょう。