资料
简介
- 没啥就是实现一个简单的多页面和Tab联动的效果吗，使用标题的实现真的是简单又快捷
简单实现
- TabLayout的部分在上一篇已经实现了。
- 这次实现ViewPager2和Fragment
ViewPager2
- 依赖,因为实在moudle_common中依赖所以是api
//Viewpager2和Recycler，因为ViewPager2内部好像是使用Recyclerview实现的.
api 'androidx.recyclerview:recyclerview:1.3.0'
api 'androidx.viewpager2:viewpager2:1.0.0'
- 布局
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.tabs.TabLayout
app:layout_constraintBottom_toTopOf="@+id/vp_pic"
android:id="@+id/tab_pic"
android:layout_width="match_parent"
android:layout_height="44dp"
app:tabIndicatorFullWidth="false"
app:tabSelectedTextColor="@color/purple_200"
app:tabMinWidth="50dp"
app:tabTextColor="@color/teal_700"
app:tabIndicatorColor="@color/teal_200"
app:tabIndicator="@drawable/pic_manager_layout_underline"
app:tabTextAppearance="@style/pic_manager_layout_style"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="全部" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="未上传" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="已上传" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="上传中" />
</com.google.android.material.tabs.TabLayout>
<androidx.viewpager2.widget.ViewPager2
app:layout_constraintTop_toBottomOf="@+id/tab_pic"
android:id="@+id/vp_pic"
android:layout_width="match_parent"
android:layout_height="0dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
-
新建一个Fragment
图片.png
public class PicFragment extends Fragment {
// TODO: Rename parameter arguments, choose names that match
// the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
private static final String ARG_PARAM1 = "param1";
private static final String ARG_PARAM2 = "param2";
// TODO: Rename and change types of parameters
private String mParam1;
private String mParam2;
public PicFragment() {
// Required empty public constructor
}
/**
* Use this factory method to create a new instance of
* this fragment using the provided parameters.
*
* @param param1 Parameter 1.
* @param param2 Parameter 2.
* @return A new instance of fragment PicFragment.
*/
// TODO: Rename and change types and number of parameters
public static PicFragment newInstance(String param1, String param2) {
PicFragment fragment = new PicFragment();
Bundle args = new Bundle();
args.putString(ARG_PARAM1, param1);
args.putString(ARG_PARAM2, param2);
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments() != null) {
mParam1 = getArguments().getString(ARG_PARAM1);
mParam2 = getArguments().getString(ARG_PARAM2);
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.fragment_pic, container, false);
initView(view);
return view;
}
private void initView(View view) {
TextView textView = view.findViewById(R.id.tv_name);
ImageView imageView = view.findViewById(R.id.img);
textView.setText(mParam1);
}
}
- 把Fragment的布局优化以下
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".tablayout.fragment.PicFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:id="@+id/tv_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/hello_blank_fragment"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/img"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/move1"
app:layout_constraintTop_toBottomOf="@+id/tv_name" />
</androidx.constraintlayout.widget.ConstraintLayout>
- 写ViewPager2的Adapter
public class PicManagerAdapter extends FragmentStateAdapter {
List<Fragment> fragments = new ArrayList<>();
public PicManagerAdapter(@NonNull FragmentManager fragmentManager, @NonNull Lifecycle lifecycle, List<Fragment> fragments) {
super(fragmentManager, lifecycle);
this.fragments = fragments;
}
@NonNull
@Override
public Fragment createFragment(int position) {
return fragments.get(position);
}
@Override
public int getItemCount() {
return fragments.size();
}
}
- 去代码中初始化并使用
private void initViewPager() {
ViewPager2 viewPager2 = findViewById(R.id.vp_pic);
PicManagerAdapter adapter = new PicManagerAdapter(getSupportFragmentManager(),getLifecycle(),fragments);
viewPager2.setAdapter(adapter);
new TabLayoutMediator(tableLayout, viewPager2, new TabLayoutMediator.TabConfigurationStrategy() {
@Override
public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
tab.setText(tabs.get(position));
}
}).attach();
}
private void initPage() {
fragments.add(PicFragment.newInstance("全部",""));
fragments.add(PicFragment.newInstance("未上传",""));
fragments.add(PicFragment.newInstance("已上传",""));
fragments.add(PicFragment.newInstance("上传中",""));
tabs.add("全部");
tabs.add("未上传");
tabs.add("已上传");
tabs.add("上传中");
}
网友评论