Saya ingin mengubah CollapsingToolbarLayoutukuran font dan jenis hurufnya. Bagaimana saya bisa mencapai itu?

Memperbarui

Sebelum kita menyelami kode, mari kita putuskan dulu textSizeuntuk kita CollapsingToolbarLayout. Google menerbitkan situs web bernama material.io, situs web ini juga menjelaskan cara terbaik tentang cara menangani Tipografi .

Artikel tersebut menyebutkan tentang kategori "Judul" yang juga menjelaskan ukuran font yang disarankan untuk digunakan sp.

Meskipun artikel tersebut tidak pernah menyebutkan ukuran CollapsingToolbarLayout's diperluas yang direkomendasikan tetapi perpustakaan com.android.support:designmenyediakan TextAppearanceuntuk kasus kami. Dengan beberapa penggalian dengan sumbernya ternyata ukurannya 34sp(tidak disebutkan dalam artikel).

Jadi bagaimana dengan ukuran yang runtuh? Untungnya artikel tersebut menyebutkan sesuatu dan memang benar 20sp.

Dan yang terbaik TextAppearancesejauh yang cocok di collpased mode TextAppearance.AppCompat.Titlesementara kami diperluas modus TextAppearanceadalah TextAppearance.Design.CollapsingToolbar.Expanded.

Jika Anda mengamati semua contoh kami di atas semuanya menggunakan versi REGULER dari font yang aman untuk mengatakan itu Roboto regularakan melakukan tugas kecuali Anda memiliki persyaratan khusus.

Mungkin terlalu banyak pekerjaan mengunduh font itu sendiri mengapa tidak menggunakan perpustakaan yang memiliki semua font Roboto yang dibutuhkan? Jadi saya memperkenalkan perpustakaan kaligrafi untuk Roboto misalnya Typer .

dependencies {
    implementation 'com.android.support:design:28.0.0'
    implementation 'com.rhexgomez.typer:typer-roboto:2.0.0'
}

<android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:expandedTitleTextAppearance="@style/TextAppearance.Design.CollapsingToolbar.Expanded"
            app:collapsedTitleTextAppearance="@style/TextAppearance.AppCompat.Title"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

Jawa

// Java example
CollapsingToolbarLayout collapsingToolbar = findViewById(R.id.collapsing_toolbar);
collapsingToolbar.setCollapsedTitleTypeface(TyperRoboto.ROBOTO_REGULAR());
collapsingToolbar.setExpandedTitleTypeface(TyperRoboto.ROBOTO_REGULAR());

Kotlin

// Kotlin example
collapsing_toolbar.apply {
    setCollapsedTitleTypeface(TyperRoboto.ROBOTO_REGULAR)
    setExpandedTitleTypeface(TyperRoboto.ROBOTO_REGULAR)
}

_{Ini adalah pembaruan 2019 karena perpustakaan Typer diperbarui! Saya juga penulis perpustakaan.}

Anda bisa menggunakan metode publik baru, di CollapsingToolbarLayoutuntuk menyetel jenis huruf untuk judul yang diciutkan dan diperluas, seperti:

final Typeface tf = Typeface.createFromAsset(context.getAssets(), "fonts/FrutigerLTStd-Light.otf");
collapsingToolbar.setCollapsedTitleTypeface(tf);
collapsingToolbar.setExpandedTitleTypeface(tf);

Ini tampaknya telah ditambahkan di pustaka dukungan desain 23.1.0, dan merupakan tambahan yang sangat disambut baik.

Anda bisa melakukan sesuatu seperti ini:

mCollapsingToolbarLayout.setTitle(getTitle());
mCollapsingToolbarLayout.setExpandedTitleTextAppearance(R.style.ExpandedAppBar);
mCollapsingToolbarLayout.setCollapsedTitleTextAppearance(R.style.CollapsedAppBar);

Gaya textview yang sesuai bisa jadi:

<style name="ExpandedAppBar" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">28sp</item>
    <item name="android:textColor">#000</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="CollapsedAppBar" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">24sp</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">normal</item>
</style>

