web-dev-qa-db-fra.com

Rendre le texte TabLayout en gras

J'utilise TabLayout à partir de la bibliothèque Android Design Support et je souhaite styliser son texte (titre). Rendre spécifiquement audacieux. Comment y parvenir enXMLseulement?

<Android.support.design.widget.TabLayout
Android:id="@+id/sliding_tabs"
Android:layout_width="match_parent"
app:tabTextColor="@color/white"
app:tabSelectedTextColor="@color/white"
app:tabIndicatorColor="@color/accent"
Android:layout_height="wrap_content"
app:tabIndicatorHeight="3dp" />
androidandroid-tablayout
7
Vahid Amiri

Tout d'abord, cela doit être ajouté au styles.xml:

<style name="TabLayoutTextStyle">
    <item name="Android:textSize">16sp</item>
    <item name="Android:textStyle">bold</item>
</style>

Même si vous ne souhaitez pas modifier la taille du texte, vous devez l'inclure dans les styles, sinon rien ne sera affiché.

Ensuite, le style doit être appliqué à la TabLayout en utilisant app:tabTextAppearance et non à l'attribut style!

<Android.support.design.widget.TabLayout
Android:id="@+id/sliding_tabs"
Android:layout_width="match_parent"
app:tabTextColor="@color/white"
app:tabSelectedTextColor="@color/white"
app:tabIndicatorColor="@color/accent"
Android:layout_height="wrap_content"
app:tabIndicatorHeight="3dp" 
app:tabTextAppearance="@style/TabLayoutTextStyle" />

Pour activer les allcaps, vous pouvez ajouter ce qui suit à la TabLayoutTextStyle:

<item name="Android:textAllCaps">true</item>
22
Vahid Amiri

  1. Une option consiste à ajouter In styles.xml 

      <item name="Android:textStyle">bold</item>

    à l'intérieur de "TextAppearance.Design.Tab" avec le même nom que le parent

    <style name="TextAppearance.Design.Tab" parent="TextAppearance.Design.Tab">
  <item name="Android:textSize">15sp</item>
  <item name="Android:textStyle">bold</item>
  <item name="Android:textColor">?android:textColorSecondary</item>
  <item name="textAllCaps">true</item>
  <item name="Android:singleLine">true</item>
</style>

  2. Autre option: dans votre mise en page, directement dans votre style - disons que vous l'appelez myTabLayoutStyle 

     style="@style/myTabLayoutStyle"

et à l'intérieur de ce style, redirigez-le vers un autre style uniquement pour l'apparence du texte:

      <item name="tabTextAppearance">@style/myTabTextStyle</item>

comme ça:

  <Android.support.design.widget.TabLayout
    Android:id="@+id/tab_layout"
    style="@style/myTabLayoutStyle"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_below="@+id/toolbar"
    Android:background="?attr/colorPrimary"
    Android:elevation="600dp"
    Android:minHeight="?attr/actionBarSize"
    app:tabGravity="fill"
    Android:singleLine="true"
    Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

à l'intérieur de styles.xml: 

  <style name="myTabLayoutStyle" parent="Widget.Design.TabLayout">
    <item name="tabMaxWidth">@dimen/tab_max_width</item>
    <item name="tabIndicatorColor">?attr/colorAccent</item>
    <item name="tabIndicatorHeight">4dp</item>
    <item name="tabPaddingStart">3dp</item>
    <item name="tabPaddingEnd">3dp</item>
    <item name="Android:singleLine">true</item>
    <item name="tabBackground">?attr/selectableItemBackground</item>
    <item name="tabSelectedTextColor">?android:textColorPrimary</item>
    <item name="tabTextAppearance">@style/myTabTextStyle</item>
  </style>

   <style name="myTabTextStyle">
       <item name="Android:textSize">15sp</item>
       <item name="Android:textStyle">bold</item>
       <item name="Android:textColor">?android:textColorSecondary</item>
       <item name="textAllCaps">true</item>
       <item name="Android:singleLine">true</item>
  </style>
0
Udi Reshef

Ajouter un style de texte TabLayout dans styles.xml

<style name="TabLayoutTextStyle">
    <item name="Android:textStyle">bold</item>
</style>

Et définissez TabLayoutTextStyle en tant que style sur vos propriétés TabLayout. 

<Android.support.design.widget.TabLayout
Android:id="@+id/sliding_tabs"
Android:layout_width="match_parent"
app:tabTextColor="@color/white"
app:tabSelectedTextColor="@color/white"
app:tabIndicatorColor="@color/accent"
Android:layout_height="wrap_content"
app:tabIndicatorHeight="3dp" 
style="@style/TabLayoutTextStyle" />
0
Love Bdsobuj

C'est la bonne façon de faire cela.

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical"
    Android:baselineAligned="false">

    <Android.support.design.widget.TabLayout
        Android:id="@+id/tablayout"
        Android:layout_width="match_parent"
        Android:layout_height="50dp"
        app:tabTextAppearance="@style/TextAppearance.Bold"
        app:tabTextColor="@color/grey"
        app:tabSelectedTextColor="@color/black" />

</LinearLayout>
0
JPM