How to change change text and arrow color on Toolb

2020-03-11 06:48发布

问题:

I am currently building an app using the new material design guidelines. I am using a Toolbar rather than an action bar.

I want the text, overflow icon, and the arrow/hamburger icon (thing that flips over when you pull out the navigation draw) to be white rather than black, but the rest of my theme needs to be the AppCompat.light theme.

If someone could please explain how i would go about changing these things, i would be very greatful.

I also need to change the colors both in xml and via java code.

And on a sub note, does anyone know how i set a sub-text in the toolbar? I read it is possible, but i cant find any resources on how it is done.

<LinearLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:orientation="vertical"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimaryDark"
        xmlns:android="http://schemas.android.com/apk/res/android"
        />
    <com.bacon.corey.audiotimeshift.SlidingUpPanelLayout xmlns:sothree="http://schemas.android.com/apk/res-auto"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/sliding_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="bottom"
        sothree:panelHeight="0dp"
        sothree:shadowHeight="10dp"
        sothree:paralaxOffset="100dp"
        sothree:fadeColor="@android:color/transparent"

        >

        <android.support.v4.widget.DrawerLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/drawer_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            >
            <!-- The main content view -->




                <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                    xmlns:app="http://schemas.android.com/apk/res-auto"
                    android:padding="0dp"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    >
                    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
                        xmlns:app="http://schemas.android.com/apk/res-auto"
                        android:orientation="vertical"
                        android:padding="0dip"
                        android:gravity="center_horizontal"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_margin="0dp"
                        android:id="@+id/recordingListMainLayout"
                        android:foreground="@drawable/dim_shadow_shape_dark"

                        >

                        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                            xmlns:app="http://schemas.android.com/apk/res-auto"
                            android:orientation="vertical"
                            android:padding="0dp"
                            android:gravity="center_horizontal"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"

                            >

                            <FrameLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent"
                                android:id="@+id/mainLayoutContainer"/>
                <!--
                            <android.support.v4.view.ViewPager
                                android:id="@+id/viewPager"
                                android:layout_width="match_parent"
                                android:layout_height="0px"
                                android:layout_weight="1"
                                android:padding="0dp"
                                android:layout_margin="0dp"
                                />
                -->


                        </LinearLayout>

                    </FrameLayout>
                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent">
                        <FrameLayout
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@drawable/textview_rounded_corner_background_fam"
                            android:layout_alignParentRight="true"
                            android:layout_alignParentBottom="true"
                            android:layout_marginBottom="33dp"
                            android:layout_marginRight="90dp"
                            android:id="@+id/fabMainText"

                            >
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="Main Option - Quick Record"
                                android:textAlignment="center"
                                android:padding="6dp"
                                android:fontFamily="sans-serif-medium"

                                />
                        </FrameLayout>
                        <com.bacon.corey.audiotimeshift.FloatingActionsMenu
                            android:id="@+id/fabMenu"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="bottom|right"
                            android:gravity="right"
                            app:fab_addButtonColorNormal="@color/holo_red_light"
                            app:fab_addButtonColorPressed="@color/c16"
                            app:fab_addButtonPlusIconColor="@color/white"
                            app:fab_expandDirection="up"
                            android:layout_marginTop="10dp"
                            android:layout_marginRight="10dp"
                            android:layout_marginBottom="10dp"
                            android:layout_marginEnd="10dp"
                            android:layout_alignParentRight="true"
                            android:layout_alignParentBottom="true"

                            >
                            <LinearLayout
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal"
                                android:gravity="center_vertical"
                                >
                                <FrameLayout
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:background="@drawable/textview_rounded_corner_background_fam"
                                    android:layout_marginRight="14dp"
                                    >
                                    <TextView
                                        android:layout_width="wrap_content"
                                        android:layout_height="wrap_content"
                                        android:text="Option Four"
                                        android:textAlignment="center"
                                        android:padding="6dp"
                                        android:fontFamily="sans-serif-medium"

                                        />
                                </FrameLayout>

                                <com.bacon.corey.audiotimeshift.FloatingActionButton
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    app:fab_colorNormal="@color/c15"
                                    app:fab_colorPressed="@color/c15"
                                    app:fab_size="mini"
                                    />
                            </LinearLayout>
                            <LinearLayout
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal"
                                android:gravity="center_vertical"
                                >
                                <FrameLayout
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:background="@drawable/textview_rounded_corner_background_fam"
                                    android:layout_marginRight="14dp"

                                    >
                                    <TextView
                                        android:layout_width="wrap_content"
                                        android:layout_height="wrap_content"
                                        android:text="Option Three"
                                        android:textAlignment="center"
                                        android:padding="6dp"
                                        android:fontFamily="sans-serif-medium"
                                        />
                                </FrameLayout>

                                <com.bacon.corey.audiotimeshift.FloatingActionButton
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    app:fab_colorNormal="@color/c8"
                                    app:fab_colorPressed="@color/c8"
                                    app:fab_size="mini"
                                    />
                            </LinearLayout>
                            <LinearLayout
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal"
                                android:gravity="center_vertical"
                                >
                                <FrameLayout
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:background="@drawable/textview_rounded_corner_background_fam"
                                    android:layout_marginRight="14dp"

                                    >
                                    <TextView
                                        android:layout_width="wrap_content"
                                        android:layout_height="wrap_content"
                                        android:text="Option Two"
                                        android:textAlignment="center"
                                        android:padding="6dp"
                                        android:fontFamily="sans-serif-medium"
                                        />
                                </FrameLayout>

                                <com.bacon.corey.audiotimeshift.FloatingActionButton
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    app:fab_colorNormal="@color/a1"
                                    app:fab_colorPressed="@color/a1"
                                    app:fab_size="mini"
                                    />
                            </LinearLayout>
                            <LinearLayout
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal"
                                android:gravity="center_vertical"
                                >
                                <FrameLayout
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:background="@drawable/textview_rounded_corner_background_fam"
                                    android:layout_marginRight="14dp"

                                    >
                                    <TextView
                                        android:layout_width="wrap_content"
                                        android:layout_height="wrap_content"
                                        android:text="Option One"
                                        android:textAlignment="center"
                                        android:padding="6dp"
                                        android:fontFamily="sans-serif-medium"
                                        />
                                </FrameLayout>

                                <com.bacon.corey.audiotimeshift.FloatingActionButton
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    app:fab_colorNormal="@color/a2"
                                    app:fab_colorPressed="@color/a2"
                                    app:fab_size="mini"
                                    />
                            </LinearLayout>
                        </com.bacon.corey.audiotimeshift.FloatingActionsMenu>
                    </RelativeLayout>
                </RelativeLayout>
            <!-- The navigation drawer -->
            <ListView android:id="@+id/left_drawer"
                android:layout_width="240dp"
                android:layout_height="match_parent"
                android:layout_gravity="start"
                android:choiceMode="singleChoice"
                android:divider="@android:color/transparent"
                android:dividerHeight="0dp"
                android:background="#FFFFFF"/>
        </android.support.v4.widget.DrawerLayout>

        <!-- Sliding Panel Layout -->
            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center|top"
                android:textSize="16sp"
                android:id="@+id/slideUpPanel"
                >

            </FrameLayout>

    </com.bacon.corey.audiotimeshift.SlidingUpPanelLayout>
