带图像标签的Nativescript Vue字体图标大小

时间:2020-04-05 23:49:09

标签: nativescript nativescript-vue

当我使用图像标签时如何设置字体图标的大小?我尝试使用app.scss,但图标为最大大小。我找不到其他任何文档。

nativescript vue fontawesome size with image tag

小图标带有Fontawesome 4.7和按钮标签。他们是ОК。大图标带有Fontawesome 5和Image标签。

<Image col="3" src.decode="font://&#xf004;" class="fas" stretch="none" />

app.scss

.fas {
    font-family: "Font Awesome 5 Free Solid", "fa-solid-900";
    font-weight: 900;
    font-size: 12;
}

1 个答案:

答案 0 :(得分:0)

我认为带图像标签的字体图标大小会在RadListView(Android)内部被忽略。

<Image  src.decode="font://&#xf004;" class="fas" stretch="none" /> - This is OK
<RadListView for="">
   <v-template>
      <GridLayout columns="auto,*">
         <button col="0"><FormattedString><Span class="fa" :text="'fa-thumbs-o-up' | fonticon" /><Span :text="10" /></FormattedString></button> - This is OK
         <Image col="1" src.decode="font://&#xf004;" class="fas" stretch="none" /> - This didn't work 
      </GridLayout>                     
   </v-template>
</RadListView>

app.scss

.fa {
    font-family: FontAwesome; //Font Awesome 4.7
 }

.fas {
    font-family: "Font Awesome 5 Free Solid", "fa-solid-900";
    font-weight: 900;
    font-size: 12;
}