web-dev-qa-db-fra.com

Changer les onglets ActionBar souligne la couleur par programmation

J'ai créé la barre d'action par 

ActionBar actionbar = getActionBar()

L'arrière-plan de la barre d'action est modifié par 

actionbar.setBackgroundDrawable(actionBarBackgroundImage);

Maintenant, je dois changer les onglets de la barre d’action pour souligner la couleur par programmation. Existe-t-il une méthode pour modifier la couleur de soulignement des onglets de la barre d'action?

23
Karthick

Sinon, vous pouvez aussi utiliser Générateur de styles de barres d’action Android pour personnaliser facilement votre barre d’action et vos onglets.

10
Litrik De Roy

Voici un moyen beaucoup plus facile. Je sais que vous cherchiez un changement de programme, mais celui-ci est VRAIMENT facile.

Je lutte avec cela depuis des jours, mais j'ai finalement trouvé la solution. J'utilise AppCompat. Vous pouvez définir colorAccent dans votre thème, ce qui modifiera la couleur de surbrillance de votre barre d’action. Ainsi:

<item name="colorAccent">@color/highlightcolor</item>

Ici c'est dans le contexte:

<style name="LightTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/darkgrey</item>
    <item name="colorPrimaryDark">@color/black</item>
    <item name="colorAccent">@color/highlightcolor</item>
</style>

Où j'avais posté cette réponse: La couleur de soulignement des onglets Android ne change pas

9
Kenny Wyland

Je vous suggère d'utiliser ActionBarSherlock . Il existe un échantillon disponible dans la bibliothèque appelée "Style ActionBar". (c’est la seule façon de modifier la couleur de soulignement des onglets d’ActionBar)

si vous avez personnalisé ActionBar, vous devez ajouter ce style dans Style de barre Action.

ou voici comment faire cela

enter image description here

