Fishingfon Fishingfon - 2 months ago 15
Java Question

How to change change text and arrow color on Toolbar?

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 :)

Answer

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);

Comments