Below is the code for XAML for customNavigation in Xamarin. The bar color is not set but Bar text color is set. And this is only happening in Android, iOS works fine.
<NavigationPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DSXMobile.Views.CustomNavigationView"
BarBackgroundColor="Red"
BarTextColor="Black">
</NavigationPage>
Can anyone please help me ?
This is a known issue,
From Xamarin forums https://forums.xamarin.com/discussion/88569/barbackgroundcolor-refusing-to-get-set-on-android-but-bartextcolor-is-fine
"If you are using FormsAppCompatActivity
This is a bug in XF if you're using the FormsAppCompatActivity.
The workaround is to set android:background in your applications' layout file used for FormsAppCompatActivity.ToolbarResource.
Set this value to anything, example: android:background="#00000000"
Then XF will style it with whatever colour is in your XAML style later.
Really dumb bug, hope it gets sorted soon."
Another reference:
https://forums.xamarin.com/discussion/37657/how-to-change-the-nav-bar-background-color-on-android
Two annoying Custom Renderer Solutions:
https://forums.xamarin.com/discussion/17811/tabbedpage-tabbar-background-color-tint
https://forums.xamarin.com/discussion/59828/change-barbackgroundcolor-dynamically
Like the other answer says its a bug but i don't know if it should be called a bug because android is doing what it does picking the theme that you have assigned to its activity in your styles.xml now what you can do is make that same change in your styles.xml my theme something like this :
<?xml version="1.0" encoding="utf-8" ?>
<resources>
<style name="MyTheme" parent="MyTheme.Base">
</style>
<style name="DrawerArrowStyle"
parent="#style/Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
<item name="color">#FFFFFF</item>
</style>
<style name="MyTheme.Base"
parent="Theme.AppCompat.Light.DarkActionBar">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#003399</item>
<item name="colorPrimaryDark">#003399</item>
<item name="colorControlHighlight">#003399</item>
<item name="colorAccent">#012348</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
</style>
</resources>
Changing the colors in here will change it there aswell for eg ColorPrimary is your toolbar color
Related
How to tap on the three dot menu (more options) in the actionbar on Android using Detox?
I followed this SO answer, https://stackoverflow.com/a/65736139/3970346
Since this is a NativeScript app the steps are,
Create a ids.xml file under app/App_Resources/Android/src/main/res/values folder,
<?xml version="1.0" encoding="utf-8"?>
<resources>
<item type="id" name="overflowActionButton"/>
</resources>
Then in the styles.xml in the same directory add,
<style name="Widget.ActionButton.Overflow" parent="Widget.AppCompat.ActionButton.Overflow">
<item name="android:id">#id/overflowActionButton</item>
<item name="android:contentDescription">"overflowActionButton"</item>
<item name="android:tint">#color/white</item>
</style>
Finally set the style on the AppThemeBase like this,
<!-- theme to use AFTER launch screen is loaded-->
<style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
<item name="toolbarStyle">#style/NativeScriptToolbarStyle</item>
<item name="colorPrimary">#color/ns_primary</item>
<item name="colorPrimaryDark">#color/ns_primaryDark</item>
<item name="colorAccent">#color/ns_accent</item>
<!-- the line below -->
<item name="actionOverflowButtonStyle">#style/Widget.ActionButton.Overflow</item>
</style>
After this you can tap on the overflow menu in Detox like this,
await element(by.label('overflowActionButton')).tap();
Thanks to #Leri Gogsadze for pointing me in the right direction
Because I wanted to use material input edit text, I had to change my style to
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
But my SnackBar style has changed, before it (which I was using AppCompat) my SnackBar was show in different mode, I mean, It came up from bottom and after a while it goes down, but now it is shown like a simple toast, it fade-in and then fade-out,
how can I use material component without having any change in my view styles?
Add following lines into styles.xml BaseTheme:
<resources>
<style name="BaseTheme" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
...
<item name="snackbarStyle">#style/Widget.MaterialComponents.Snackbar</item>
<item name="snackbarButtonStyle">#style/Widget.MaterialComponents.Button.TextButton.Snackbar</item>
<item name="snackbarTextViewStyle">#style/Widget.MaterialComponents.Snackbar.TextView</item>
</style>
</resources>
I'm trying to change the pointer of cursor but i don't have sucess.
I have managed to change color selection, but I want to change the pointer where in the image below is green. Can someone help me?
For Android I think the property is in styles.xml, try setting it there:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/kio_turquoise</item>
<item name="colorPrimaryDark">#color/kio_hot_pink</item>
<!-- sets cursor color -->
<item name="colorControlActivated">#android:color/blue</item>
</style>
I have a SearchView which is dark and its hinttext and its cross icon are black, so I want to set the color of these two things to white.
I am using a custom theme for Android but it does nothing to the SearchView. This is how my custom theme xml file looks like:
<resources>
<style name="Theme.MyApp" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:spinnerItemStyle">#style/MySpinnerItem</item>
<item name="android:actionBarStyle">#style/SearchViewTheme</item>
</style>
<style name="SearchViewTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:textColorPrimary">#FFFFFF</item>
<item name="android:textColorSecondary">#FFFFFF</item>
<item name="android:textColorHint">#CCCCCC</item>
</style>
<style name="MySpinnerItem" parent="#android:style/Widget.TextView.SpinnerItem">
<item name="android:paddingTop">10dp</item>
<item name="android:paddingBottom">10dp</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:textSize">14dp</item>
</style>
</resources>
I found a solution. If anyone wants to know what I did:
I just deleted this line:
<item name="android:actionBarStyle">#style/SearchViewTheme</item>
And then, I added this to the .tss file where the SearchView is:
"Window[platform=android]" : {
theme : "SearchViewTheme"
}
I would like to change the background title color in the recent apps view (when you press the Overview square button on Android) using react-native.
You can see in the image below that the Facebook app has a blue background color, but my Bitcoin FOMO Calculator app has the default gray color.
Thanks
1.Create colors.xml into android/app/src/main/res/values/colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- Change the color value for your need -->
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
</resources>
2.Modify the styles.xml inside android/app/src/main/res/values/styles.xml
<resources>
<!-- 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>
</style>
</resources>
3.The result and more detail about Android Style and Theme: