使用片段在 Android 中實現 ViewPager 示例

---

Android ViewPager 控制元件是構建可滑動或可滾動使用者介面的重要元件。它允許使用者左右翻閱資料頁面，這是當今各種應用程式中常見的模式。在本綜合指南中，我們將探討如何在 Android 中使用 ViewPager 與 Fragment，並輔以一個實際示例來幫助您理解。

ViewPager 和 Fragment 簡介

在深入程式碼之前，讓我們瞭解 ViewPager 和 Fragment 的基礎知識 -

• ViewPager - 一個佈局管理器，允許使用者左右翻閱資料頁面。當您需要向用戶顯示一系列頁面時，它是理想的工具。

• Fragment - Fragment 表示使用者介面的一部分或應用程式行為的一個方面，封裝在模組化且可重用的類中。一個 Activity 中可以存在多個 Fragment，它們共同建立靈活且響應式的使用者介面。

將 ViewPager 與 Fragment 結合使用，使我們能夠建立可滑動檢視功能，這在許多流行的 Android 應用程式中很常見。

使用 Fragment 設定 ViewPager：分步指南

讓我們建立一個 Android 應用程式來演示如何使用 ViewPager 與 Fragment。

步驟 1 - 設定專案

建立一個新的 Android Studio 專案。在專案嚮導中，選擇“空 Activity”並將語言設定為 Java。

步驟 2 - 新增依賴項

將 ViewPager2 依賴項新增到您的 build.gradle (Module) 檔案中 -

dependencies {
   implementation    'androidx.viewpager2:viewpager2:1.1.0-alpha01'
}

新增依賴項後，不要忘記同步專案。

步驟 3 -

建立三個新的 Fragment - FirstFragment、SecondFragment 和 ThirdFragment。每個 Fragment 將代表我們 ViewPager 中的一個頁面。

以下是如何建立 FirstFragment 的示例：

public class FirstFragment extends Fragment {
   @Nullable
   @Override
   public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
      return inflater.inflate(R.layout.fragment_first, container, false);
   }
}

步驟 4 - 建立介面卡

接下來，建立一個 FragmentStateAdapter，它將管理 Fragment 並根據需要將其提供給 ViewPager。

public class ViewPagerAdapter extends FragmentStateAdapter {
   public ViewPagerAdapter(@NonNull FragmentActivity fragmentActivity) {
      super(fragmentActivity);
   }
   @NonNull
   @Override
   public Fragment createFragment(int position) {
      switch (position) {
      case 0:
         return new FirstFragment();
      case 1:
         return new SecondFragment();
      case 2:
         return new ThirdFragment();
         }
      return new FirstFragment();
   }
   @Override
   public int getItemCount() {
      return 3;
   }
}

步驟 5 - 在 Activity 中設定 ViewPager

最後，在您的 MainActivity 中，初始化 ViewPager 並設定其介面卡。

public class MainActivity extends AppCompatActivity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      ViewPager2 viewPager = findViewById(R.id.viewPager);
      viewPager.setAdapter(new ViewPagerAdapter(this));
   }
}

確保您的 activity_main.xml 佈局檔案中有一個 ViewPager2 -

   <androidx.viewpager2.widget.ViewPager2
   android:id="@+id/viewPager"
   android:layout_width="match_parent"
   android:layout_height="match
   android:layout_height="match_parent" />

實現這些步驟後，每次滑動都將移動到不同的 Fragment，向用戶呈現新的螢幕。

增強 ViewPager 體驗

雖然基本實現已完成，但您可以新增一些其他功能來增強使用者體驗。

新增頁面標題

例如，您可以在 ViewPager 中的每個 Fragment 中新增頁面標題。這可以透過覆蓋 ViewPagerAdapter 類中的 getPageTitle() 方法來實現 -

@Override
public CharSequence getPageTitle(int position) {
   switch (position) {
      case 0:
         return "First";
      case 1: 
         return "Second";
      case 2:
         return "Third";
      }
   return null;
}   

將 TabLayout 與 ViewPager 整合

一個常見的用例是將 ViewPager 與 TabLayout 結合使用，提供更具互動性和直觀的滑動體驗。在 XML 檔案中設定 TabLayout 後，您可以在 MainActivity 中將其與 ViewPager 關聯 -

TabLayout tabLayout = findViewById(R.id.tab_layout);
TabLayoutMediator tabLayoutMediator = new TabLayoutMediator(
   tabLayout, viewPager, true, new TabLayoutMediator.TabConfigurationStrategy() {
      @Override
      public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
        tab.setText("Tab " + (position + 1));
      }
   });
tabLayoutMediator.attach();

不要忘記將 TabLayout 依賴項新增到您的 build.gradle 檔案中。

implementation 'com.google.android.material:material:1.3.0'

結論

Android 中的 ViewPager 控制元件與 Fragment 結合使用，可以有效地在應用程式中建立可滑動檢視。此功能提供無縫的瀏覽體驗，是現代 Android 開發的重要組成部分。