how to change tablayout selected text color in custom tablayout
i have viewpager that have 4 tab which implement it with tablayout. because i wanted to change the font to custom font i used a custom tab layout. now the problem is that the selected tab text color wouldn't change with tabSelectedTextColor.
this is my java code:
package com.example.noavaran.drugstore.Activity;
import android.content.Context;
import android.graphics.Color;
import android.graphics.PorterDuff;
import android.graphics.Typeface;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.AppCompatTextView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import com.example.noavaran.drugstore.Fragment.AddressFragment;
import com.example.noavaran.drugstore.Fragment.IssueFragment;
import com.example.noavaran.drugstore.Fragment.MenuFragment;
import com.example.noavaran.drugstore.Fragment.SearchFragment;
import com.example.noavaran.drugstore.Helper.CustomViewPager;
import com.example.noavaran.drugstore.R;
import java.util.ArrayList;
import java.util.List;
import layout.fragment_approve;
import uk.co.chrisjenx.calligraphy.CalligraphyContextWrapper;
import uk.co.chrisjenx.calligraphy.CalligraphyUtils;
public class MainPageActivity extends AppCompatActivity {
private TabLayout tabLayout;
public Context context;
public Typeface tf;
public static boolean a=false;
private CustomViewPager viewPager;
private int[] tabIcons = {
R.drawable.menu,
R.drawable.address_icon,
R.drawable.search_icon,
R.drawable.issue_icon
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_page);
tf = Typeface.createFromAsset(getAssets(), "IRANSans_Bold.ttf");
tabCustomization();
/*changeTabsFont();*/
setupTabIcons();
}
private void tabCustomization() {
viewPager = (CustomViewPager) findViewById(R.id.viewPager);
viewPager.setPagingEnabled(false);
setupViewPager(viewPager);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new MenuFragment(), "menu");
adapter.addFragment(new AddressFragment(), "Address");
adapter.addFragment(new SearchFragment(), "Searcg");
adapter.addFragment(new IssueFragment(), "Issue");
viewPager.setAdapter(adapter);
for (int i = 0; i < tabLayout.getTabCount(); i++) {
TabLayout.Tab tab = tabLayout.getTabAt(i);
tab.setCustomView(adapter.getTabView(tabLayout,i));
}
ViewGroup vg = (ViewGroup) tabLayout.getChildAt(0);
int tabsCount = vg.getChildCount();
Log.i("TabChild",String.valueOf(tabsCount));
// Iterate over all tabs and set the custom view
}
public void setupViewPager(ViewPager viewPager) {
}
private void setupTabIcons() {
tabLayout.getTabAt(0).setIcon(tabIcons[0]);
tabLayout.getTabAt(1).setIcon(tabIcons[1]);
tabLayout.getTabAt(2).setIcon(tabIcons[2]);
tabLayout.getTabAt(3).setIcon(tabIcons[3]);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener(){
@Override
public void onTabSelected(TabLayout.Tab tab) {
tab.getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
tab.getIcon().setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_IN);
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
@Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
@Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
public View getTabView(TabLayout tabLayout,int position) {
// Given you have a custom layout in `res/layout/custom_tab.xml` with a TextView and ImageView
View view = LayoutInflater.from(getApplicationContext())
.inflate(R.layout.custom_tab, tabLayout, false);
TextView textView= (TextView) view.findViewById(R.id.tabText);
textView.setText(getPageTitle(position));
textView.setTypeface(tf);
ImageView imageView = (ImageView) view.findViewById(R.id.imageView);
imageView .setImageResource(tabIcons[position]);
return view;
}
@Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
//Caligraphy Library
@Override
protected void attachBaseContext(Context newBase) {
super.attachBaseContext(CalligraphyContextWrapper.wrap(newBase));
}
}
my custom layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5px"
android:id="@+id/imageView" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="New Text"
android:textColor="@android:color/white"
android:gravity="center"
android:id="@+id/tabText" />
</LinearLayout>
and this is my tablayout tag:
<android.support.design.widget.TabLayout
android:layout_weight="4"
android:id="@+id/tabs"
android:layout_gravity="right"
app:tabGravity="fill"
fontPath="@string/fontsIran"
app:tabTextAppearance="@drawable/selected_text"
android:layoutDirection="rtl"
app:tabBackground="@drawable/tabformat"
app:tabTextColor="@android:color/white"
app:tabSelectedTextColor="@color/color_tab_gray"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/color_main"
/>
I just did like below base on what javacoder said in this post comment but i don't know why the prev text would remove after select another tab
@Override
public void onTabSelected(TabLayout.Tab tab) {
tab.getIcon().setColorFilter(Color.parseColor("#a8a8a8"), PorterDuff.Mode.SRC_IN);
TextView txt=(TextView)findViewById(R.id.tabText);
txt.setTextColor(Color.GRAY);
tab.setCustomView(txt);
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
tab.getIcon().setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_IN);
TextView txt=(TextView)findViewById(R.id.tabText);
txt.setTextColor(Color.YELLOW);
tab.setCustomView(txt);
}
Answer
Here is my way to change tablayout which is on select.
Here is you Adapter
class ViewPagerAdapter extends FragmentPagerAdapter {
...
// I add two func here.
public void SetOnSelectView(TabLayout tabLayout,int position)
{
TabLayout.Tab tab = tabLayout.getTabAt(position);
View selected = tab.getCustomView();
TextView iv_text = (TextView) selected.findViewById(R.id.tabText);
iv_text.setTextColor(mContext.getResources().getColor(R.color.white));
}
public void SetUnSelectView(TabLayout tabLayout,int position)
{
TabLayout.Tab tab = tabLayout.getTabAt(position);
View selected = tab.getCustomView();
TextView iv_text = (TextView) selected.findViewById(R.id.tabText);
iv_text.setTextColor(mContext.getResources().getColor(R.color.textblack));
}
...
}
In Activity
//Add this
tabLayout.addOnTabSelectedListener(OnTabSelectedListener);
And Here is OnTabSelectedListener
private TabLayout.OnTabSelectedListener OnTabSelectedListener = new TabLayout.OnTabSelectedListener(){
@Override
public void onTabSelected(TabLayout.Tab tab) {
int c = tab.getPosition();
yourAdapter.SetOnSelectView(tabLayout,c);
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
int c = tab.getPosition();
yourAdapter.SetUnSelectView(tabLayout,c);
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
};