Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view

This file was deleted.

2 changes: 1 addition & 1 deletion app/ns-ui-category/icon-fonts/usage/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,4 +9,4 @@ WIth NativeScript 6 and above, we can use icon fonts with `Image` elements. For
<snippet id='icon-font-xml-images'/>
<snippet id='icon-font-css-class-def'/>

>> **Note:** Images have specific stretch options (`none`, `aspectFit`, `aspectFill`). At the same time the icon fonts are having `font-size` which can contorl the size of our font. If you want to set the size of your icon through the `font-size` property then set `stretch` property to `none`. Any other values of the stretch property (including the default one) will cause the icon to be resized by measuring the image (or if there is no sizes set, the parent layout in whcih the image is nested).
>> **Note:** Images have specific stretch options (`none`, `aspectFit`, `aspectFill`). At the same time the icon fonts are having `font-size` which can control the size of our font. If you want to set the size of your icon through the `font-size` property then set `stretch` property to `none`. Any other values of the stretch property (including the default one) will cause the icon to be streched by measuring the image (or if there is no sizes set, the parent layout in whcih the image is nested).
2 changes: 2 additions & 0 deletions app/ns-ui-widgets-category/image/icon-fonts/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,5 @@ Using the `font://` prefix, you can load a resource image while setting up an ic
<snippet id='image-icon-fonts-css'/>
<snippet id='image-icon-fonts-js'/>
<snippet id='image-icon-fonts-ts'/>

>> **Note:** Images have specific stretch options (`none`, `aspectFit`, `aspectFill`). At the same time the icon fonts are having `font-size` which can control the size of our font. If you want to set the size of your icon through the `font-size` property then set `stretch` property to `none`. Any other values of the stretch property (including the default one) will cause the icon to be streched by measuring the image (or if there is no sizes set, the parent layout in whcih the image is nested).
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@
<!-- >> image-icon-fonts-xml -->
<GridLayout rows="*, *" columns="*, *" height="300" loaded="containerLoaded" verticalAlignment="middle">

<Image row="0" col="0" src="font://&#xF2b9;" class="font-awesome"/>
<Image row="0" col="0" src="font://&#xF2b9;" stretch="none" class="font-awesome"/>

<Image row="0" col="1" src="font://&#xF359;" style="font-family: 'Font Awesome 5 Free', 'fa-regular-400';" class="font-awesome color"/>
<Image row="0" col="1" src="font://&#xF359;" stretch="aspectFit" style="font-family: 'Font Awesome 5 Free', 'fa-regular-400';" class="font-awesome color"/>

</GridLayout>
<!-- << image-icon-fonts-xml -->
Expand Down