效果展示
布局(main_activity)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ImageView
android:id="@+id/img"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#B52525"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/img">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleMarginEnd="0dp"
app:expandedTitleMarginStart="0dp"
app:expandedTitleMarginTop="?attr/actionBarSize"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:scaleType="centerCrop"
android:src="@drawable/img2"
app:layout_collapseMode="parallax" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<com.google.android.material.tabs.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/img"
app:tabGravity="center"
app:tabIndicatorColor="#ff678f"
app:tabIndicatorFullWidth="false"
app:tabIndicatorHeight="2dp"
app:tabMode="scrollable"
app:tabSelectedTextColor="#ff678f"
app:tabTextColor="#333333"
app:tabUnboundedRipple="true" />
</androidx.constraintlayout.widget.ConstraintLayout>
activity逻辑
package com.example.viewpager2_test;
import android.content.res.ColorStateList;
import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.viewpager2.adapter.FragmentStateAdapter;
import androidx.viewpager2.widget.ViewPager2;
import com.google.android.material.appbar.AppBarLayout;
import com.google.android.material.tabs.TabLayout;
import com.google.android.material.tabs.TabLayoutMediator;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;
private ViewPager2 viewPager2;
private int activeColor = Color.parseColor("#ff678f");
private int normalColor = Color.parseColor("#666666");
private int activeSize = 20;
private int normalSize = 14;
private ArrayList<Fragment> fragments;
private TabLayoutMediator mediator;
private AppBarLayout appBarLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = findViewById(R.id.tab_layout);
viewPager2 = findViewById(R.id.view_pager);
appBarLayout = findViewById(R.id.appBarLayout);
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int i) {
if (i == 0) {
if (tabLayout.getVisibility() == View.VISIBLE) {
tabLayout.setVisibility(View.GONE);
}
} else {
if (tabLayout.getVisibility() == View.GONE) {
tabLayout.setVisibility(View.VISIBLE);
}
}
}
});
final String[] tabs = new String[]{"关注", "推荐", "最新0", "最新1", "最新2", "最新3", "最新4", "最新5", "最新6"};
//禁用预加载
viewPager2.setOffscreenPageLimit(ViewPager2.OFFSCREEN_PAGE_LIMIT_DEFAULT);
//Adapter
viewPager2.setAdapter(new FragmentStateAdapter(getSupportFragmentManager(), getLifecycle()) {
@NonNull
@Override
public Fragment createFragment(int position) {
//FragmentStateAdapter内部自己会管理已实例化的fragment对象。
// 所以不需要考虑复用的问题
return TestFragment.newInstance(tabs[position]);
}
@Override
public int getItemCount() {
return tabs.length;
}
});
//viewPager 页面切换监听监听
viewPager2.registerOnPageChangeCallback(changeCallback);
mediator = new TabLayoutMediator(tabLayout, viewPager2, new TabLayoutMediator.TabConfigurationStrategy() {
@Override
public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
//这里可以自定义TabView
TextView tabView = new TextView(MainActivity.this);
int[][] states = new int[2][];
states[0] = new int[]{android.R.attr.state_selected};
states[1] = new int[]{};
int[] colors = new int[]{activeColor, normalColor};
ColorStateList colorStateList = new ColorStateList(states, colors);
tabView.setText(tabs[position]);
tabView.setTextSize(normalSize);
tabView.setTextColor(colorStateList);
tab.setCustomView(tabView);
}
});
//要执行这一句才是真正将两者绑定起来
mediator.attach();
}
private ViewPager2.OnPageChangeCallback changeCallback = new ViewPager2.OnPageChangeCallback() {
@Override
public void onPageSelected(int position) {
//可以来设置选中时tab的大小
int tabCount = tabLayout.getTabCount();
for (int i = 0; i < tabCount; i++) {
TabLayout.Tab tab = tabLayout.getTabAt(i);
TextView tabView = (TextView) tab.getCustomView();
if (tab.getPosition() == position) {
tabView.setTextSize(activeSize);
tabView.setTypeface(Typeface.DEFAULT_BOLD);
} else {
tabView.setTextSize(normalSize);
tabView.setTypeface(Typeface.DEFAULT);
}
}
}
};
@Override
protected void onDestroy() {
mediator.detach();
viewPager2.unregisterOnPageChangeCallback(changeCallback);
super.onDestroy();
}
}
Fragment内部使用RecyclerView
效果如下
传不上去。。。。