Android में टूलबार बैक बटन का रंग कैसे बदलें?

100

मैं बैक बटन का रंग नहीं बदल सका। मैं टूलबार सामग्री डिजाइन का उपयोग कर रहा हूं। अपने ऐप में मैं टूल बार की काली पृष्ठभूमि को लागू कर रहा हूं, लेकिन बैक डिज़ाइन डिफ़ॉल्ट रूप से काला हो रहा है, इसीलिए मैं बस इस बैक बटन का रंग बदलना चाहता हूं। कृपया मुझे समाधान दें।

धन्यवाद

android 
— नाजिमा कौसर एमएमएफ
स्रोत
3
<शैली का नाम = "MyMaterialTheme.Base" जनक = "Theme.AppCompat.Light.DarkActionBar">
— नाजिमा कौसर MMF

जवाबों:

80

इस शैली का उपयोग करें 

<style name="Theme.MyFancyTheme" parent="android:Theme.Holo">
    <item name="android:homeAsUpIndicator">@drawable/back_button_image</item>
</style>
— अखिल जयकुमार
स्रोत
मैं इस शैली का उपयोग कर रहा हूँ। मुझे इस शैली में क्या बदलना है?
— नाजिमा कौसर MMF
आप बैक बटन के लिए कस्टम इमेज फाइल्स का उपयोग कर सकते हैं। आप इसे @ @ ड्रॉबल / your_image में कॉल कर सकते हैं
— अखिल जयकुमार
यह इसे करने का सबसे अच्छा तरीका है। क्योंकि रंग बदलने के लिए R.drawable.abc_ic_ab_back_mtrl_am_alpha का उपयोग करने के जोखिम हैं, क्योंकि समर्थन संस्करण बार-बार ड्रा करने योग्य संसाधन को बदलता है।
— मुस्तफा इमरान
196

आप अपनी शैलियों में एक शैली जोड़ सकते हैं। xml, 

<style name="ToolbarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">
  <!-- Customize color of navigation drawer icon and back arrow --> 
  <item name="colorControlNormal">@color/toolbar_color_control_normal</item>
</style>

और इसे टूलबार लेआउट में अपने टूलबार में थीम के रूप में जोड़ें। एप्लिकेशन का उपयोग करके : थीम , नीचे देखें

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 
    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="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:theme="@style/ToolbarTheme" >
</android.support.v7.widget.Toolbar>
— राजेन रायरेला
स्रोत
4
एक आकर्षण की तरह काम किया, और सबसे उपयुक्त लगता है।
— विजय कुमार कांता
1
अरे। यह काम करता हैं। अब मुझे सिर्फ iOS के लिए कुछ समकक्ष चाहिए। धन्यवाद!
— अर्नेस्टो
बेहतर होगा कि इसे
— टूलबारथीम कहा जाए
1
मेरे लिए <style name = "ToolbarTheme" parent = "@ style / Theme.AppCompat.NoActionBar"> काम किया। मेरा मुख्य ऐप विषय <style name = "AppTheme" parent = "Theme.AppCompat.NoActionBar">
— Yar
3
इसने काम कर दिया। यह स्वीकृत उत्तर की तुलना में अधिक उपयुक्त है।
— डोमेनिको
87

यहां app:themeटूलबार के लिए लाइट और डार्क थीम प्राप्त करने का सबसे सरल तरीका है। आपको टूलबार टैग के मूल्य को बदलना होगा

  • के लिए काले टूलबार शीर्षक और काले ऊपर तीर , अपने टूलबार विषय निम्नलिखित को लागू करना चाहिए:

एप्लिकेशन: विषय = "@ शैली / ThemeOverlay.AppCompat.Light"

ब्लैक टूलबार शीर्षक और ऊपर तीर

  • के लिए व्हाइट टूलबार शीर्षक और व्हाइट ऊपर तीर , अपने टूलबार विषय निम्नलिखित को लागू करना चाहिए:

एप्लिकेशन: विषय = "@ शैली / ThemeOverlay.AppCompat"

सफेद टूलबार शीर्षक और ऊपर तीर

