Adding fragment to Android Developer Studio's Tabbed Activity Template - android-studio

Question

Beginner here. Creating an app using the Android Developer Studios Tabbed Activity Template. I have two xml, the generated fragment_main.xml that comes with the template and secondtab.xml for what I want to be the second tab.
This is the code generated by the template:
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val sectionsPagerAdapter = SectionsPagerAdapter(this, supportFragmentManager)
val viewPager: ViewPager = findViewById(R.id.view_pager)
viewPager.adapter = sectionsPagerAdapter
val tabs: TabLayout = findViewById(R.id.tabs)
tabs.setupWithViewPager(viewPager)
val fab: FloatingActionButton = findViewById(R.id.fab)
fab.setOnClickListener { view ->
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show()
}
I've been reading through the ViewPager documentation and a lot of what I can find is making this all from scratch and I'm having trouble understanding. I feel like I'm missing something obvious. How do I add my secondtab.xml to this pregenerated template so it shows up when the user clicks on the second tab?

Answer 1

Yours SectionsPagerAdapter getItem function should looks like this:
class SectionsPagerAdapter(
private val context: Context,
fm: FragmentManager
) : FragmentPagerAdapter(fm, BEHAVIOR_RESUME_ONLY_CURRENT_FRAGMENT) {
override fun getItem(position: Int) = when (position) {
0 -> FirstTabFragment()
1 -> SecondTabFragment()
else -> error("Unknown")
}
override fun getPageTitle(position: Int) = context.resources.getString(TAB_TITLES[position])
override fun getCount() = 2
}
Because by default in this template SectionsPagerAdapter always creates PlaceholderFragment:
override fun getItem(position: Int): Fragment {
// getItem is called to instantiate the fragment for the given page.
// Return a PlaceholderFragment (defined as a static inner class below).
return PlaceholderFragment.newInstance(position + 1)
}
But in yours case you need use two different fragments with two different xml-layouts like this:
class FirstTabFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.fragment_main, container, false)
val textView: TextView = root.findViewById(R.id.section_label)
return root
}
}
class SecondTabFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.secondtab, container, false)
val textView: TextView = root.findViewById(R.id.section_label)
return root
}
}
Also make sure to add:
<TextView
android:id="#+id/section_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/activity_horizontal_margin"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginBottom="#dimen/activity_vertical_margin"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="#+id/constraintLayout"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
to the fragment xml