ionic2 ナビゲーションバーとツールバーに独自画像を表示させるには

2016年12月11日

  1. TOP
  2. BLOG
  3. angular2
  4. ionic2 ナビゲーションバーとツールバーに独自画像を表示させるには

ナビゲーションとツールバーそれぞれに独自の画像を以下の感じで表示させたいと思います。

ただ方法とサイズがいまいち分からずおそらく強引(と思われる)で対応しみてました。まずはテンプレート

そしてscss

もっとちゃんとした方法があるんでしょうが、見つかるまではこれで暫定対応。
各アイコンのサイズはchromeのDeveloper toolからioniconsのサイズを抽出しました
iphoneのionic viewで確認した問題なかったのでとりあえず大丈夫かと・・。

ちなみにナビゲーションバーですがandroidとwindowsは左右にアイコンがあると残りのスペースでセンタリングをしてしまうため中心からズレるのでpaddingで位置を修正。