1

I'm developing an app with material design.

I have added a toolbar to the activity & I have set it's theme to be light here: app:popupTheme="@style/ThemeOverlay.AppCompat.Light", but still I'm getting a dark theme after running it.

Here's my activity_about.xml file's code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context="com.abc.xyz.AboutActivity">

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

</RelativeLayout>

Here's AboutActivity.java file's code:

public class AboutActivity extends AppCompatActivity {

    Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_about);

        SpannableString s = new SpannableString("About");
        s.setSpan(new TypefaceSpan(this, "Pacifico.ttf"), 0, s.length(),
                Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setTitle(s);

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_about, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

Here's styles.xml file's code:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
    </style>

    <style name="MyMaterialTheme" parent="MyMaterialTheme.Base">

    </style>

    <style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

I'm new to material design & hence don't know what to do.

Please let me know.

I'm new to StackOverflow, so please cooperate.

Thanks in advance.

5 Answers5

0

You have to change you xml AppTheme.

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:layout_scrollFlags="scroll|enterAlways"
    app:theme="@style/ThemeOverlay.Material.Light.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
pRaNaY
  • 24,642
  • 24
  • 96
  • 146
  • After changing the parent theme from `parent="Theme.AppCompat.Light.DarkActionBar"` to `parent="Theme.AppCompat.Light.ActionBar"`. It reads: `"Cannot resolve symbol: parent="Theme.AppCompat.Light.ActionBar""`. What to do now? –  Oct 03 '15 at 03:21
  • check edits for more and also check this [link](http://stackoverflow.com/questions/23155637/change-background-color-of-the-action-bar-using-appcompat) – pRaNaY Oct 03 '15 at 03:27
0

You have to make Toolbar theme in your xml file

In styles.xml

 <style name="ToolbarTheme" parent="ThemeOverlay.AppCompat.Light">

    <item name="colorPrimary">@color/seccolor</item>
    <item name="colorControlHighlight">@color/md_white_1000</item>
</style>

And Now In your Main xml File use it

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="?attr/colorPrimaryDark"
        android:elevation="4dp"
        android:theme="@style/ThemeOverlay.AppCompat.Light"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        android:layout_gravity="center_horizontal|top" />

It should Work.

0

The app:popupTheme attribute is for the menu popup, and all other popups that overlay the toolbar.

May be your toolbar is not getting themed because you haven't referenced the correct theme in AndroidManifest.xml.

Make sure it is like this:

<manifest>
    <application
        ...
        android:theme="@style/MyMaterialTheme.Base">

        <activity/>
        ...

    </application>
</manifest>

That'll theme all the activities in your app. You can even apply it on individual activities.

Aditya Naique
  • 1,120
  • 13
  • 25
0

In your styles.xml

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
</style>

<style name="MyMaterialTheme" parent="MyMaterialTheme.Base">

</style>

<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

the parent of your main theme is

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

also in your MyMaterialTheme.Base has parent as

<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">

Removing the .DarkActionBar from both will help. Then you can probably add a style for your toolbar as mentioned in above answers.

Hope it helps.

Anshul Vyas
  • 317
  • 2
  • 7
  • 18
0

The problem here was that I was not applying a theme for toolbar.

I fixed this by adding just this line: android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" to my toolbar widget in xml files.

Thanks all for your efforts!