Toolbar is not working same in different devices Android Studio - android

I was working on an app with some pages in it. During my development phase I always tested my code with an Android Virtual Device (API: 22, Android 5.1), after publishing the app I downloaded it to my phone (API: 26, Android 8.0) and faced it with differences which i was not expecting. The source of problems was the toolbar.
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" with this code I set both title's and back button's color to white however title's color was grayish and all letters were changed to uppercase.
In my sub-activities I overrode onOptionsItemSelected method and
Toolbar toolbar = findViewById(R.id.toolbar);
setActionBar(toolbar);
getActionBar().setDisplayHomeAsUpEnabled(true);
getActionBar().setDisplayShowHomeEnabled(true);
used these methods to use back button. However, only one of the back buttons worked, others were useless.
Most probably its because of version difference, but couldn't find the proper solution.

Please try Below code:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.Custom.Dark"parent="Theme.AppCompat.NoActionBar">
<item name="actionBarStyle">#style/Theme.AppCompat</item>
</style>
<style name="Theme.Custom.Light" parent="Theme.AppCompat.Light.NoActionBar">
<item name="actionBarStyle">#style/Custom.Dark</item>
</style>
</resources>

Related

When targeting API 26, overflow menu items become invisible

I have an options menu in my app, which has more than six items, so there is a "More" item that brings up the overflow menu. The menu is posted by the default menu triggers, and a custom trigger that invokes Activity.openOptionsMenu().
The menu itself is built from this resource file:
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+id/mi_copy"
android:title="Copy"
android:icon="#drawable/copy"/>
<item android:id="#+id/mi_paste"
android:title="Paste"
android:icon="#drawable/paste"/>
<item android:id="#+id/mi_preferences"
android:title="Preferences"
android:icon="#android:drawable/ic_menu_preferences"/>
<item android:id="#+id/mi_flip_calc_printout"
android:title="Print-Out"
android:icon="#drawable/printer"/>
<item android:id="#+id/mi_clear_printout"
android:title="Clear Print-Out"
android:icon="#android:drawable/ic_menu_close_clear_cancel"/>
<item android:id="#+id/mi_about"
android:title="About Free42"/>
<item android:id="#+id/mi_import"
android:title="Import Programs"/>
<item android:id="#+id/mi_export"
android:title="Export Programs"/>
</menu>
So far, so good. The menu and the Java logic that creates and posts it has worked for years, but now I'm changing the targetSdkVersion from API level 8 to 26, per the latest Play requirements, and now all of a sudden, the menu items in the overflow menu have become invisible.
The overflow menu still posts, and it still has the correct size, and the menu items still work. You just can't see them any more: the whole menu is solid black now, which is the normal background color; the menu item text is missing.
The phone on which I'm testing is a Motorola G5 running Android 8.1.0. This is the only device I have available for testing with API 26 at the moment, at least until I figure out how to create an AVD with API >= 26.
N.B. In the Android simulator with an API level 8 image, the overflow menu still looks fine. It used to look fine on the Moto G5 as well, before I targeted API 26. If I change the target back to 8, the overflow menu works again.
Any thoughts on what I could do to fix this? My Google skills aren't working on this one... Any ideas would be most welcome!
I added this style file as res/values/styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Free42Theme" parent="android:style/Theme.NoTitleBar">
<item name="android:itemBackground">#android:color/white</item>
</style>
<style name="Free42Theme.Fullscreen" parent="android:style/Theme.NoTitleBar.Fullscreen">
<item name="android:itemBackground">#android:color/white</item>
</style>
</resources>
The first is the default theme, specified by changing the android:theme attribute on the Activity from #android:style/Theme.NoTitleBar to #style/Free42Theme in AndroidManifest.xml; the second is the full-screen theme, set in the Java code, by changing the setTheme(android.R.style.Theme_NoTitleBar_Fullscreen) call to setTheme(R.style.Free42Theme_Fullscreen).
This changes the background of the overflow menu to white, making the black item text visible, verified on my G5. Running in the simulator with Android 2.2 (API level 8), the appearance is unchanged since the background was white there from the start.
Many thanks to SteelToe for getting me on the right track!

App with white toolbar and dark text

I have been trying to achieve this in a project with minSDK 16 :
Actionbar and statusbar in White color with dark text and icons.
Like this:
I have been trying to figure this out for ages now. Google searches lead to a lot of answers that dont make any sense and/or dont support older api's. colorControlNormal, titleTextColor, Appcompat-this, Appcompat-that... its a nightmare!
I am also not able to find any docs on what items to put in my styles xml, and none of the combinations of style properties I tried seem to have any effect whatsoever.
So can someone please give me a proper and well explained walkthrough as to how I can acheive this effect?
Thanks.
you can try with that
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:statusBarColor">#color/white</item>
<item name="android:windowLightStatusBar">true</item>
</style>
but API min is 23.
Also, don't forget to use different styles for different versions of APIs so far I haven't found an app that works as you want, so most probably isn't possible.
Add these to your Base Application Theme in styles.xml
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
And add following attribute to your parent layout:
android:fitsSystemWindows=”true”
You can customize your toolbar with custom view as follows:
Create your view inside toolbar and use in you code as you want
XML:
<android.support.v7.widget.Toolbar>
</android.support.v7.widget.Toolbar>
Java:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
This will help you

How to customize the "up" button when the searchView is being expanded?