</LinearLayout>

Thanks in advance for any help.

Corey B :)

回答1:

Here is complete style for your toolbar. Explanation is given inline.

<style name="MyToolbar" parent="@style/ThemeOverlay.AppCompat">
    <!-- Title text -->
    <item name="android:textColorPrimary">@android:color/white</item>

    <!-- Title color in AppCompat.Light  -->
    <item name="android:textColorPrimaryInverse">@android:color/white</item>

    <!-- Menu text-->
    <item name="actionMenuTextColor">@android:color/white</item>
    <!-- Overflow -->
    <item name="android:textColorSecondary">@android:color/white</item>
    <!-- This will change drawer icon -->
    <item name="drawerArrowStyle">@style/WhiteDrawerIconStyle</item>
    <!-- background of the  -->
    <!-- <item name="android:background">@color/color_primary</item> -->
</style>


<style name="WhiteDrawerIconStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@android:color/white</item>
</style>

On subtitle note: You can use mToolbar.setSubtitle(sutitle);



回答2:

Put app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" to your Toolbar xml. And arrow turns white.

   <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="@dimen/toolbar_height"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


回答3:

In your app bar, add this property.

app:theme = "@style/Base.V7.Theme.AppCompat"

That should take care of all the whiting. The referenced theme consists of a toolbar with white items, so the toolbar takes the part of the theme that is relevant to it.

Call mToolbar.setSubtitle as discussed above.