Pages

Wednesday, 9 January 2019

Using Custom Fonts In Xamarin.Forms For iOS App


 Custom fonts for Xamarin.Forms iOS app.





Step 1

After creating XAML file, add your (custom font) .ttf files in Resources folder of iOS project, as shown in the above screenshot. In my project, my custom font file is "Pacifico.ttf".




Step 2

Open the properties of (custom font).ttf file by right clicking on the file and changng the "Copy to Output Directory" option to "Copy always".



Step 3

Open the info.plist file of iOS project in XAML (text) editor view, and copy the following code in it.

  1. <key>UIAppFonts</key>  
  2.   
  3. <array>  
  4.   
  5.     <string>(your custom font file).ttf</string>  
  6.   
  7. </array>  
As shown in the above screenshot.



step 4

Open your .xaml file and copy the following code in it.
  1. <ContentPage.Resources>  
  2.     <ResourceDictionary>  
  3.         <Style x:Key="BaseLabelStyle" TargetType="Label">  
  4.             <Setter Property="TextColor" Value="Black"/><Setter Property="FontSize" Value="25"/>  
  5.         </Style>  
  6.         <Style x:Key="PacificoLabelStyle" TargetType="Label" BaseResourceKey="BaseLabelStyle">  
  7.             <Setter Property="FontFamily"><Setter.Value><OnPlatform x:TypeArguments="x:String" iOS="Pacifico" Android="Pacifico.ttf#Pacifico"/></Setter.Value></Setter>  
  8.         </Style>  
  9.     </ResourceDictionary>  
  10. </ContentPage.Resources>  
  11. <StackLayout>  
  12.     <Label Text="Default" Style="{StaticResource BaseLabelStyle}"></Label>  
  13.     <Label Text="Default" Style="{StaticResource PacificoLabelStyle}"></Label>  
  14. </StackLayout>  
Step 5

Finally, when you run the project in your iOS Simulator, the following output appears.



No comments:

Post a Comment