2015-07-31 3 views
58

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

enter image description here

+3

пытался setCollapsedTitleTextAppearance(); и setCollapsedTitleTextColor(); функция? – abhishek

+0

@abhishek, это не то, что я ищу. Я не могу изменить шрифт через xml. – AlexMomotov

ответ

9

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

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

Reflection ... Ugly hack – Lester

42

Вы можете сделать Somthing так:

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> 

также смотрите here для справки.

+0

Это замечательно, спасибо! – Kibi

+0

Это помогло мне изменить цвет текста заголовка, так как я обнаружил, что '' Toolbar.setTitleTextColor() '' или '' app: titleTextColor' '' Toolbar'' не меняет цвет заголовка панели инструментов, когда заключен в '' CollapsingToolbarLayout'' – patrickjason91

84

В принципе вы можете установить 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 Спекуляции в Секция тифографии. Вы можете изменить это в доступный встроенный стиль TextAppearance.

enter image description here

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

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

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

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

# 1. спасибо за сообщение – gianguyen

68

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

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

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

+3

Это замечательно, спасибо! –

+0

Как изменить название? Я хочу, чтобы название было написано другим текстом. – Equivocal

+0

Возможно, вы используете метод 'setTitle (String)' на экземпляре 'CollapsingToolbarLayout'. – Thorinside

6
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

2

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

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

Код здесь

<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> 
Смежные вопросы