web-dev-qa-db-fra.com

Comment changer la police et la taille de CollapsingToolbarLayout?

Je souhaite modifier la taille de la police CollapsingToolbarLayout et sa police. Comment je peux y arriver?

enter image description here

androidfontstoolbarfont-sizeandroid-collapsingtoolbarlayout
79
AlexMomotov

On dirait que j'ai la solution:

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

Mise à jour

Avant de plonger dans le code, décidons d’abord du textSize pour notre CollapsingToolbarLayout. Google a publié un site Web appelé material.io, ce site Web explique également la meilleure façon de traiter Typography .

L'article mentionné à propos de la catégorie "En-tête" explique également la taille de police recommandée dans sp.

enter image description here

Bien que l'article n'ait jamais mentionné le recommandé CollapsingToolbarLayout's _ développé la taille mais la bibliothèque com.Android.support:design fournit un TextAppearance pour notre cas. En creusant avec la source, il s’avère que la taille est 34sp _ (non mentionné dans l'article).

Alors, qu'en est-il de la taille effondrée? Heureusement, l'article mentionnait quelque chose et c'est 20sp.

enter image description here

Et le meilleur TextAppearance jusqu’à présent qui tienne en mode collpasé est TextAppearance.AppCompat.Title pendant que notre mode développé TextAppearance est TextAppearance.Design.CollapsingToolbar.Expanded.

Si vous observez tous nos exemples ci-dessus, tous utilisent la version [~ # ~] [~ # ~] normale de la police, ce qui est sûr de dire que Roboto regular effectuera la tâche, sauf si vous avez des exigences spécifiques.

Le téléchargement des polices lui-même peut demander trop de travail, pourquoi ne pas utiliser une bibliothèque contenant toutes les polices Roboto nécessaires? Je présente donc une bibliothèque de calligraphies pour Roboto, par exemple. 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

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

Ceci est une mise à jour 2019 car la bibliothèque Typer est mise à jour! Je suis aussi l'auteur de la bibliothèque.

125
Enzokie

Vous pouvez utiliser les nouvelles méthodes publiques, sur CollapsingToolbarLayout pour définir la police de caractères du titre réduit et développé, comme suit:

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

Cela semble avoir été ajouté dans la bibliothèque de support de conception 23.1.0, et est un ajout très bienvenu.

80
Thorinside

Vous pouvez faire quelque chose comme ça:

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

Le style textview correspondant pourrait être: 28sp # 000 bold

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

voir aussi ici pour référence.

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

Référence ici CollapsingToolbarLayout setTitle ne fonctionne pas correctement

10
hedgehog

Le code est ici

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

Ajouter ces lignes de code dans la disposition CollapsingToolbarLayout

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

Et le code qui est donné ci-dessous, dans style.xml

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

Pour ajouter à toutes les réponses ici, cela n'a pas fonctionné pour moi en xml, peu importe où j'ai essayé d'appliquer, dans AppTheme, le référencement dans les styles. J'utilise actuellement la bibliothèque de support 27.1.1

Cela n'a fonctionné que par programmation.

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

Changer la taille de la police ou du parent.

<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>
4
Priya Rajan

Android 8.0 (API niveau 26) introduit une nouvelle fonctionnalité, les polices en XML

Vous pouvez maintenant définir les polices en tant que ressource https://developer.Android.com/guide/topics/ui/look-and-feel/fonts-in-xml.html

  • Placez vos polices dans le dossier res-> font->
  • Définir 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>

prochain set

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