TabLayout+ViewPager+Fragment实现顶部导航+处理tab下划线长度和选中tab的字体粗细
1. 先写布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="580px"
android:background="@color/white">
<ImageView
android:id="@+id/img_close"
android:layout_width="40px"
android:layout_height="40px"
android:src="@mipmap/ic_close"
android:layout_alignParentRight="true"
android:layout_marginTop="10px"
android:layout_marginRight="20px"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- tabIndicatorColor 选中的下划线颜色 -->
<!-- tabSelectedTextColor 选中的tab的字体颜色 -->
<!-- tabTextColor 未选中的tab的字体颜色 -->
<!-- tabTextAppearance 字体大小和风格自定义 -->
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="330px"
android:layout_height="80px"
app:tabGravity="center"
app:tabMode="fixed"
app:tabIndicatorHeight="1px"
app:tabBackground="@color/white"
app:tabIndicatorColor="@color/text_color_selected"
app:tabSelectedTextColor="@color/text_color_selected"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabTextColor="@color/tab_text"
style="@style/MyTabLayoutStyle"/>
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="@color/divide_line"/>
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
布局中用了两个style分别如下:
<style name="TabLayoutTextStyle">
<item name="android:textSize">22px</item><!--设置Tablayout字体大小-->
<!--<item name="android:textStyle">bold</item>-->
</style>
<style name="MyTabLayoutStyle" parent="Widget.Design.TabLayout">
<item name="tabPaddingStart">64px</item>
<item name="tabPaddingEnd">64px</item>
</style>
2. 实现导航条用的Activity
import android.content.Intent;
import android.graphics.Typeface;
import android.net.Uri;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.WindowManager;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.lang.reflect.Field;
import java.util.ArrayList;
import java.util.List;
public class DaoHangActivity extends FragmentActivity implements MoreAFragment.OnFragmentInteractionListener,
MoreBFragment.OnFragmentInteractionListener,
View.OnClickListener {
private static final String TAG = DaoHangActivity.class.getName();
private ViewPager view_pager;
private TabLayout tab_layout;
private ImageView img_close;
private TabAdapter tabAdapter;
private List<Fragment> fragments = new ArrayList<>();
private String[] titles;
private void init()
{
img_close = (ImageView) findViewById(R.id.img_close);
view_pager = (ViewPager) findViewById(R.id.view_pager);
tab_layout = (TabLayout) findViewById(R.id.tab_layout);
img_close.setOnClickListener(this);
tab_layout.addOnTabSelectedListener(mOnTabSelectedListener);
fragments.add(MoreAFragment.newInstance("A_fragment", "A"));
fragments.add(MoreBFragment.newInstance("B_fragment", "B"));
tabAdapter = new TabAdapter(getSupportFragmentManager());
tabAdapter.setFragments(fragments);
view_pager.setAdapter(tabAdapter);
view_pager.addOnPageChangeListener(mOnPageChangeListener);
tab_layout.setupWithViewPager(view_pager);
setTabWidth(tab_layout, 31);
Intent intent = getIntent();
int pos = 0;
if (intent != null)
{
pos = intent.getIntExtra("pos", 0);
}
Log.i(TAG, "init() exit. pos="+pos);
if (pos == 0)
{
view_pager.setCurrentItem(0);
}
else
{
view_pager.setCurrentItem(1);
}
}
@Override
public void onFragmentInteraction(Uri uri)
{
}
@Override
public void onClick(View v)
{
int v_id = v.getId();
if (v_id == R.id.img_close)
{
finish();
}
}
public class TabAdapter extends FragmentPagerAdapter
{
private List<Fragment> fragments;
public TabAdapter(FragmentManager fm)
{
super(fm);
}
public void setFragments(List<Fragment> fragments)
{
this.fragments = fragments;
}
@Override
public Fragment getItem(int position)
{
return fragments.get(position);
}
@Override
public int getCount()
{
return fragments != null ? fragments.size() : 0;
}
@Override
public CharSequence getPageTitle(int position)
{
return titles[position];
}
}
private TabLayout.OnTabSelectedListener mOnTabSelectedListener = new TabLayout.OnTabSelectedListener()
{
@Override
public void onTabSelected(TabLayout.Tab tab)
{
//Log.e(TAG, "setTabTextViewStyle() onTabSelected");
}
@Override
public void onTabUnselected(TabLayout.Tab tab)
{
//Log.e(TAG, "setTabTextViewStyle() onTabUnselected");
}
@Override
public void onTabReselected(TabLayout.Tab tab)
{
}
};
private ViewPager.OnPageChangeListener mOnPageChangeListener = new ViewPager.OnPageChangeListener()
{
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels)
{
setTabTextViewStyle(tab_layout, position);
//Log.e(TAG, "setTabTextViewStyle() onPageScrolled() position="+position+"; positionOffset="+positionOffset+"; positionOffsetPixels="+positionOffsetPixels);
}
@Override
public void onPageSelected(int position)
{
//Log.e(TAG, "setTabTextViewStyle() onPageSelected() position="+position);
}
@Override
public void onPageScrollStateChanged(int state)
{
//Log.e(TAG, "setTabTextViewStyle() onPageScrollStateChanged() state="+state);
}
};
//处理tab下划线长度,百度搜到的
public void setTabWidth(final TabLayout tabLayout, final int padding)
{
tabLayout.post(new Runnable()
{
@Override
public void run()
{
try
{
LinearLayout mTabStrip = (LinearLayout) tabLayout.getChildAt(0);
for (int i = 0; i < mTabStrip.getChildCount(); i++)
{
View tabView = mTabStrip.getChildAt(i);
if (tabView == null) continue;
Field mTextViewField = tabView.getClass().getDeclaredField("mTextView");
if (mTextViewField == null) continue;
mTextViewField.setAccessible(true);
TextView mTextView = (TextView) mTextViewField.get(tabView);
if (mTextView == null) continue;
tabView.setPadding(0, 0, 0, 0);
int width = mTextView.getWidth();
Log.e(TAG, "setTabWidth() mTextView_width="+width);
if (width == 0)
{
mTextView.measure(0, 0);
width = mTextView.getMeasuredWidth();
Log.e(TAG, "setTabWidth() 111 mTextView_width="+width);
}
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) tabView.getLayoutParams();
params.width = width ;
params.leftMargin = padding;
params.rightMargin = padding;
tabView.setLayoutParams(params);
tabView.invalidate();
}
}
catch (NoSuchFieldException e)
{
e.printStackTrace();
}
catch (IllegalAccessException e)
{
e.printStackTrace();
}
}
});
}
//修改选中tab的TextView的字体粗细
public void setTabTextViewStyle(final TabLayout tabLayout, int position)
{
tabLayout.post(new Runnable()
{
@Override
public void run()
{
try
{
LinearLayout mTabStrip = (LinearLayout) tabLayout.getChildAt(0);
for (int i = 0; i < mTabStrip.getChildCount(); i++)
{
View tabView = mTabStrip.getChildAt(i);
if (tabView == null) continue;
Field mTextViewField = tabView.getClass().getDeclaredField("mTextView");
if (mTextViewField == null) continue;
mTextViewField.setAccessible(true);
TextView mTextView = (TextView) mTextViewField.get(tabView);
if (mTextView == null) continue;
if (i == position)
{
mTextView.setTypeface(Typeface.DEFAULT_BOLD);
}
else
{
mTextView.setTypeface(Typeface.DEFAULT);
}
tabView.invalidate();
}
}
catch (NoSuchFieldException e)
{
e.printStackTrace();
}
catch (IllegalAccessException e)
{
e.printStackTrace();
}
}
});
}
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
WindowManager.LayoutParams lp = getWindow().getAttributes();
lp.width = (int) getResources().getDimension(R.dimen.916);
lp.height = (int) getResources().getDimension(R.dimen.580);
Log.i(TAG, "onCreate() width="+lp.width+"; height="+lp.height);
getWindow().setAttributes(lp);
setContentView(R.layout.activity_more_step);
titles = getResources().getStringArray(R.array.fragment_tab_title);
/** fragment_tab_title定义
<string-array name="fragment_tab_title">
<item>A_fragment</item>
<item>B_fragment</item>
</string-array>
*/
init();
Log.i(TAG, "onCreate()");
}
protected void onResume()
{
super.onResume();
Log.i(TAG, "onResume()");
}
protected void onPause()
{
super.onPause();
Log.i(TAG, "onPause()");
}
protected void onStop()
{
super.onStop();
Log.i(TAG, "onStop()");
}
protected void onDestroy()
{
super.onDestroy();
Log.i(TAG, "onDestroy()");
}
}
这样就可以了,MoreAFragment和MoreBFragment就不在这里写了,自己可以随意添加。
TabLayout+ViewPager+Fragment实现顶部导航+处理tab下划线长度和选中tab的字体粗细
最新推荐文章于 2023-07-14 17:06:47 发布