今回はandroid・iphone両方で安全に画像を表示できるfont-awasomeのサイトについて書いていきます。
cordovaはハイブリッドアプリの土台となるフレームワークのため、window・macそれぞれpcを二台使って
デバッグすることになります。当然機種のブラウザによって表示・動作が異なるため画像が表示されない
などの不具合に遭遇することが多いです。
onsenuiから直接指定してもいいのですが、android・iphoneそれぞれに対する記述方法が以下のように異なっており
デバッグで調整しながらだとかなり時間を消費してしまいます。
<Icon size={20} style={{color: “#000”}} icon={{default: ‘ion-ios-add-circle’, material: ‘md-plus-circle’}} />
font-awasomeサイトは、iタグを使って以下のように一行で画像を表示できます。
使用する前にindex.htmlのhead内に以下のように記述
<link href=”https://use.fontawesome.com/releases/v5.15.1/css/all.css” rel=”stylesheet”>
試しにプラスボタンを表示してみたいと思います。一行です。
<i class=”fas fa-plus-circle”></i>
これでandroid・iphone両方で正常に表示させることができます。
扱える画像が多いのが魅力ですが、凝ったものを使うにはpro(有料会員登録)が必要に
なってくるので使用頻度が高ければ入会してみるのもアリだと思います。
proでなくてもハイクオリティな画像が揃っているので個人的にはこのままでもok。
