React-native’de android&ios yeni font ekleme (v0.29)

DEPRECATED!!

Bu yazı eski android sürümleri için geçerlidir. Daha günceli için;

 

Bu yazımda sizlere react-native de yeni bir fontun nasıl ekleneceğini göstereceğim.

Öncelikle fontu belirlememiz ve indirdiğimiz font dosyasının .otf yada .ttf olması gereklidir. Font seçimi için 10001fonts önerebileceğim güzel bir sitedir.
Örnek olarak Queenata yazı fontunu kullanacağız.

IOS

Xcode içerisinde proje ayarlarında bulunan Build Phases -> Copy Bundle Resources içerisine indirdiğimiz bu font dosyamızı (Queenata.otf) ekliyoruz ekliyoruz.

Xcode içerisindeki Info -> Font provided by application içerisine görselde olduğu gibi Queenata.otf’i ekliyoruz.

CSS satırımıza fontFamily:’Queenata’ şeklinde kodlayarak ilgili fontu atamış oluruz.

Projeyi yeniden build edelim. (react-native run-ios) Görseldeki gibi bir font çıktısı elde etmiş olacağız.

 

ANDROID

Android’de işler daha basit.
Proje dizinimiz içerisinde /projectname/android/app/src/main/assets/fonts dizini altına indirdiğimiz Queenata.otf dosyasını ekliyoruz.

fontFamily:’Queenata’

kodunu CSS style’ı olarak veriyoruz ve yukarıdaki çıktıyı elde ediyoruz.

 

Şimdilik yardımcı olabileceğim konu bu kadar.
React-native ile alakalı sorularınızı mail üzerinden yada buraya yorum yazarak iletebilirsiniz.

Serinin diğer yazıları için -> react-native geliştirmeler serisi

Sağlıcakla kalın