ViewPagerIndicator doesn't show underline in Tab (Help) - android

I want to make simple TabPagerIndicator, but It doesn't show a underline, I use xml to change the style. This is my xml style file:
<!-- Application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light">
<item name="vpiTitlePageIndicatorStyle">#style/CustomTitlePageIndicator</item>
<item name="vpiUnderlinePageIndicatorStyle">#style/CustomUnderlinePageIndicator</item>
<item name="vpiTabPageIndicatorStyle">#style/CustomTabPageIndicator</item>
</style>
<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
<item name="android:background">#color/fondo_activity</item>
<item name="android:textAppearance">#style/CustomTabPageIndicator.Text</item>
<item name="android:textColor">#FF555555</item>
<item name="android:textSize">14sp</item>
<item name="android:dividerPadding">10dp</item>
<item name="showDividers">middle</item>
<item name="android:paddingLeft">8dp</item>
<item name="android:paddingRight">8dp</item>
<item name="android:fadingEdge">horizontal</item>
<item name="android:fadingEdgeLength">8dp</item>
</style>
<style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium">
<item name="android:typeface">monospace</item>
</style>
<style name="CustomUnderlinePageIndicator">
<item name="selectedColor">#FFCC0000</item>
<item name="android:background">#FFCCCCCC</item>
<item name="fadeLength">1000</item>
<item name="fadeDelay">1000</item>
</style>
<style name="CustomTitlePageIndicator">
<item name="android:background">#18FF0000</item>
<item name="footerColor">#FFAA2222</item>
<item name="footerLineHeight">1dp</item>
<item name="footerIndicatorHeight">3dp</item>
<item name="footerIndicatorStyle">underline</item>
<item name="android:textColor">#AA000000</item>
<item name="selectedColor">#FF000000</item>
<item name="selectedBold">true</item>
</style>
In this picture you can see how it is shown (the red line on the top is part of the action bar)
Does anyone knows where is the error and How can I solve it?
Best.

Can you please elaborate on where exactly you want to show the underline? Do you mean a vertical line between FOTOS and VIDEOS? Since I was not able to understand your question properly. Still I try to answer.
If you want something like ( FOTOS | VIDEOS ) then you have to put
<item name="android:divider">#drawable/custom_tab_indicator_divider</item>
custom_tab_indicator_divider is basically a nine patch image. You can checkout the nine patch in the source code of viewpagerindicator library.
If you want something like __________ below the FOTO and VIDEOS.You can create a selector and set it to background like
<item name="android:background">#drawable/custom_tab_indicator</item>
Check vpi_tab_indicator.xml in the library project for more info.

Related

Firebase Authentication UI - Hint Color (Android)

Please forgive me if this is answered elsewhere - I have been searching/testing/experimenting for 2 days without much luck.
I need to change the hint color for the email/password fields. Whether I'm on Light or Dark mode on my emulator, the text in the hint shows up Black:
... until I click on the field and it becomes at least readable:
Here's my theme as it stands right now:
<style name="Theme.MyApp.FirebaseAuth" parent="FirebaseUI">
<item name="windowActionBarOverlay">true</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#drawable/onboard_background</item>
<item name="colorPrimary">#color/gk_orange</item>
<item name="colorPrimaryDark">#color/gk_orange</item>
<item name="colorControlNormal">#color/gk_orange</item>
<item name="colorControlActivated">#android:color/white</item>
<item name="colorControlHighlight">#color/gk_orange</item>
<item name="colorButtonNormal">#color/gk_orange</item>
<item name="android:textColorHint">#color/gk_orange</item>
<item name="android:cacheColorHint">#color/gk_orange</item>
<!--<item name="hintTextColor">#color/gk_orange</item>-->
</style>
I've tried creating a style with parent="FirebaseUI.TextInputLayout.EmailField" and other similar things - but nothing seems to touch that hint color.
If someone could please point me in the right direction, I'd be most grateful. Thanks!!!
According to This GitHub Post you can try changing the style of FirebaseUI.EditText such as:
<style name="FirebaseUI.EditText">
<item name="android:paddingBottom">14dp</item>
<item name="android:paddingTop">14dp</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="colorControlActivated">#color/colorWhite</item>
<item name="colorControlHighlight">#color/colorWhite</item>
<item name="android:textColorHint">#color/colorWhite</item>
<item name="android:textColor">#color/colorWhite</item>
</style>
<style name="FirebaseUI.Text.TextInputLayout" parent="#style/FirebaseUI.EditText" />
<style name="FirebaseUI.Text.HintText" parent="#style/FirebaseUI.EditText" />
The general theme used from this snippet was:
<style name="FullscreenTheme" parent="AppTheme">
<item name="android:actionBarStyle">#style/FullscreenActionBarStyle</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowBackground">#drawable/bg_login</item>
<item name="metaButtonBarStyle">?android:attr/buttonBarStyle</item>
<item name="metaButtonBarButtonStyle">?android:attr/buttonBarButtonStyle</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="colorControlNormal">#color/colorWhite</item>
<item name="colorControlActivated">#color/colorWhite</item>
<item name="colorControlHighlight">#color/colorWhite</item>
</style>
<style name="FullscreenActionBarStyle" parent="Widget.AppCompat.ActionBar">
<item name="android:background">#color/colorPrimary</item>
</style>
While the answer from codearn19 did not work directly as suggested, it did inspire an experiment that ultimately solved my issue. Note that this solution is probably more "global" than some people might like, in that it changes ALL the TextInputLayouts under FirebaseUI, but for my purposes, it works:
<style name="FirebaseUI.TextInputLayout" parent="Widget.Design.TextInputLayout">
<item name="android:textColorHint">#color/gk_orange</item>
<item name="android:background">#null</item>
</style>
This allowed me to change the hint color. The #null was necessary to maintain the original look & feel of the rest of the TIL.
Thanks all!!!

