【解決】「Titanium WebView Viewport 文字サイズ おかしい」 でお困りの方へ

{ circle }.. (॓.॔)ﾉﾞ

Titaniumを久々に触ってたら、わりと単純なことで詰まってしまったのでメモ。

  • 読み込み完了してるWebViewが既にあり、
  • それをloadイベントやfireEventをトリガーとして、
  • 他のView（imageViewやlabelview）を操作する

もしかしたらローカルにあるHTMLだけの問題かもしれませんが、show()やhide()はもちろん、ただ変数にアクセスしただけなのに、WebViewの文字サイズがおかしくなったりmarigin/paddingが狂ったり、Viewportの不具合のように見える問題が発生。なお、HTMLに記載されてる（であろう）Viewportを削除すると少しマシになります。

ただViewportを削除するだけでは根本的な解決になりません。イベント発火のタイミングがおかしいのかなとか色々調べてたんですが、答えは非常にシンプル。WebViewのwidthを100%にすることで解決しました！

Defaults to: If undefined, defaults to either Titanium.UI.FILL or Titanium.UI.SIZE depending on the view. See “View Types and Default Layout Behavior” in Transitioning to the New UI Layout System.
http://docs.appcelerator.com/titanium/3.0/#!/api/Titanium.UI.WebView-property-width 

var webview = Ti.UI.createWebView({
    backgroundColor: '#fff',
    borderRadius: 15,
    borderWidth : 5,
    borderColor : 'red'
    width:"100%", //★widthを100%にすることで解決
});