— ch3tanz
स्रोत
66
सफेद टूलबार शीर्षक और व्हाइट अप तीर के लिए, निम्नलिखित विषय का उपयोग करें: Android: theme = "@ style / ThemeOverlay.AppCompat.Dark.ActionBar"
— अमोल पाटिल
मैं यह समझने की कोशिश कर रहा हूं कि इसका नाम ThemeOverlay क्यों है? मैं यहां केवल सरल Theme.AppCompat.Dark.ActionBar का उपयोग क्यों नहीं कर सकता?
— गकेट
@ ch3tanz क्या आप एक्शनबार या टूलबार का उपयोग कर रहे हैं? आप ActionBar शैलियों का उपयोग क्यों करते हैं?
— f470071
@ f470071 मैं टूलबार का उपयोग कर रहा हूं। यह सिर्फ शैली है जो सभी संस्करणों में समर्थन करेगी। यदि आपका ऐप लॉलीपॉप से ​​ऊपर लक्षित कर रहा है, तो आप सामग्री डिज़ाइन शैलियों का उपयोग कर सकते हैं।
— ch3tanz
Theme.AppCompat.Light.DarkActionBarमेरे मामले में।
— इवी सांग
30

सफेद टूलबार शीर्षक और व्हाइट अप तीर के लिए, निम्नलिखित विषय का उपयोग करें: 

android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
— पंकज तलाविया
स्रोत
बहुत बहुत धन्यवाद, सभी हल के ऊपर केवल यह मेरे लिए काम करता है।
— एमडी जुएल राणा
21

इसे इस्तेमाल करो:

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
</style>
— सबिन आचार्य
स्रोत
5
इसे स्वीकार किया जाना चाहिए। यहां हर उत्तर सिर्फ आइकन को बदलने के लिए है, रंग के नहीं।
— मीकल Jablonski
12

इसे इस्तेमाल करे,

