Xamarin.Forms NavigationBar + ActionBar中的自定义字体

Question

Hello I would like to know how to use custom fonts in the navigation bar in Xamarin.

In Xaml it is possible to do set navigation bar properties like this:

<Style TargetType="NavigationPage">
        <Setter Property="BarBackgroundColor" Value="Pink"/>
        <Setter Property="XXX">
          <Setter.Value>
            <OnPlatform x:TypeArguments="x:String"
              iOS="Kenyan Coffee" Android="kenyan coffee rg.ttf#Kenyan Coffee Rg"
              WinPhone=""/>
          </Setter.Value>

        </Setter>
</Style>

My problem is I can't find anything in the documentation about a "Font family" or "label" or something like that.

I get the impression that I might have to use a Custom rendered but I cannot figure out what Class I would have to replace in order to style the navigation bar. Does anybody have any Ideas?

There seems to be a simple straight forward way to do it for iOS but I don't want to style it There unless I can do it on both platforms. A crossplatform Xamarin.Forms way would be ideal but anything that works would be fine.

Tutorials like this which talk about custom fonts seem to ignore the android actionBar completely.

Answer 1

Custom font in general can be set in App.xaml globally. Apparently those settings don't affect toolbar.

However, for Android's toolbar, you have to make add a style in Android's style.xml .

<style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
    <!--set your custom font properties-->
    <item name="android:textSize">18sp</item>
</style>

then just reference it in Toolbar.xaml :

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/primary"
    android:theme="@style/MainTheme"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:titleTextAppearance="@style/Toolbar.TitleText" />