Change Color TabSelector on v4 ViewPager - android

Is it possible to change color of selected tab on v4 ViewPager?
I need to use v4 ViewPager, but I don't find any source to customize it.
Just to clarify I need to change the blue color to another one:

This is the tab indicator. You can change its color by applying different styles.
Use Action Bar Style Generator, generate 9patch png files (tab_selected, tab_selected_focused etc.) and add these files + styles to your project.
Another approach -> How to change the current tab highlighter color in Android ViewPager? (as #Pratik wrote in comment).

I don't have enough reputation to comment on an Answer, but regarding the Action Bar Style Generator make sure after you add the files to the corresponding folders in your project that you also add the theme to your manifest xml file like this:
<activity
android:name="com.whatever.myapplication.YourActivityName"
android:theme="#style/Theme.Whatever_you_named_your_style_in_the_generator">
</activity>

The ViewPager is not the one you need to customize. You need to set the tabIndicatorColor of the TabLayout linked with it in the layout.
Dynamically you could do
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout_id);
tabLayout.setupWithViewPager(viewPager);
tabLayout.setSelectedTabIndicatorColor(R.color.your_color); // here
Inside the XML, that would be as simple as the following
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#color/your_color" />

Same way i don't find the way to customize the tab. So i have fixed it using
<View
android:layout_height="2dp"
android:id="#+id/line1"
android:layout_width="fill_parent"
android:layout_below="#+id/headertab1"
android:layout_above="#+id/viewpager"
android:background="#0066CC" />
I have put this code with each 3 tabs belove the tab & above viewPager.
As we can detect that which tab is selected very easily.
So we can use this 'line1' visibility to View.VISIBLE or View.INVISIBLE.
Hope it helps to you!!

Related

How to Change BottomNavigationBar attributes?

how to disable magnify and modify font_size of selected tab in BottomNavigationBar Android, I just wanna change the tab's color, don't magnify the tab, what should i do, thanks!
is there any attribute to change some attribute in this widget?
<com.ashokvarma.bottomnavigation.BottomNavigationBar
android:id="#+id/mainTabBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:animateLayoutChanges="false"
android:background="#color/white"
android:splitMotionEvents="false"
app:bnbActiveColor="#color/colorPrimary"
app:bnbBackgroundColor="#color/white"
app:bnbInactiveColor="#color/gray"
app:bnbMode="mode_fixed"
tools:override="true"/>
That BottomNavigationBar is a custom component and probably has its own method of styling or inheriting a style. Can you please share how it works or references to the documentation of the component? Thank you!

How to change text color in Sliding tabs

I'm learning Android and don't understand how to change the color of the text in Sliding tabs of the Google Example SlidingTabs Colors:
https://developer.android.com/samples/SlidingTabsColors/project.html
I tried to write:
<com.example.android.common.view.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ddffffff"
android:textColor="#ffffffff">
But nothing happened.
Also text color didn't change when I used this :
#android:style/TextAppearance.Holo.Widget.ActionBar.Title
in my Theme.
There is whole library for page sliding tabs for colors.
You may wan to see this example.
https://github.com/astuetz/PagerSlidingTabStrip
There are many tutorial regarding changing color of page strip.

Make PagerTabStrip with two tabs equally fit in screen

I am using ViewPager with PagerTabStrip:
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.PagerTabStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"/>
</android.support.v4.view.ViewPager>
And I would like to accomplish my tabs to look like this as Google recommends:
I have two tabs and I would like for each of them to be fixed and take 50% of the screen. I was looking through the options in XML and programmatically and can't find anything useful.
How can I accomplish that? Thank you.
I'm not sure about android.support.v4.view.PagerTabStrip. But you can use alternative library for getting this effect, i use it in my one project and it works well. After you add the lib to your project, set pstsShouldExpand to true
You should use android.support.design.widget.TabLayout instead of PagerTabStrip.

How to add logo on top-left corner of each screen in android application?

I want to add an application logo on each screen of an application. Is there any way to make such centralized change from a single place instead of adding logo in layout file for each screen?
If you're targeting an API over 14 (Ice Cream Sandwich),
getActionBar().setLogo(R.drawable.your_logo_name);
You'll have to do this for every Activity. What I usually do is to set one "BaseActivity" which I extend other activities from. This becomes helpful especially later on when standardizing other things like common functions and settings.
Use Action Bar to make such centralized change from a single place instead of adding logo in layout file for each screen.
'1' is the palce for the app icon, which establishes your app's identity. It can be replaced with a different logo or branding if you wish. Important: If the app is currently not displaying the top-level screen, be sure to display the Up caret to the left of the app icon, so the user can navigate up the hierarchy.
You can also add additional Navigation here.
as Raghav said you can use ActionBar. See this example for Actionbar
If you don't want to use action bar then you can create a single layout like with name "logo.xml"
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_image"/>
then use this layout file in any of your layout by including this layout file like
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<include layout="#layout/logo"/>
<!--your other code-->
</LinearLayout>
you can specifies your application icon in manifest.
in activity tag
in that
android:icon="#drawable/your_logeHere"
that will show in title bar.

Android TabWidget default style

I have a problem that sounds like this:
I have a TabHost and I want to change it's size (height and width) so I used inflate to do this
TextView tabContent = (TextView)getLayoutInflater().inflate(R.layout.tab_content,tab.getTabWidget(),false);
and my xml:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tab_label"
android:layout_width="80dp"
android:layout_height="fill_parent"
android:gravity="center"
android:textSize="14sp"
android:background="#color/green"
/>
This is working, but the problem is:
How do I inherit the old style of the tab since this is canceling it.
I mean i want this to be on the grey background and if i click it, to take focus and be yellow and so on, like the default tabs?
Thanks
Arkde
When you coose to customize your tabs, the standard tab behaviour is not accessible anymore.
Here is a very good example about customizing Tabs:
http://joshclemm.com/blog/?p=136

Categories

Resources