Как изменить шрифт и размер CollapsingToolbarLayout?

Я хочу изменить CollapsingToolbarLayout размер шрифта и его начертание. Как я могу этого достичь?

enter image description here

8 ответов


в основном вы можете установить TextAppearance в вашем xml.

<android.support.design.widget.AppBarLayout
        android:id="@+id/appbarlyout_commonview_header"
        android:layout_width="match_parent"
        android:layout_height="@dimen/appbarlayout_height"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapse_commonview_header"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginStart="72dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:expandedTitleTextAppearance="@style/TextAppearance.AppCompat.Title">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/tlbr_commonview_mainmenu"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

из приведенного выше кода Вы видели эту часть

app:expandedTitleTextAppearance="@style/TextAppearance.AppCompat.Title"

в частности, последняя часть

.Title

enter image description here

если вы помните, это задокументировано в спецификациях Material Design в разделе Typhography. Вы можете изменить это в доступный встроенный стиль TextAppearance.

enter image description here

второй шаг использовать Roboto Font, который рекомендует Google. The TextAppearance не включает эти шрифты, поэтому нам нужно добавить его вручную, к счастью, есть шрифт(Ы) Gradle Base Robot, который предлагается Typer . Перед использованием шрифта нам нужно добавить новую зависимость в наш build.gradle.

dependencies {
    compile 'com.elmargomez.typer:typerlib:1.0.0'
}

и установите шрифт в наш CollapsingToolbar

Typeface font = Typer.set(yourContext).getFont(Font.ROBOTO_MEDIUM);
collapsingToolbar.setCollapsedTitleTypeface(font);
collapsingToolbar.setExpandedTitleTypeface(font);

Вы можете использовать новые public методы, о CollapsingToolbarLayout установить шрифт для свернутого и развернутого название, вот так:

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

это, похоже, было добавлено в библиотеку поддержки дизайна 23.1.0 и является очень приятным дополнением.


Вы можете сделать что-то вроде этого:

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

соответствующий стиль textview может быть: 28sp #000 смелый

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

см. Также здесь для справки.


похоже, у меня есть решение:

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

    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 не работает правильно


изменить размер шрифта или родителя.

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

и код, который приведен ниже, в стиле.в XML

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

добавить ко всем ответам здесь, Он не работал для меня в xml независимо от того, где я пытался применить, в AppTheme, ссылаясь на стили. В настоящее время я использую библиотеку поддержки 27.1.1

Он работал только программно.

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