(Xamarin Forms) Font 파일 적용하기

모바일에서 기본 폰트는 깔끔하지만

디자인을 위해 다른 폰트를 적용하고 싶을 때가 있습니다.

안드로이드, iOS  에 적용하는 방법을 소개합니다.

 

우선 Android 안드로이드나 iOS 프로젝트에 폰트 파일을 import 시켜야합니다.

(폰트 파일 예시 : Binggrae.ttf)

Android 프로젝트는 Assets 폴더에

iOS 프로젝트는 Resources 폴더에 폰트 파일을 추가합니다.

추가로, iOS 는 Info.plist 파일에 아래 처럼 내용을 추가해야합니다.

<key>UIAppFonts</key>
 <array>
  <string>Binggrae.ttf</string>
 </array>

 

이제 각 프로젝트(Android,iOS)에 파일을 하나씩 추가해야합니다.

ExtendedRendrerer 를 추가할껀데 이것의 의미는 쉽게 말하면 기본 컨트롤에 대해서

각 기기 별로 커스텀하게 적용할 부분이 필요할 때 사용되는 것이라 보면됩니다.

우리는 폰트를 변경할 것이므로 폰트만 바꾸는 코드를 넣을 것입니다.

Button 예시입니다.

Android

using Android.Content;
using Android.Graphics;
using Test.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(Button), typeof(ExtendedButtonRenderer))]
namespace Test.Droid
{
    public class ExtendedButtonRenderer : ButtonRenderer
    {
        public ExtendedButtonRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
        {
            base.OnElementChanged(e);
            if (Control != null)
            {
                  Control.Typeface = Typeface.CreateFromAsset(base.Context.Assets, "Binggrae.ttf");
            }
        }
    }
}

iOS

using Test.iOS;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(Button), typeof(ExtendedButtonRenderer))]
namespace Test.iOS
{
    public class ExtendedButtonRenderer : ButtonRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                Control.Font = UIKit.UIFont.FromName("Binggrae", (System.nfloat)e.NewElement.FontSize);
            }
        }
    }
}

위처럼 적용하면 앱내 모든 버튼의 Text 는 Binggrae 폰트가 적용되어 보여집니다.

Picker, Entry, Label.. 등의 컨트롤 모두가 ExtendedRendrerer 를 구성해야 폰트가 적용됨을 유의해야합니다.

 

추가로 Android 는 한가지 방법이 더 있습니다.

아래 처럼 각 컨트롤의 FontFamily 에 아래처럼 폰트 파일명과 폰트 이름을 넣으면 폰트가 적용됩니다.

FontFamily="Binggrae.ttf#Binggrae"

(iOS 는 안됨.^^;)