How to set text and/or background color of Cut Copy Paste

I am using a custom Dark Theme in my app. Everything is doing okay, except for the Cut Copy Paste dialog that appears as a solid black square.
Surely there is a style that determines that, but I can't find it, or an answer that addresses this directly. Min API is 16.
<style name="DarkTheme" parent="AppTheme.NoActionBar">
<item name="colorPrimary">#color/blackBackground</item>
<item name="colorPrimaryDark">#color/blackBackground</item>
<item name="colorAccent">#color/yellow</item>
<item name="android:textColor">#color/whiteText</item>
<item name="android:background">#color/blackBackground</item>
<item name="buttonStyle">#style/darkButtonStyle</item>
<item name="spinnerStyle">#style/darkSpinnerStyle</item>
</style>
<style name="darkButtonStyle" parent="#android:style/Widget.Button">
<item name="android:layout_width">fill_parent</item>
<item name="android:textColor">#color/whiteText</item>
<item name="android:textSize">16sp</item>
<item name="android:padding">10dp</item>
<item name="android:textStyle">bold</item>
<item name="android:background">#color/darkBackground</item>
<item name="android:gravity">center</item>
<item name="android:textAllCaps">true</item>
</style>
<style name="darkSpinnerStyle" parent="Widget.AppCompat.Spinner">
<item name="android:background">#color/blackBackground</item>
<item name="android:paddingTop">0dp</item>
<item name="android:layout_marginStart">1dp</item>
<item name="android:layout_marginLeft">1dp</item>
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">0dp</item>
</style>
I was having the same issue when regarding to MaterialAlertDialog. I was able to fix it using backgroundTint instead of background in styles. This is how:
Before
<style name="materialAlertDialog" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<item name="android:background">#color/colorPrimaryDark</item>
<item name="materialAlertDialogTitleTextStyle">#style/TitleTextStyle</item>
<item name="materialAlertDialogBodyTextStyle">#style/BodyTextStyle</item>
<item name="buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
<item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
</style>
This will be enough to repropduce the error that you are saying... So what i did was changing background for backgroundTint...
After
<style name="materialAlertDialog" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<item name="android:backgroundTint">#color/colorPrimaryDark</item>
<item name="materialAlertDialogTitleTextStyle">#style/TitleTextStyle</item>
<item name="materialAlertDialogBodyTextStyle">#style/BodyTextStyle</item>
<item name="buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
<item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
</style>
It seems like when you set a background and the dialog is created, the toolbar of copy/paste menu was changing his background in some weird way that i cant explain.
So this is not the exact answer for your problem but it may help you.
Note: Try removing background attr of your style. I have a dark theme and there is no need to use it. Just simple use <style name="AppTheme" parent="Theme.MaterialComponents.DayNight"> instead of <style name="DarkTheme" parent="AppTheme.NoActionBar">.

Android white text in search box

