CODEWITHSUNDEEP
nativescriptnativescript-vue
Xurik
Xurik

Reputation: 56

Nativescript Vue Font Icon Size with Image tag

How to set the size of font icon when i use Image tag? I tried with app.scss, but the icon is max size. I couldn't find any other documentation.

nativescript vue fontawesome size with image tag

The small icons are with Fontawesome 4.7 and button tag. They are ОК. The big icon is with Fontawesome 5 and Image tag.

<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;
}

Upvotes: 0

Views: 591

Answers (1)

Xurik
Xurik

Reputation: 56

I think that font icon size with image tag is ignored inside 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;
}

Upvotes: 0

Related Questions