créer un style comme ci-dessous (ici, j'ai utilisé ActionBarShareLock si vous ne voulez pas l'utiliser, utilisez Android-support-v4.jar pour prendre en charge toutes les versions du système d'exploitation Android)

<style name="Theme.AndroidDevelopers" parent="Theme.Sherlock.Light">
        <item name="Android:actionBarTabStyle">@style/MyActionBarTabStyle</item>
        <item name="actionBarTabStyle">@style/MyActionBarTabStyle</item>
    </style>

    <!-- style for the tabs -->
    <style name="MyActionBarTabStyle" parent="Widget.Sherlock.Light.ActionBar.TabBar">
        <item name="Android:background">@drawable/actionbar_tab_bg</item>
        <item name="Android:paddingLeft">32dp</item>
        <item name="Android:paddingRight">32dp</item>

actionbar_tab_bg.xml

<item Android:state_focused="false" Android:state_selected="false" Android:state_pressed="false" Android:drawable="@drawable/ad_tab_unselected_holo" />
<item Android:state_focused="false" Android:state_selected="true"  Android:state_pressed="false" Android:drawable="@drawable/ad_tab_selected_holo" />
<item Android:state_selected="false" Android:state_pressed="true" Android:drawable="@drawable/ad_tab_selected_pressed_holo" />
<item Android:state_selected="true"  Android:state_pressed="true" Android:drawable="@drawable/ad_tab_selected_pressed_holo" />

applay ce style dans votre activité dans le fichier manifeste Android

<activity
            Android:name="com.example.tabstyle.MainActivity"
            Android:label="@string/app_name"
            Android:theme="@style/Theme.AndroidDevelopers" >

pour plus de détails, consultez cette réponse et cet article .


EDITED: 29-09-2015

ActionBarSherlock étant obsolète, vous pouvez également utiliser la bibliothèque de support Android design et la bibliothèque Android app appcompat pour TOOLBAR (Action-Bar est obsolète donc ..) et TABS.

utilisez TabLayout comme ci-dessous

<Android.support.design.widget.TabLayout
            Android:id="@+id/tabs"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            app:tabGravity="center"
            app:tabMode="scrollable"
            app:tabSelectedTextColor="@color/white"
            app:tabIndicatorColor="@color/colorPrimary"
            app:tabIndicatorHeight="2dip"
            app:tabTextAppearance="?android:attr/textAppearanceMedium"
            app:tabTextColor="@color/colorAccent" />

voici un exemple de bibliothèque de support de conception Android avec onglet

5

Référez-vous this , pour personnaliser la barre d’action,

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActivityTheme" parent="@Android:style/Theme.Holo">
        <item name="Android:actionBarStyle">@style/MyActionBar</item>
        <!-- other activity and action bar styles here -->
    </style>

    <!-- style for the action bar backgrounds -->
    <style name="MyActionBar" parent="@Android:style/Widget.Holo.ActionBar">
        <item name="Android:background">@drawable/ab_background</item>
        <item name="Android:backgroundStacked">@drawable/ab_background</item>
        <item name="Android:backgroundSplit">@drawable/ab_split_background</item>
    </style>
</resources>
4
Sino Raj

J'ai essayé beaucoup de suggestions postées ici et dans d'autres endroits sans succès. Mais je pense avoir réussi à trouver une solution (bien que pas parfaite).

Le TabWidget utilise un sélecteur. Essentiellement, il montre une image différente de 9 patchs en fonction de l'état de l'onglet (sélectionné, appuyé, etc.). J'ai finalement compris que vous pouviez générer un sélecteur par programmation. J'ai commencé avec 9 correctifs générés à partir de http://Android-holo-colors.com/ (couleur: # 727272, TabWidget: Oui).

Le plus gros problème était de définir la couleur. Le réglage du filtre de couleur n'a rien fait. Donc, j'ai fini par changer les couleurs de chacun des pixels de l'image de 9 patch à l'intérieur d'une boucle.

...    
/**
 * <code>NinePatchDrawableUtility</code> utility class for manipulating nine patch resources.
 * 
 * @author amossman
 *
 */
@TargetApi(Build.VERSION_CODES.HONEYCOMB)
public class NinePatchDrawableUtility {

    // Matches the colors in the supported drawables
    private static final int TAB_UNDERLINE_HIGHLIGHT_COLOR = 1417247097;
    private static final int TAB_UNDERLINE_COLOR = -8882056;
    private static final int TAB_PRESSED_COLOR = -2122745479;

    private Resources resources;

    public NinePatchDrawableUtility(Resources resources) {
        this.resources = resources;
    }

    /**
     * Create a <code>StateListDrawable</code> that can be used as a background for the {@link Android.widget.TabWidget}</br></br>
     * 
     * <code>
     * FragmentTabHost tabHost = ...</br>
     * NinePatchUtility ninePatchUtility = new NinePatchUtility(getResources());</br>
     * TabWidget tabWidget =  tabHost.getTabWidget();</br>
     * for (int i = 0; i < tabWidget.getChildCount(); i++) {</br>
     * &nbsp;&nbsp;&nbsp;tabWidget.getChildAt(i).setBackground(ninePatchUtility.getTabStateListDrawable(titleColor));</br>
     * }
     * </code>
     * 
     * @param tintColor The color to tint the <code>StateListDrawable</code>
     * @return A new <code>StateListDrawable</code> that has been tinted to the given color
     */
    public StateListDrawable getTabStateListDrawable(int tintColor) {
        StateListDrawable states = new StateListDrawable();
        states.addState(new int[] {Android.R.attr.state_pressed},
            changeTabNinePatchColor(resources, R.drawable.cc_tab_selected_pressed_holo, tintColor));
        states.addState(new int[] {Android.R.attr.state_focused},
            changeTabNinePatchColor(resources, R.drawable.cc_tab_selected_focused_holo, tintColor));
        states.addState(new int[] {Android.R.attr.state_selected},
            changeTabNinePatchColor(resources, R.drawable.cc_tab_selected_holo, tintColor));
        states.addState(new int[] { },
            changeTabNinePatchColor(resources, R.drawable.cc_tab_unselected_holo, tintColor));
        return states;
    }

    /**
     * Change the color of the tab indicator.</br></br>
     * 
     * Supports only the following drawables:</br></br>
     * 
     * R.drawable.cc_tab_selected_pressed_holo</br>
     * R.drawable.cc_tab_selected_focused_holo</br>
     * R.drawable.cc_tab_selected_holo</br>
     * R.drawable.cc_tab_unselected_holo</br></br>
     * 
     * Note: This method is not efficient for large <code>Drawable</code> sizes.
     * 
     * @param resources Contains display metrics and image data
     * @param drawable The nine patch <code>Drawable</code> for the tab
     * @param tintColor The color to tint the <code>Drawable</code>
     * @return A new <code>NinePatchDrawable</code> tinted to the given color
     */
    public NinePatchDrawable changeTabNinePatchColor(Resources resources, int drawable, int tintColor) {

        int a = Color.alpha(tintColor);
        int r = Color.red(tintColor);
        int g = Color.green(tintColor);
        int b = Color.blue(tintColor);
        BitmapFactory.Options opt = new BitmapFactory.Options();
        opt.inMutable = true;
        Bitmap bitmap = BitmapFactory.decodeResource(resources, drawable, opt);
        for (int x = 0; x < bitmap.getWidth(); x++) {
            for (int y = 0; y < bitmap.getHeight(); y++) {
                int color = bitmap.getPixel(x, y);
                if (color == TAB_PRESSED_COLOR) {
                    bitmap.setPixel(x, y, Color.argb((int)(a * 0.5), r, g, b));
                } else if (color == TAB_UNDERLINE_HIGHLIGHT_COLOR) {
                    bitmap.setPixel(x, y, Color.argb((int)(a * 0.9), r, g, b));
                } else if (color == TAB_UNDERLINE_COLOR) {
                    bitmap.setPixel(x, y, tintColor);
                }
            }
        }
        return new NinePatchDrawable(resources, bitmap, bitmap.getNinePatchChunk(), new Rect(), null);
    }

}

Exemple d'utilisation:

/**
 * Theme the tab widget with the defined background color and title color set
 * in the TabManager
 * @param tabWidget
 */
@SuppressWarnings("deprecation")
@SuppressLint("NewApi")
public void theme(TabWidget tabWidget) {
    ColorDrawable backgroundDrawable = new ColorDrawable(backgroundColor);
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
        tabWidget.setBackground(backgroundDrawable);
        tabWidget.setAlpha(0.95f);
    } else {
        backgroundDrawable.setAlpha(242);
        tabWidget.setBackgroundDrawable(backgroundDrawable);
    }
    NinePatchDrawableUtility ninePatchUtility = new NinePatchDrawableUtility(resources);
    for (int i = 0; i < tabWidget.getChildCount(); i++) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            tabWidget.getChildAt(i).setBackground(ninePatchUtility.getTabStateListDrawable(titleColor));
        } else {
            tabWidget.getChildAt(i).setBackgroundDrawable(ninePatchUtility.getTabStateListDrawable(titleColor));
        }
        View tabView = tabWidget.getChildTabViewAt(i);
        tabView.setPadding(0, 0, 0, 0);
        TextView tv = (TextView) tabView.findViewById(Android.R.id.title);
        tv.setSingleLine(); // set the texts on the tabs to be single line
        tv.setTextColor(titleColor);
    }
}
2
user3474507

