I have a theme that works but refuses to set android:windowBackgorund and android:colorBackground.
The rest of the code works properly, and if I switch the items in the default theme it works properly.
styles.xml:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:navigationBarColor">#color/colorPrimary</item>
<item name="android:radioButtonStyle">#style/radioLight</item>
</style>
<style name="Dark" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:navigationBarColor">#color/colorPrimary</item>
<item name="android:windowBackground">#color/grey</item>
<item name="android:colorBackground">#color/grey</item>
<item name="android:textColor">#color/white</item>
<item name="android:textColorHint">#color/soft_grey</item>
<item name="android:radioButtonStyle">#style/radioDark</item>
</style>
Main:
setTheme(R.style.Dark);
Don't know if it's useless
activity_main xml:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:scrollbars="none"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="35dp" />
</android.support.design.widget.AppBarLayout>
What's the shameful mistake i committed?
Add 2 new resource files:
For light theme splash_background.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/white" />
<item>
<bitmap android:gravity="center"
android:src="#drawable/logo"/>
</item>
</layer-list>
for dark theme splash_background.xml place it in drawable-night folder (create if you dont have it ):
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/grey" />
<item>
<bitmap android:gravity="center"
android:src="#drawable/logo"/>
</item>
</layer-list>
Finally In your themes.xml:
<style name="Theme.AppName.SplashTheme" parent="Theme.AppName">
<item name="android:windowBackground">#drawable/splash_background</item>
</style>
android:windowBackground only accepts a drawable. Try changing it to something like
<item name="android:windowBackground">#drawable/abc</item>
And create a file abc.xml such as
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#color/grey"/>
</shape>
And just checking, do you call setTheme before calling super.onCreate()?
Related
I am trying to create an oval shape around my bottom navigation icon when selected as seen in the screenshot
bottom_nav_layout.xml
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNav_view"
android:layout_width="match_parent"
android:layout_height="56dp"
android:elevation="0dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:theme="#style/Widget.BottomNavigationView"
app:itemIconSize="20dp"
app:itemIconTint="#color/bottom_nav_color"
app:itemTextColor="#color/bottom_nav_color"
app:labelVisibilityMode="labeled"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_nav_menu" />
bottom_nav_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#3375BB" />
<item android:state_checked="false" android:color="#68788D"/>
</selector>
bottom_nav_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/navigation_home"
android:icon="#drawable/ic_trustwallet"
android:title="Wallet" />
<item
android:id="#+id/navigation_discover"
android:icon="#drawable/ic_discover"
android:title="Discover" />
<item
android:id="#+id/navigation_browser"
android:icon="#drawable/ic_browser"
android:title="Browser" />
<item
android:id="#+id/navigation_settings"
android:icon="#drawable/ic_paper_settings"
android:title="Settings" />
</menu>
Use a M3 theme in your app:
<style name="AppTheme" parent="Theme.Material3.DayNight">
Then in your layout:
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNav_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.App.BottomNavigationView"
with:
<style name="ThemeOverlay.App.BottomNavigationView" parent="">
<item name="colorSurface">#d1e4ff</item>
<item name="colorSecondaryContainer">#0061a3</item>
</style>
I need to change the title color of my menu on my drawer navigation activity.
This is part of my activity_main.xml:
<com.google.android.material.navigation.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/naView"
android:fitsSystemWindows="false"
android:background="#drawable/navbackground"
android:layout_gravity="start"
app:itemIconTint="#color/grayWhite"
app:headerLayout="#layout/navigationheader"
app:menu="#menu/menu">
And this is my activity_main_drawer.xml: (this file is inside the menu folder)
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<group android:checkableBehavior="single">
<item
android:id="#+id/vibrationItem"
android:icon="#drawable/ic_baseline_vibration_24"
android:title="vibration" />
<item
android:id="#+id/Settings"
android:icon="#drawable/ic_baseline_settings_24"
android:title="Settings" />
</group>
<item android:title="others">
<menu>
<item android:title="Logout"
android:id="#+id/Logout"
android:icon="#drawable/logout"/>
</menu>
</item>
</menu>
This is what I get from my code, and how you see the "other" is displayed with a different color:
I saw many solutions on StackOverflow but I have not found a good solution for my problem.
The color of the title group is based on color defined by the android:textColorSecondary item in your app theme.
<style name="AppTheme" parent="Theme.MaterialComponents.*">
<item name="android:textColorSecondary">#color/....</item>
</style>
You can override the android:textColorSecondary color with:
<com.google.android.material.navigation.NavigationView
android:theme="#style/ThemeOverlay.titleColor"
..>
with:
<style name="ThemeOverlay.titleColor" parent="">
<item name="android:textColorSecondary">#color/....</item>
</style>
go to your strings.xml file and write this:
<string name="namestring"><font fgcolor='#YOUR_COLOR'>others</font></string>
now go to your menu.xml file and change your code to this:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<group android:checkableBehavior="single">
<item
android:id="#+id/vibrationItem"
android:icon="#drawable/ic_baseline_vibration_24"
android:title="vibration" />
<item
android:id="#+id/Settings"
android:icon="#drawable/ic_baseline_settings_24"
android:title="Settings" />
</group>
<item android:title="#string/namestring">
<menu>
<item android:title="Logout"
android:id="#+id/Logout"
android:icon="#drawable/logout"/>
</menu>
</item>
</menu>
I have a problem with a Toolbar (with TabLayout) during the scroll, as it also hides the notification bar, making it look the title of the toolbar.
Here the layout of the activity:
<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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.testapp.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<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/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
How can i solve this? I've seen apps like Google Play or Phonograph not have this problem.
Thanks in advance.
Regards.
UPDATE
Here is my style.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>
And style.xml v21
<resources>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
</resources>
About the response of MML13 to remove fitsSystemWindows, it works, but the notification bar loses color, being white.
Try this.
Change this part.
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
To this.
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#color/colorPrimaryDark</item>
</style>
Hope this will help you.
Change
app:layout_scrollFlags="scroll|exituntilcollapse"
instead of
app:layout_scrollFlags="scroll|enterAlways"
remove:
android:fitsSystemWindows="true"
from CoordinatorLayout
you must use:
valuse style:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#673AB7</item>
<item name="colorPrimaryDark">#512DA8</item>
<item name="colorAccent">#FF4081</item>
</style>
values-v21:
<style name="Theme.DesignDemo" parent="AppTheme">
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
I want to apply different themes to my application. I want to change the color of navigation bar and floating action button.
Now I am able to change color of navigation bar , but floating action button's color dose not get change. How can I change color of fab dynamically when theme is changed?
Style:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorAccent_500">#color/accent_500</item>
<item name="colorAccent_700">#color/accent_700</item>
<item name="windowActionBarOverlay">false</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#color/background_material_light</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
<style name="BlueTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#3F51B5</item>
<item name="colorPrimaryDark">#303F9F</item>
<item name="colorAccent">#03A9F4</item>
<item name="windowActionBarOverlay">false</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#color/background_material_light</item>
</style>
<style name="AppTheme.Solarized">
<item name="colorPrimary">#color/orange300</item>
<item name="colorPrimaryDark">#color/orange500</item>
<item name="colorAccent">#color/solarizedOrange</item>
<item name="android:textColorPrimary">#color/solarizedBase01</item>
<item name="android:textColorSecondary">#color/solarizedBase1</item>
</style>
</resources>
Fab :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_fab"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="bottom|end">
<View
android:id="#+id/myfab_shadow"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_gravity="center"
android:background="#drawable/fab_shadow"
android:focusable="false" />
<ImageButton
android:id="#+id/imgbtn_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/fab_selector"
android:cropToPadding="true"
android:padding="10dp"
android:src="#drawable/ic_add_white_36dp"
android:stateListAnimator="#animator/fab_elevation_selector" />
</FrameLayout>
Fab selector :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#color/colorAccent" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="#color/accent_700" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#color/accent_500" />
</shape>
</item>
</selector>
Thank you..
The floating action button is colored based on your colorAccent
<style name="AppTheme" parent="Base.Theme.AppCompat.Light">
<item name="colorAccent">#color/accent</item>
</style>
Or from code:
fab.setBackgroundTintList(getResources().getColorStateList(R.color.blue));
Or from XML:
Change attribute of app:backgroundTint
But it seems that you are using ImageButton not FloatingActionButton, You should use:
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin" />
And in the dependencies add:
dependencies {
compile 'com.android.support:design:23.1.1'
}
Thank you for answers. But I just changed in fab selector.
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="?attr/colorAccent" />
</shape>
</item>
This worked..
Please use the material shape theme with the floating button, its very easy now no need for customization
I am creating custom rating bar.The problem is that drawables are not overlaying properly,because there are two different images with same hight and width.It should be like this when the progress will be updated the default image should be replaced by the image2. Any idea?
<RatingBar
android:layout_weight="1"
android:numStars="5"
android:stepSize="1"
android:progressDrawable="#drawable/customselector"
android:layout_width="wrap_content"
android:layout_height="0dp"/>
Here is my custom selector
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background"
android:drawable="#drawable/image1" />
<item android:id="#android:id/secondaryProgress"
android:drawable="#drawable/image1" />
<item android:id="#android:id/progress"
android:drawable="#drawable/image2" />
</layer-list>
The way I set the selector to the RatingBar is a bit different, but I don't know if it will help:
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/ratingBar"
android:rating="3"
android:numStars="5"
android:stepSize="1"
android:isIndicator="false"
style="#style/mileageRatingBar"/>
In your values/styles.xml file put this:
<style name="mileageRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/rating_stars</item>
<item name="android:minHeight">32dip</item>
<item name="android:maxHeight">32dip</item>
</style>
You can of course change the size. And as you can see here is the reference to the custom drawable.
Remove
android:progressDrawable="#drawable/customselector"
and add style in your values/styles.xml
to be like this
<RatingBar
android:layout_weight="1"
android:numStars="5"
android:stepSize="1"
android:layout_width="wrap_content"
android:layout_height="0dp"
style="#style/customRatingBar"/>
your style from styles.xml
<style name="customRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/customselector</item>
<item name="android:minHeight">32dip</item>
<item name="android:maxHeight">32dip</item>
</style>
the customselector.xml file must place in drawable folder
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background"
android:drawable="#drawable/image1" />
<item android:id="#android:id/secondaryProgress"
android:drawable="#drawable/image1" />
<item android:id="#android:id/progress"
android:drawable="#drawable/image2" />
</layer-list>
make sure item id is written correctly , then you have two option to assign drawable as image or put your selector into your drawable folder selector.xml with your custom setting
instead of image1 put ratingbar_empty.xml
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:state_focused="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="#drawable/image1" />
<item android:drawable="#drawable/image1" />
</selector>
the same to progress but change selector to image2