TabLayout cannot be cast to androidx.viewpager2.widget.ViewPager2 - android-studio

Question

I'm new to Android Studio and I'm trying the build a TabLayout inside a fragment.
Originally the tab layout was made in an Acitvtie, but I modified the code to make it work in a fragment.
11/23 15:56:40: Launching 'app' on Samsung Galaxy Tab S7 FE API 22.
Install successfully finished in 3 s 16 ms.
$ adb shell am start -n "com.ssl.app/com.ssl.app.MainActivity" -a android.intent.action.MAIN -c android.intent.category.LAUNCHER
Connected to process 22349 on device 'Samsung_Galaxy_Tab_S7_FE_API_22 [emulator-5554]'.
Capturing and displaying logcat messages from application. This behavior can be disabled in the "Logcat output" section of the "Debugger" settings page.
E/libprocessgroup: failed to make and chown /acct/uid_10097: Read-only file system
W/Zygote: createProcessGroup failed, kernel missing CONFIG_CGROUP_CPUACCT?
I/art: Late-enabling -Xcheck:jni
W/art: Before Android 4.1, method android.graphics.PorterDuffColorFilter androidx.vectordrawable.graphics.drawable.VectorDrawableCompat.updateTintFilter(android.graphics.PorterDuffColorFilter, android.content.res.ColorStateList, android.graphics.PorterDuff$Mode) would have incorrectly overridden the package-private method in android.graphics.drawable.Drawable
D/OpenGLRenderer: Use EGL_SWAP_BEHAVIOR_PRESERVED: true
D/: HostConnection::get() New Host Connection established 0xb40f16f0, tid 22349
D/Atlas: Validating map...
D/: HostConnection::get() New Host Connection established 0xae85f2e0, tid 22367
I/OpenGLRenderer: Initialized EGL, version 1.4
W/OpenGLRenderer: Failed to choose config with EGL_SWAP_BEHAVIOR_PRESERVED, retrying without...
D/EGL_emulation: eglCreateContext: 0xae834d00: maj 2 min 0 rcv 2
D/EGL_emulation: eglMakeCurrent: 0xae834d00: ver 2 0 (tinfo 0xae839400)
D/OpenGLRenderer: Enabling debug mode 0
D/EGL_emulation: eglMakeCurrent: 0xae834d00: ver 2 0 (tinfo 0xae839400)
D/AndroidRuntime: Shutting down VM
E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.ssl.app, PID: 22349
java.lang.ClassCastException: com.google.android.material.tabs.TabLayout cannot be cast to androidx.viewpager2.widget.ViewPager2
at com.ssl.app.ui.tablayout.TabLayoutFragment.onCreateView(TabLayoutFragment.java:32)
at androidx.fragment.app.Fragment.performCreateView(Fragment.java:3104)
at androidx.fragment.app.FragmentStateManager.createView(FragmentStateManager.java:524)
at androidx.fragment.app.FragmentStateManager.moveToExpectedState(FragmentStateManager.java:261)
at androidx.fragment.app.FragmentManager.executeOpsTogether(FragmentManager.java:1890)
at androidx.fragment.app.FragmentManager.removeRedundantOperationsAndExecute(FragmentManager.java:1814)
at androidx.fragment.app.FragmentManager.execPendingActions(FragmentManager.java:1751)
at androidx.fragment.app.FragmentManager$5.run(FragmentManager.java:538)
at android.os.Handler.handleCallback(Handler.java:739)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5254)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:903)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:698)
TabLayoutFragment.class
package com.ssl.app.ui.tablayout;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.viewpager2.widget.ViewPager2;
import com.google.android.material.tabs.TabLayout;
import com.ssl.app.R;
//import com.ssl.app.R;
public class TabLayoutFragment extends Fragment {
TabLayout tabLayout;
ViewPager2 viewPager2;
MyViewPagerAdapter myViewPagerAdapter;
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.fragment_tablayout,container,false);
tabLayout = (TabLayout) root.findViewById(R.id.tab_layout);
viewPager2 = (ViewPager2) root.findViewById(R.id.tab_layout);
myViewPagerAdapter = new MyViewPagerAdapter(this);
viewPager2.setAdapter(myViewPagerAdapter);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
#Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager2.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(TabLayout.Tab tab) {
}
#Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
viewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
#Override
public void onPageSelected(int position) {
super.onPageSelected(position);
tabLayout.getTabAt(position).select();
}
});
return root;
}
}
MyViewPagerAdapter.class
package com.ssl.app.ui.tablayout;
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentActivity;
import androidx.viewpager2.adapter.FragmentStateAdapter;
public class MyViewPagerAdapter extends FragmentStateAdapter {
public MyViewPagerAdapter(#NonNull Fragment fragment) {
super(fragment);
}
#NonNull
#Override
public Fragment createFragment(int position) {
switch (position) {
case 0:
return new FragmentAlpha();
case 1:
return new FragmentBeta();
case 2:
return new FragmentCharlie();
case 3:
return new FragmentDelta();
default:
return new FragmentAlpha();
}
}
#Override
public int getItemCount() {
return 4;
}
}
fragment_tablelayout.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.tablayout.TabLayoutFragment" >
<!-- TabLayout -->
<com.google.android.material.tabs.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tab_layout">
<!-- TABS -->
<com.google.android.material.tabs.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Alpha"
tools:ignore="HardcodedText" />
<com.google.android.material.tabs.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Beta"/>
<com.google.android.material.tabs.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Charlie"/>
<com.google.android.material.tabs.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Delta"/>
</com.google.android.material.tabs.TabLayout>
<!-- ViewPager -->
<androidx.viewpager2.widget.ViewPager2
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/view_pager"
android:layout_below="#id/tab_layout"/>
</RelativeLayout>
MainActivity.class
package com.ssl.app;
import android.os.Bundle;
import android.view.Menu;
import com.google.android.material.navigation.NavigationView;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;
import androidx.drawerlayout.widget.DrawerLayout;
import androidx.appcompat.app.AppCompatActivity;
import com.ssl.app.databinding.ActivityMainBinding;
public class MainActivity extends AppCompatActivity {
private AppBarConfiguration mAppBarConfiguration;
private ActivityMainBinding binding;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivityMainBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
setSupportActionBar(binding.appBarMain.toolbar);
DrawerLayout drawer = binding.drawerLayout;
NavigationView navigationView = binding.navView;
// Passing each menu ID as a set of Ids because each
// menu should be considered as top level destinations.
mAppBarConfiguration = new AppBarConfiguration.Builder(
R.id.nav_home, R.id.nav_Stocklist, R.id.nav_Settings)
.setOpenableLayout(drawer)
.build();
NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_content_main);
NavigationUI.setupActionBarWithNavController(this, navController, mAppBarConfiguration);
NavigationUI.setupWithNavController(navigationView, navController);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
#Override
public boolean onSupportNavigateUp() {
NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_content_main);
return NavigationUI.navigateUp(navController, mAppBarConfiguration)
|| super.onSupportNavigateUp();
}
}
I probably overlooked something