lihat juga di sini untuk referensi.

    mCollapsingToolbar.setTitle(getTitle());
    mCollapsingToolbar.setExpandedTitleTextAppearance(R.style.ExpandedAppBar);
    mCollapsingToolbar.setCollapsedTitleTextAppearance(R.style.CollapsedAppBar);

<style name="ExpandedAppBar" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">28sp</item>
    <item name="android:textColor">#000</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="CollapsedAppBar" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">24sp</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">normal</item>
</style>

<style name="ExpandedAppBarPlus1" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">28.5sp</item>
    <item name="android:textColor">#000</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="CollapsedAppBarPlus1" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">24.5sp</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">normal</item>
</style>

Referensi di sini CollapsingToolbarLayout setTitle tidak berfungsi dengan benar

Untuk menambah semua jawaban di sini, Itu tidak berhasil untuk saya di xml di mana pun saya mencoba menerapkan, di AppTheme, mereferensikan dalam gaya. Saya saat ini menggunakan pustaka dukungan 27.1.1

Ini hanya bekerja secara programatik.

Typeface typeface = ResourcesCompat.getFont(this, R.font.my_custom_font);
collapsingToolbarLayout.setCollapsedTitleTypeface(typeface);
collapsingToolbarLayout.setExpandedTitleTypeface(typeface);

Sepertinya saya punya solusi:

private void makeCollapsingToolbarLayoutLooksGood(CollapsingToolbarLayout collapsingToolbarLayout) {
    try {
        final Field field = collapsingToolbarLayout.getClass().getDeclaredField("mCollapsingTextHelper");
        field.setAccessible(true);

        final Object object = field.get(collapsingToolbarLayout);
        final Field tpf = object.getClass().getDeclaredField("mTextPaint");
        tpf.setAccessible(true);

        ((TextPaint) tpf.get(object)).setTypeface(Typeface.createFromAsset(getAssets(), "Roboto-Bold.ttf"));
        ((TextPaint) tpf.get(object)).setColor(getResources().getColor(R.color.ice));
    } catch (Exception ignored) {
    }
}

Kode ada di sini

 <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbarLayout"
            android:layout_width="match_parent"
            app:expandedTitleTextAppearance="@style/Toolbar.TitleText"
            app:collapsedTitleTextAppearance="@style/Toolbar.TitleText"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginStart="@dimen/expanded_toolbar_title_margin_start"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

Tambahkan baris kode ini di tata letak CollapsingToolbarLayout

 app:expandedTitleTextAppearance="@style/Toolbar.TitleText"
 app:collapsedTitleTextAppearance="@style/Toolbar.TitleText"

Dan kode yang diberikan di bawah ini, dalam style.xml

<style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
    <item name="android:textSize">16sp</item>
</style>

Ubah ukuran font atau induk.

<style name="expandedappbar" parent="@android:style/TextAppearance.Medium"> //Change Medium to Small
    <item name="android:textSize">28sp</item>  <!--Or Change the font size -->
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="collapsedappbar" parent="@android:style/TextAppearance.Medium">
    <item name="android:textSize">18sp</item>
    <item name="android:textColor">@color/white</item>
</style>

Android 8.0 (API level 26) telah memperkenalkan fitur baru, Font dalam XML

Sekarang Anda dapat menentukan font sebagai sumber daya https://developer.android.com/guide/topics/ui/look-and-feel/fonts-in-xml.html

• Masukkan font Anda ke dalam res-> font->folder
• Tentukan font.xml

   <?xml version="1.0" encoding="utf-8"?>
      <font-family xmlns:android="http://schemas.android.com/apk/res/android">
        <font
            android:fontStyle="normal"
            android:fontWeight="400"
            android:font="@font/lobster_regular" />
        <font
            android:fontStyle="italic"
            android:fontWeight="400"
            android:font="@font/lobster_italic" />
    </font-family>

set berikutnya

    val typeface = ResourcesCompat.getFont(this, R.font.lobster_regular)
    htab_collapse_toolbar.setCollapsedTitleTypeface(typeface)
    htab_collapse_toolbar.setExpandedTitleTypeface(typeface)