final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(getResources().getColor(R.color.grey), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(upArrow);
— पार्थ भयानी
स्रोत
6

आपको इसके लिए शैली बदलने की आवश्यकता नहीं है। अपने टूलबार को एक्शनबार के रूप में स्थापित करने के बाद, आप इस तरह से कोड कर सकते हैं

android.getSupportActionBar().setDisplayHomeAsUpEnabled(true);
android.getSupportActionBar().setHomeAsUpIndicator(R.drawable.back);
//here back is your drawable image

लेकिन आप इस विधि से बैक एरो का रंग नहीं बदल सकते

— नेविल घेलानी
स्रोत
6

यदि आप सफेद बैक बटन (←) और सफेद टूलबार शीर्षक चाहते हैं, तो इसका अनुसरण करें:

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

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
    </android.support.design.widget.AppBarLayout>

से विषय बदलें Darkकरने के लिए Lightयदि आप काला वापस बटन (←) और काले उपकरण पट्टी शीर्षक चाहते हैं।

— NHP
स्रोत
6

बस MaterialToolbarडिफ़ॉल्ट रंगों का उपयोग करें और ओवरराइड करें:

    <com.google.android.material.appbar.MaterialToolbar
        style="@style/Widget.MaterialComponents.Toolbar.Primary"
        android:theme="@style/MyThemeOverlay_Toolbar"
        ..>

साथ में:

  <style name="MyThemeOverlay_Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
    <!-- color used by navigation icon and overflow icon -->
    <item name="colorOnPrimary">@color/...</item>
  </style>

यहां छवि विवरण दर्ज करें

यदि आप डिफ़ॉल्ट शैली androidx.appcompat.widget.Toolbarके MaterialToolbarसाथ या ( Widget.MaterialComponents.Toolbarआप) का उपयोग कर रहे हैं:

<androidx.appcompat.widget.Toolbar
    android:theme="@style/MyThemeOverlay_Toolbar2"

साथ में:

  <style name="MyThemeOverlay_Toolbar2" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
    <!-- This attributes is used by title -->
    <item name="android:textColorPrimary">@color/white</item>

    <!-- This attributes is used by navigation icon and overflow icon -->
    <item name="colorOnPrimary">@color/secondaryColor</item>
  </style>
— गेब्रियल मारीओटी
स्रोत
5

आप app:navigationIconशीर्षक रंग का उपयोग करके और अपने खुद के आइकन का उपयोग कर सकते हैंapp:titleTextColor

उदाहरण:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="@color/colorPrimary"
        app:navigationIcon="@drawable/ic_arrow_back_white_24dp"
        app:titleTextColor="@color/white" />
— मोहम्मद नगेह
स्रोत
यह मेरे लिए काम करता है बस इस लाइन का उपयोग करके किसी भी आइकन को सेट करेंapp:navigationIcon="@drawable/ic_back_black"
— अभिषेक
इसे मदद मिली।
— मोहम्मद नगेह
4

मुझे लगता है कि अगर थीम को कुछ समस्या उत्पन्न करनी चाहिए, लेकिन इसके गतिशील रूप से काले तीर सेट करें। तो मैं सुझाव देता हूं कि यह प्रयास करें।

Drawable backArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
backArrow.setColorFilter(getResources().getColor(R.color.md_grey_900), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(backArrow);
— सिद्धार्थ पटेल
स्रोत
2
आपका समाधान @Parth Bhayani से कैसे भिन्न है?
— कूलमाइंड
3

मैं <style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar>अपने Android एप्लिकेशन और NoActionBar थीम में थीम का उपयोग कर रहा हूं , colorControlNormalमेरे टूलबार में नेविगेशन आइकन डिफ़ॉल्ट बैक बटन एरो का रंग बदलने के लिए संपत्ति का उपयोग किया जाता है

styles.xml

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/your_color</item> 
</style>
— Android Player_Shreeya
स्रोत
2

सरल और कोई चिंता नहीं

 <?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:titleTextColor="@color/white"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

        <include layout="@layout/testing" />

    </android.support.design.widget.CoordinatorLayout>
— शून्य सूचक अपवाद
स्रोत
2

मैंने इस तरह से सामग्री घटक पुस्तकालय का उपयोग किया:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowToggle</item>
</style>

<style name="AppTheme.DrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@android:color/white</item>
</style>
— सैम
स्रोत
यह काम करता है: यह आपको हैमबर्गर मेनू आइकन का रंग बदलने की अनुमति देता है।
— lnaie
1

आप इस कोड को अपने जावा क्लास में जोड़ सकते हैं। लेकिन आपको पहले एक वेक्टर एसेट बनाना होगा, ताकि आप अपने एरो को वापस कस्टमाइज़ कर सकें।

actionBar.setHomeAsUpIndicator(R.drawable.ic_arrow_back_black_24dp);
— मोचमद फांडी
स्रोत
0

Android पर टूलबार को स्टाइल करने के लिए 21+ यह थोड़ा अलग है।

<style name="DarkTheme.v21" parent="DarkTheme.v19">
        <!-- toolbar background color -->
        <item name="android:navigationBarColor">@color/color_primary_blue_dark</item>
        <!-- toolbar back button color -->
        <item name="toolbarNavigationButtonStyle">@style/Toolbar.Button.Navigation.Tinted</item>
    </style>

    <style name="Toolbar.Button.Navigation.Tinted" parent="Widget.AppCompat.Toolbar.Button.Navigation">
        <item name="tint">@color/color_white</item>
    </style>
— पेड्रो रोमानो
स्रोत
-1

अगर आप सफेद रंग में सिस्टम बैक कलर चाहते हैं तो आप इस कोड का उपयोग कर सकते हैं

<com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:elevation="0dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar_notification"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:contentInsetLeft="0dp"
            app:contentInsetStart="0dp"
            app:contentInsetStartWithNavigation="0dp">

            <include layout="@layout/action_bar_notification" />
        </androidx.appcompat.widget.Toolbar>
    </com.google.android.material.appbar.AppBarLayout>

नोट: - android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" कुंजी है

पेस्ट आपकी गतिविधि में है जहां आप एक्शन बार पर बैक बटन दिखाना चाहते हैं

final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_notification);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(false);
— iamkdblue
स्रोत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.