1. Implement thư viện
1 |
implementation 'com.google.android.material:material:+' |
2. Tạo các Class
- Tạo Class FragmentA, FragmentB, FragmentC tương ứng layout fragment_a, fragment_b, fragment_c;
- Tạo Class ViewPagerAdapter
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
package com.example.miniproject.viewpager; import androidx.annotation.NonNull; import androidx.annotation.Nullable; import androidx.fragment.app.Fragment; import androidx.fragment.app.FragmentManager; import androidx.fragment.app.FragmentPagerAdapter; public class ViewPagerAdapter extends FragmentPagerAdapter { private Fragment[] fragments; public ViewPagerAdapter(@NonNull FragmentManager fm, Fragment ... fragments) { super(fm, FragmentPagerAdapter.BEHAVIOR_RESUME_ONLY_CURRENT_FRAGMENT); this.fragments = fragments; } @NonNull @Override public Fragment getItem(int position) { return fragments[position]; } @Override public int getCount() { return fragments.length; } @Nullable @Override public CharSequence getPageTitle(int position) { switch (position){ case 0: return "FragmentA"; case 1: return "FragmentB"; case 2: return "FragmentC"; } return super.getPageTitle(position); } } |
3. Tạo activity_main.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<?xml version="1.0" encoding="utf-8"?> <LinearLayout 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:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <com.google.android.material.tabs.TabLayout android:id="@+id/tl_news" android:layout_width="match_parent" android:layout_height="wrap_content"/> <androidx.viewpager.widget.ViewPager android:id="@+id/vp_news" android:layout_width="match_parent" android:layout_height="wrap_content"> <androidx.viewpager.widget.PagerTabStrip android:layout_width="match_parent" android:layout_height="wrap_content"/> </androidx.viewpager.widget.ViewPager> </LinearLayout> |
4. Tại MainActivity.class
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
package com.example.miniproject; import androidx.appcompat.app.AppCompatActivity; import androidx.viewpager.widget.ViewPager; import android.os.Bundle; import com.example.miniproject.viewpager.FavoriteFragment; import com.example.miniproject.viewpager.NewFragment; import com.example.miniproject.viewpager.SavedFragment; import com.example.miniproject.viewpager.ViewPagerAdapter; import com.google.android.material.tabs.TabLayout; public class MainActivity extends AppCompatActivity { private ViewPager vpNews; private TabLayout tlNews; private FragmentA fmA = new FragmentA(); private FragmentA fmB = new FragmentB(); private FragmentA fmC = new FragmentC(); private ViewPagerAdapter vpAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); } private void initView() { vpNews = findViewById(R.id.vp_news); tlNews = findViewById(R.id.tl_news); vpAdapter = new ViewPagerAdapter(getSupportFragmentManager(), fmA, fmB, fmC); vpNews.setAdapter(vpAdapter); tlNews.setupWithViewPager(vpNews); vpNews.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { } @Override public void onPageScrollStateChanged(int state) { } }); } } |