如何更改 CollapsingToolbarLayout 字体和大小？

Question

我想更改 CollapsingToolbarLayout 字体大小和字体。我怎样才能做到这一点？

Answer 1

看来我有解决办法：

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) {
    }
}

Answer 2

你可以这样做：

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

对应的textview样式可以是：

<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>

另见 here 以供参考。

Answer 3

更新

在深入研究代码之前，让我们先为 CollapsingToolbarLayout 确定 textSize。 Google 发布了一个名为 material.io 的网站，该网站还解释了如何处理 Typography 的最佳方法。

文章提到了“标题”类别，该类别还解释了在 sp 中使用的推荐字体大小。

虽然文章从未提及推荐的 CollapsingToolbarLayout's expanded 大小，但库 com.android.support:design 为我们的案例提供了 TextAppearance。通过对源代码的一些挖掘，结果发现大小是 34sp（文章中未提及）。

那么折叠尺寸如何？幸运的是这篇文章提到了一些东西，它是 20sp.

到目前为止，适合 collpased 模式的最佳 TextAppearance 是 TextAppearance.AppCompat.Title，而我们的 expanded 模式TextAppearance 是 TextAppearance.Design.CollapsingToolbar.Expanded.

如果您观察我们上面的所有示例，它们都使用 REGULAR 版本的字体，可以肯定地说 Roboto regular 可以完成任务，除非您有具体要求。

下载字体本身可能工作量太大为什么不使用包含所有需要的 Roboto 字体的库呢？所以我为 Roboto 介绍了一个书法库，例如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">

Java

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

科特林

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

_{这是 2019 年的更新，因为 Typer 库已更新！我也是图书馆的作者}

Answer 4

您可以在 CollapsingToolbarLayout 上使用新的 public 方法来设置折叠和展开标题的字体，如下所示：

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

这似乎已添加到设计支持库 23.1.0 中，非常受欢迎。

Answer 5

    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>

参考这里CollapsingToolbarLayout setTitle not work correctly

Answer 6

更改字体大小或父级。

<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>

Answer 7

代码在这里

 <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">

在 CollapsingToolbarLayout 布局中添加这些代码行

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

以及下面给出的代码，在 style.xml

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

Answer 8

要添加到此处的所有答案，它在 xml 中对我不起作用，无论我在哪里尝试应用，在 AppTheme 中，在样式中引用。我目前正在使用支持库 27.1.1

它只能以编程方式工作。

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

Answer 9

Android 8.0（API 级别 26）引入了一项新功能，XML

中的字体

现在您可以将字体定义为资源https://developer.android.com/guide/topics/ui/look-and-feel/fonts-in-xml.html

将字体放入 res-> font-> 文件夹
定义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>

下一组

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

如何更改 CollapsingToolbarLayout 字体和大小？

How to change CollapsingToolbarLayout typeface and size?

android

fonts

toolbar

font-size

android-collapsingtoolbarlayout

更新

Java

科特林

Android 8.0（API 级别 26）引入了一项新功能，XML