See attached
I am using a searchbar with the theme below (I know very little about Android themes, yet)
How do I make the text typed, in this case, "Hi Mom" white?
<style name="_Credential" parent="android:Theme.Holo.Light.DarkActionBar">
<item name="android:editTextBackground">#drawable/credential_edit_text_holo_light</item>
<item name="android:textColorHighlight">#99005984</item>
<item name="android:textSelectHandleLeft">#drawable/credential_text_select_handle_left</item>
<item name="android:textSelectHandleRight">#drawable/credential_text_select_handle_right</item>
<item name="android:textSelectHandle">#drawable/credential_text_select_handle_middle</item>
<item name="android:autoCompleteTextViewStyle">#style/AutoCompleteTextViewCredential</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/credential_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/credential_btn_radio_holo_light</item>
<item name="android:buttonStyle">#style/ButtonCredential</item>
<item name="android:imageButtonStyle">#style/ImageButtonCredential</item>
<item name="android:dropDownSpinnerStyle">#style/SpinnerCredential</item>
<item name="android:progressBarStyleHorizontal">#style/ProgressBarCredential</item>
<item name="android:seekBarStyle">#style/SeekBarCredential</item>
<item name="android:ratingBarStyle">#style/RatingBarCredential</item>
<item name="android:ratingBarStyleIndicator">#style/RatingBarBigCredential</item>
<item name="android:ratingBarStyleSmall">#style/RatingBarSmallCredential</item>
<item name="android:buttonStyleToggle">#style/ToggleCredential</item>
<item name="android:listChoiceBackgroundIndicator">#drawable/credential_list_selector_holo_light</item>
<item name="android:activatedBackgroundIndicator">#drawable/credential_activated_background_holo_light</item>
<item name="android:fastScrollThumbDrawable">#drawable/credential_fastscroll_thumb_holo</item>
</style>
<style name="_Credential" parent="android:Theme.Holo.Light.DarkActionBar">
...
<item name="android:editTextColor">#ffffff</item> <!--Allow to change the editText color-->
...
</style>
So you can't actually change the TextColor of something like a search box with android:textColor. Instead, you need to use the whole family of the textColor... attributes.
Create a custom style that has your main style as it's parent, and then change all three kinds of colors to be what you want. So, something like this:
<style name="master" paret="#android:Theme.Holo.Light.DarkActionBar">
<item name="android:textColorPrimary">#FFFFFF</item>
<item name="android:textColorSecondary">#FFFFFF</item>
<item name="android:textColorTertiary">#FFFFFF</item>
</style>
Read more about this here.

Change generated action bar theme from Android Asset Studio