Vous avez la solution pour changer de couleur de surligneur d'onglets après une longue journée de recherche. Deux lignes de code suffisent pour rendre ce travail parfait!

Allez à values ​​/ styles.xml et ajoutez le code ci-dessous dans le thème ActionBar

<item name="colorAccent">@color/Tab_Highlighter</item>

Maintenant, donnez la couleur pour Tab_Highlighter dans colors.xml

<color name="Tab_Highlighter">#ffffff</color>
1
Arun

essayez de suivre.

écrivez tabs_selector_green.xml dans res/drawable.

    <!-- Non focused states -->
<item Android:drawable="@Android:color/transparent" Android:state_focused="false" Android:state_pressed="false" Android:state_selected="false"/>
<item Android:drawable="@drawable/layer_bg_selected_tabs_green" Android:state_focused="false" Android:state_pressed="false" Android:state_selected="true"/>

<!-- Focused states -->
<item Android:drawable="@Android:color/transparent" Android:state_focused="true" Android:state_pressed="false" Android:state_selected="false"/>
<item Android:drawable="@drawable/layer_bg_selected_tabs_green" Android:state_focused="true" Android:state_pressed="false" Android:state_selected="true"/>

<!-- Pressed -->
<!-- Non focused states -->
<item Android:drawable="@Android:color/transparent" Android:state_focused="false" Android:state_pressed="true" Android:state_selected="false"/>
<item Android:drawable="@drawable/layer_bg_selected_tabs_green" Android:state_focused="false" Android:state_pressed="true" Android:state_selected="true"/>

<!-- Focused states -->
<item Android:drawable="@Android:color/transparent" Android:state_focused="true" Android:state_pressed="true" Android:state_selected="false"/>
<item Android:drawable="@drawable/layer_bg_selected_tabs_green" Android:state_focused="true" Android:state_pressed="true" Android:state_selected="true"/>

écrivez layer_bg_selected_tabs_green.xml dans le dossier res/drawable.

<item>
    <shape Android:shape="rectangle" >
        <solid Android:color="@color/tab_green" />

        <padding Android:bottom="5dp" />
    </shape>
</item>
<item>
    <shape Android:shape="rectangle" >
        <solid Android:color="#FFFFFF" />
    </shape>
</item>

et en code Java écrivez ceci.

private static final int[] TABS_BACKGROUND = {
        R.drawable.tabs_selector_orange, R.drawable.tabs_selector_green,
        R.drawable.tabs_selector_red, R.drawable.tabs_selector_blue,
        R.drawable.tabs_selector_yellow };
/*
BLA BLA BLA
*/
@Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
    // TODO Auto-generated method stub
    RelativeLayout tabLayout = (RelativeLayout) tab.getCustomView();
    tabLayout.setBackgroundResource(TABS_BACKGROUND[tab.getPosition()]);
    tab.setCustomView(tabLayout);
/* ... */
}
0
Ganpat Kaliya