Background
My app has the ability to search for items (which are other apps) using the SearchView on the ActionBar.
The app uses the support library of Google, and it works well on all versions of Android from API 9 .
The problem
On Lollipop, when I click the search action item in order to start searching, I notice that the up/back button on the top-left corner gets to be white, which is bad for this case since the actionbar background is also quite white:
Weird thing is that it doesn't always occur, and I don't think it occurs on Android versions that aren't Lollipop (tested on multiple emulators and devices).
Another weird thing is that the navigation drawer icon seems ok, as well as the X icon inside the searchView.
Here's the XML of the toolbar I have:
<android.support.v7.widget.Toolbar
android:id="#+id/activity_app_list__toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize" />
the "colorPrimary" is set to be : #ffEFEFEF .
Also, the theme's parent of the activity is "Theme.AppCompat.Light.NoActionBar" , as I've set the toolbar to be the actionBar.
The question
How can I fix this issue?
What is the cause for this issue? How come it works fine on other Android versions?
It seems like a known issue: https://code.google.com/p/android/issues/detail?id=78346 .
workaround is here: https://code.google.com/p/android/issues/detail?id=78346#c5 , meaning:
values-21/themes.xml:
<style name="MyTheme" parent="Theme.AppCompat">
<item name="homeAsUpIndicator">#drawable/abc_ic_ab_back_mtrl_am_alpha</item>
</style>
That's it. Hope it gets fixed later.
In order to customize it, I assume I can use it, and also choose the color using "colorControlNormal"
I'd guess the "app:collapseIcon" attribute is what you were looking for?
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbarHeight"
app:collapseIcon="#drawable/collapseBackIcon" />
How can I fix this issue?
I created a utility class for this (and other) problems. Get it here:
https://gist.github.com/consp1racy/96958a1dedf5a99d4ca5
Part 1: Call the following method in your Activity.onCreate(Bundle):
ToolbarUtils.fixToolbar(mToolbar);
Part 2: The code uses value android:colorControlNormal from the Toolbar "theme" you specified in the layout. If you use support library and defined only colorControlNormal you need to add the following line after it:
<item name="android:colorControlNormal" tools:ignore="NewApi">?attr/colorControlNormal</item>
What is the cause of this issue?
After a lot of thought and experiments it seems that the arrow uses the original bitmap, which is white, without any coloring, which is wrong.
Note: The menu overflow icon also reads the android:colorControlNormal so now it will display correct color as well.
EDIT: Prerequisites:
Your Toolbar should have attributes similar to the following
<!-- custom toolbar theme -->
<item name="theme">#style/ThemeOverlay.MyApp.ActionBar</item>
<!-- light popup menu theme, change this if you need to -->
<item name="popupTheme">#style/ThemeOverlay.AppCompat.Light</item>
<!-- app bar background color -->
<item name="android:background">#color/material_deep_orange_500</item>
Then the toolbar theme should look something like this
<!-- example uses dark app bar template, feel free to change it to light if you need to -->
<style name="ThemeOverlay.MyApp.ActionBar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<!-- this line defines title text color -->
<item name="android:textColorPrimary">#color/material_white_100</item>
<!-- this line defines subtitle text color -->
<item name="android:textColorSecondary">#color/material_white_70</item>
<!-- this line defines up/hamburger/overflow icons color -->
<item name="colorControlNormal">#color/material_black_54</item>
<!-- this line is necessary for proper coloring on lollipop - do not delete it -->
<item name="android:colorControlNormal" tools:ignore="NewApi">?attr/colorControlNormal</item>
</style>

Style ActionMode

I am using ActionBarSherlock and trying to style ActionMode. I can change background and done button using these attributes in my style:
<item name="android:actionModeCloseDrawable">#drawable/abs__ic_cab_done_holo_dark</item>
<item name="android:actionModeBackground">#drawable/actionbar_bg</item>
But I can not figure out how to set the color of the vertical line just next to the done button. Does anyone know how to do this?
I solved it with this code in my theme:
<item name="android:actionModeCloseButtonStyle">#style/action_button_done</item>
And the style action_button_done just sets the background drawable:
<style name="action_button_done" parent="Widget.Sherlock.ActionButton.CloseMode">
<item name="android:background">#drawable/abs__btn_cab_done_holo_dark</item>
</style>
Warning
This should be a simple thing to do. And it was, but for some reason htc decided to put an extra layer on top of the button that makes it impossible to style it. I was just lucky that I tried deploying on my friends samsung galaxy nexus and noticed that it actually worked. I only used htc one x, so don't know if it is the same on other htc devices.

ActionBasSherlock, Holoeverywhere and themes

I'm trying to implement the choice of two themes, Dark and Light.
The dark one is working fine, but when I choose the light theme it's rendered not correctly (the action bar is light, the text is dark but the backgorund is still dark).
By the way in the eclipse preview it's shown correctly.
I'm using the dev branch from Holoeverywhere and I'm extending the themes like this:
styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="DarkTheme" parent="Holo.Theme"/>
<style name="LightTheme" parent="Holo.Theme.Light"/>
</resources>
Any help?
EDIT
I've just tried with the emulator (3.2, on a tablet) and it's showing the theme correctly.
I will do a couple of tests and eventually open an issue on github.
I've finally found the solution: Theme_HoloEverywhereLight_Sherlock showing dark background
(I've looked for hours and it came up just now.)
Basically the setTheme should be done before everything, even before the super.onCreate(savedInstanceState);, I was doing it just after..

Categories

Resources