I have used Android Asset Studio to generate action bar style, however i woul like to do some changes, which I was unable to do in Studio, so I edited generated theme but lot of things was just ignored, and I just can't figure out how things work.
There is example:
`
<style name="Theme.Myactionbar" parent="#style/Theme.AppCompat.Light">
<item name="actionBarItemBackground">#drawable/selectable_background_myactionbar</item>
<item name="popupMenuStyle">#style/PopupMenu.Myactionbar</item>
<item name="dropDownListViewStyle">#style/DropDownListView.Myactionbar</item>
<item name="actionBarTabStyle">#style/ActionBarTabStyle.Myactionbar</item>
<item name="actionDropDownStyle">#style/DropDownNav.Myactionbar</item>
<item name="actionBarStyle">#style/ActionBar.Solid.Myactionbar</item>
<item name="actionModeBackground">#drawable/cab_background_top_myactionbar</item>
<item name="actionModeSplitBackground">#drawable/cab_background_bottom_myactionbar</item>
<item name="actionModeCloseButtonStyle">#style/ActionButton.CloseMode.Myactionbar</item>
</style>
<style name="ActionBar.Solid.Myactionbar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid">
<item name="background">#drawable/ab_solid_myactionbar</item> //THIS IS GREEN
<item name="backgroundStacked">#drawable/ab_solid_myactionbar</item>//THIS IS GREEN
<item name="backgroundSplit">#drawable/ab_bottom_solid_myactionbar</item>//THIS IS GREEN
<item name="progressBarStyle">#style/ProgressBar.Myactionbar</item>
</style>
<style name="ActionBar.Transparent.Myactionbar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="background">#drawable/ab_transparent_myactionbar</item>
<item name="progressBarStyle">#style/ProgressBar.Myactionbar</item>
</style>
<style name="PopupMenu.Myactionbar" parent="#style/Widget.AppCompat.Light.PopupMenu">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_example </item>
</style>
<style name="DropDownListView.Myactionbar" parent="#style/Widget.AppCompat.Light.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_myactionbar</item>
</style>
<style name="ActionBarTabStyle.Myactionbar" parent="#style/Widget.AppCompat.Light.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator_ab_myactionbar</item>
</style>
<style name="DropDownNav.Myactionbar" parent="#style/Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/spinner_background_ab_myactionbar</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_myactionbar</item>
<item name="android:dropDownSelector">#drawable/selectable_background_myactionbar</item>
</style>
<style name="ProgressBar.Myactionbar" parent="#style/Widget.AppCompat.ProgressBar.Horizontal">
<item name="android:progressDrawable">#drawable/progress_horizontal_myactionbar</item>
</style>
<style name="ActionButton.CloseMode.Myactionbar" parent="#style/Widget.AppCompat.Light.ActionButton.CloseMode">
<item name="android:background">#drawable/btn_cab_done_myactionbar</item>
</style>
<!-- this style is only referenced in a Light.DarkActionBar based theme -->
<style name="Theme.Myactionbar.Widget" parent="#style/Theme.AppCompat">
<item name="popupMenuStyle">#style/PopupMenu.Myactionbar</item>
<item name="dropDownListViewStyle">#style/DropDownListView.Myactionbar</item>
</style>
Everything was like in generator, but then i tried the simplest change, that is the color, so I edited style name=ActionBar.Solid.Myactionbar and put there som other drawables from other generated style.
It looked like this :
<style name="Theme.Myactionbar" parent="#style/Theme.AppCompat.Light">
<item name="actionBarItemBackground">#drawable/selectable_background_myactionbar</item>
<item name="popupMenuStyle">#style/PopupMenu.Myactionbar</item>
<item name="dropDownListViewStyle">#style/DropDownListView.Myactionbar</item>
<item name="actionBarTabStyle">#style/ActionBarTabStyle.Myactionbar</item>
<item name="actionDropDownStyle">#style/DropDownNav.Myactionbar</item>
<item name="actionBarStyle">#style/ActionBar.Solid.Myactionbar</item>
<item name="actionModeBackground">#drawable/cab_background_top_myactionbar</item>
<item name="actionModeSplitBackground">#drawable/cab_background_bottom_myactionbar</item>
<item name="actionModeCloseButtonStyle">#style/ActionButton.CloseMode.Myactionbar</item>
</style>
<style name="ActionBar.Solid.Myactionbar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid">
<item name="background">#drawable/ab_solid_example</item>
<item name="backgroundStacked">#drawable/ab_stacked_solid_example</item>
<item name="backgroundSplit">#drawable/ab_bottom_solid_myactionbar</item>
<item name="progressBarStyle">#style/ProgressBar.Myactionbar</item>
</style>
but nothing happend, and changed drawables supposed to be gray. I was wandering if anybody did this before and why this isnt working? Thank you
Ok I figured it out, there is values-v14 folder for styles for api level 14 and above, so you have to change these values too.

android: format textview

is it possible to format a textview for a widget so that it looks like the text below the apps.
like in this screenshot:
i am looking for the exact textcolor, the exact dropshadow and the rounded background.
When in doubt, check with the source, which shows that Android is using a custom TextView to implement the bubbled background around the text.
It appears that the text itself is styled using styles in the launcher app:
<style name="WorkspaceIcon">
<item name="android:textSize">13dip</item>
<item name="android:singleLine">true</item>
<item name="android:ellipsize">marquee</item>
<item name="android:shadowColor">#FF000000</item>
<item name="android:shadowRadius">2.0</item>
<item name="android:textColor">#FFF</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">match_parent</item>
<item name="android:background">#drawable/shortcut_selector</item>
<item name="android:paddingLeft">5dip</item>
<item name="android:paddingRight">5dip</item>
</style>
<style name="WorkspaceIcon.Portrait">
<item name="android:drawablePadding">5dip</item>
<item name="android:paddingTop">4dip</item>
<item name="android:layout_marginLeft">3dip</item>
<item name="android:layout_marginRight">3dip</item>
<item name="android:layout_marginTop">13dip</item>
<item name="android:layout_marginBottom">8dip</item>
</style>
<style name="WorkspaceIcon.Landscape">
<item name="android:drawablePadding">3dip</item>
<item name="android:paddingTop">2dip</item>
<item name="android:layout_marginLeft">10dip</item>
<item name="android:layout_marginRight">10dip</item>
</style>
Those styles are called from the launcher's layouts as appropriate.

Categories

Resources