I tried to customise the dividers between the tabs of the TabBar, but it seems that the customisation isn't working properly!
Here's the link to the screenshot: http://imgur.com/vhcwIGx
Here's my styles.xml file's code:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:actionBarStyle">#style/ActionBarStyle</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle</item>
<item name="android:actionBarTabTextStyle">#style/ActionBarTabTextStyle</item>
<item name="android:actionBarTabBarStyle">#style/ActionBarTabBarStyle</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/ActionBarStyle</item>
<item name="actionBarTabStyle">#style/ActionBarTabStyle</item>
<item name="actionBarTabTextStyle">#style/ActionBarTabTextStyle</item>
<item name="actionBarTabBarStyle">#style/ActionBarTabBarStyle</item>
</style>
<!-- ActionBar styles -->
<style name="ActionBarStyle" parent="#style/Widget.AppCompat.Light.ActionBar">
<!-- Customize your theme here. -->
<item name="android:background">#color/light_purple</item>
<!-- Support library compatibility -->
<item name="background">#color/light_purple</item>
</style>
<!-- ActionBar tabs styles -->
<style name="ActionBarTabStyle" parent="#style/Widget.AppCompat.Light.ActionBar.TabView">
<!-- tab indicator -->
<item name="android:background">#drawable/actionbar_tab_indicator</item>
<!-- Support library compatibility -->
<item name="background">#drawable/actionbar_tab_indicator</item>
</style>
<!-- ActionBar tabsText styles -->
<style name="ActionBarTabTextStyle" parent="#style/Widget.AppCompat.Light.ActionBar.TabBar">
<!-- text style -->
<item name="android:textColor">#color/light_purple</item>
<item name="android:textStyle">bold</item>
</style>
<!-- Action bar tab bar style -->
<style name="ActionBarTabBarStyle" parent="#style/Widget.AppCompat.Light.ActionBar.TabBar">
<item name="android:showDividers">middle</item>
<item name="android:divider">#drawable/divider_style</item>
<item name="android:dividerPadding">8dp</item>
<!-- Support library compatibility -->
<item name="showDividers">middle</item>
<item name="divider">#drawable/divider_style</item>
<item name="dividerPadding">8dp</item>
</style>
<style name="WalkthroughThemes" parent="Theme.AppCompat.Light.NoActionBar">
</style>
</resources>
Here's my divider_style.xml file's code:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="1.5dp" android:right="1.5dp" android:drawable="#color/light_purple">
<shape android:shape="line" android:tint="#color/light_purple">
</shape>
</item>
</layer-list>
I am unable to figure out what to do here.
Please let me know what to do.
I'm new to StackOverflow, so please cooperate.
Thanks in advance.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="0dp" android:right="0dp" android:bottom="1dp" android:drawable="#color/light_purple">
<shape android:shape="line" android:tint="#color/light_purple">
</shape>
</item>
</layer-list>
Related
I am tried to change my font on entire app with Style.xml and it should change font everywhere on my app but i am getting same old font everywhere, only i see changes on dialog title not other places. Check the screenshot of app only no.2 screen dialog has changes. Can you please help me out. I am not able to get what wrong i am doing here.
Style.xml
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorPrimary">#color/primary</item>
<item name="colorAccent">#color/accent</item>
<item name="colorSurface">#color/white</item>
<item name="android:textColorPrimary">#color/primary_text</item>
<item name="android:textColorSecondary">#color/secondary_text</item>
<item name="android:divider">#color/divider</item>
<item name="windowActionBarOverlay">true</item>
<item name="fontFamily">#font/myfont</item>
<item name="android:fontFamily">#font/font_elaxer</item>
<item name="selectableItemBackground">?android:selectableItemBackground</item>
<item name="android:colorControlHighlight" tools:targetApi="lollipop">#color/ripplecolor</item>
<item name="android:windowTranslucentStatus" tools:targetApi="kitkat">true</item>
<item name="android:textColorHint">#color/custom_hint_color</item>
<!-- enable window content transitions -->
<item name="android:windowActivityTransitions" tools:targetApi="lollipop">true</item>
<!-- specify enter and exit transitions -->
<item name="android:windowEnterTransition" tools:targetApi="lollipop">#transition/explode</item>
<item name="android:windowExitTransition" tools:targetApi="lollipop">#transition/explode</item>
<!--<item name="android:windowEnterTransition" tools:targetApi="lollipop">#android:transition/slide_right</item>
<item name="android:windowExitTransition" tools:targetApi="lollipop">#android:transition/slide_left</item>-->
<!-- specify shared element transitions -->
<item name="android:windowSharedElementEnterTransition" tools:targetApi="lollipop">#transition/change_image_transform</item>
<item name="android:windowSharedElementExitTransition" tools:targetApi="lollipop"> #transition/change_image_transform</item>
</style>
myfont.xml
<?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<font
app:fontStyle="normal"
app:fontWeight="400"
app:font="#font/dancing_r" />
<font
app:fontStyle="italic"
app:fontWeight="400"
app:font="#font/dancing_b" />
<font
android:fontStyle="normal"
android:fontWeight="400"
android:font="#font/dancing_r" />
<font
android:fontStyle="italic"
android:fontWeight="400"
android:font="#font/dancing_b" />
</font-family>
I've created a project and added 2 buttons in activity_main.xml but they have different colors in layout preview and the actual app. How come?
There are 2 files under themes:
themes.xml:
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="NecklaceShowcase" parent="Theme.MaterialComponents.Light.NoActionBar" >
<!-- Primary brand color. -->
<item name="colorPrimary">#color/purple_500</item>
<item name="colorPrimaryVariant">#color/purple_700</item>
<item name="colorOnPrimary">#color/white</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">#color/teal_200</item>
<item name="colorSecondaryVariant">#color/teal_700</item>
<item name="colorOnSecondary">#color/black</item>
<!-- Status bar color. -->
<item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
<!-- Customize your theme here. -->
</style>
</resources>
and themes.xml (night)
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="NecklaceShowcase">
<!-- Primary brand color. -->
<item name="colorPrimary">#color/purple_200</item>
<item name="colorPrimaryVariant">#color/purple_700</item>
<item name="colorOnPrimary">#color/black</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">#color/teal_200</item>
<item name="colorSecondaryVariant">#color/teal_200</item>
<item name="colorOnSecondary">#color/black</item>
<!-- Status bar color. -->
<item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
<!-- Customize your theme here. -->
</style>
</resources>
The layout preview is using the theme you have set in your themes.xml file.
When you run the app the btn2 is switching to red because in your activity_main.xml it is setting its background to: halo_red_light.
I'm unable to tell why the other button is changed to grey this may have been set in your activity class.
You can read more here
I created an android application and when I downloaded it to my phone it appeared in dark mode.
I want my application to always be in light mode so I used the following:
super.onCreate(savedInstanceState);
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO);
But it still showed me the app in dark mode.
How can I completely disable it?
My styles.xml file is:
<style name="CustomActivityTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="android:windowActionBarOverlay">true</item>
<!-- other activity and action bar styles here -->
</style>
<!-- style for the action bar backgrounds -->
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="android:background">#color/colorGraySearchText</item>
<item name="background">#color/colorGraySearch</item>
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
</style>
<!-- Text -->
<style name="MyTheme.ActionBar.TitleTextStyle" parent="#android:style/TextAppearance">
<item name="android:textColor">#color/colorGraySearchText</item>
<item name="android:textSize">16dp</item>
</style>
<style name="CustomActivityTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="CustomActivityTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="CustomActivityTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
SOLUTION:
The following steps solved my problem:
Changing in my build.gradle (app) to :
compileSdkVersion 29
targetSdkVersion 29
adding the following line to any style in my style.xml:
<item name="android:forceDarkAllowed" tools:targetApi="q">false</item>
Thank you
I want to make the ActionBar transparent throughout the app and also change the text colour to white in the ActionBar. I tried setting the android:background to null but it had no effect. I am still getting a white ActionBar with Black text in the following code:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/app_white</item>
<!--item name="colorPrimaryDark">#color/colorPrimaryDark</item-->
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<!--item name="colorAccent">#color/colorAccent</item-->
<item name="colorAccent">#1da1f2</item>
<!-- <item name="actionBarStyle">#style/MyActionBar</item>-->
<!-- <item name="android:actionBarStyle">#style/MyActionBar</item>-->
</style>
<style name="MyActionBar" parent="#android:style/Widget.ActionBar">
<item name="android:background">#null</item>
<item name="background">#null</item>
<item name="fontFamily">#font/mukta_bold</item>
<item name="titleTextStyle">#style/MyActionBarTitle</item>
<item name="actionMenuTextColor">#color/app_white</item>
</style>
<!-- <style name="MyActionBar.MenuTextStyle"-->
<!-- parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">-->
<!-- <item name="android:textColor">#color/app_light_black</item>-->
<!-- </style>-->
<style name="MyActionBarTitle" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/app_white</item>
</style>
<style name="Switch_Style">
<item name="android:textColor">#000000</item>
<item name="android:textSize">15sp</item>
<item name="android:textStyle">bold</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="CustomTheme" parent="Theme.MaterialComponents.Light.NoActionBar"/>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.MaterialComponents.Light" />
<style name="Widget.MyApp.MyButton" parent="Widget.MaterialComponents.Button">
<item name="backgroundTint">?attr/colorSecondary</item>
</style>
</resources>
You should use colorControlNormal flag in your Theme for AppBar
<style name="appBarTheme" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="colorControlNormal">#android:color/white</item>
<item name="android:textColorPrimary">#android:color/white</item>
</style>
and in your AppBarLayout use background as transparent
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:theme="#style/appBarTheme">
...........
</com.google.android.material.appbar.AppBarLayout
Make your BaseTheme of app as NoActionBar so you can create a custom action bar in your activity/fragment -
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
Happy Coding !!
As you can see from the image below, I'm using the time picker in my app.
I need to change the color but don't know how...
Thanks for the help.
This can be easily achieved from xml (5.0+ only)
v21/themes.xml
<style name="Theme"
parent="MyTheme.Base">
<item name="android:dialogTheme">#style/Theme.Dialog</item> <!-- TimePicker dialog -->
<item name="android:alertDialogTheme">#style/Theme.Dialog</item> <!-- Alert dialog -->
</style>
<style name="Theme.Dialog"
parent="android:Theme.Material.Light.Dialog">
<item name="android:colorAccent">#color/...</item>
<item name="android:colorPrimary">#color/...</item>
<item name="android:colorPrimaryDark">#color/...</item>
</style>
Edit
Please note that as of Android Support Library 22.1.0 there is a new AppCompatDialog available! http://android-developers.blogspot.de/2015/04/android-support-library-221.html
Try this code
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="TimePicker" parent="Theme.AppCompat.Light.Dialog">
<item name="android:windowIsFloating">true</item>
<item name="colorAccent">#color/primary</item>
<item name="colorControlActivated">#color/secondary</item>
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary</item>
<item name="android:buttonBarNegativeButtonStyle">#style/DatePickerTheme.ButtonBarButtonStyle</item>
<item name="android:buttonBarPositiveButtonStyle">#style/DatePickerTheme.ButtonBarButtonStyle</item>
</style>
<style name="DatePickerTheme.ButtonBarButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#color/primary</item>
</style>
</resources>
The first one is colorAccent, the second is colorControlActivated and the last one does not belong to the timepicker, it belongs to dialog so you should apply the an style similar to this post