Develop Reference

Set a Fragment inside a Fragment

I have seen similar questions here, but none of them helps.
I have MainActivity and a few Fragments which works fine, but I want to set one fragment inside of another.
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val bottomNavigationView = findViewById<BottomNavigationView>(R.id.bottomMenu)
val hostFragment = supportFragmentManager.findFragmentById(R.id.fragmentContainer) as NavHostFragment
val navigationController = hostFragment.navController
bottomNavigationView.setupWithNavController(navigationController)
setupActionBarWithNavController(navigationController)
}
override fun onSupportNavigateUp(): Boolean {
val navController = findNavController(R.id.fragmentContainer)
return navController.navigateUp() || super.onSupportNavigateUp()
}
}
Parent Fragment:
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
val view = inflater.inflate(R.layout.fragment_main, container, false)
incomeButton = view.findViewById(R.id.addIncomeButton)
expenseButton = view.findViewById(R.id.addExpenseButton)
val childFragment: Fragment = ChartFragment()
val transaction: FragmentTransaction = childFragmentManager.beginTransaction()
transaction.replace(R.id.childFragment, childFragment).commit()
return view
}
Child Fragment:
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View {
// Inflate the layout for this fragment
return ComposeView(requireContext()).apply {
setContent {
Text(
text = "here is another important code",
fontSize = 28.sp
)
}
}
The layouts for Activity:
<?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=".MainActivity">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomMenu"
android:layout_width="match_parent"
android:layout_height="60dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:menu="#menu/bottom_menu" />
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragmentContainer"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="475dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#+id/bottomMenu"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/nav_map" />
</androidx.constraintlayout.widget.ConstraintLayout>
The layouts for 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=".fragments.MainFragment">
<Button
android:id="#+id/addIncomeButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="21dp"
android:layout_marginBottom="21dp"
android:backgroundTint="#color/primary"
android:text="#string/addIncomeButton"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<Button
android:id="#+id/addExpenseButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="21dp"
android:layout_marginBottom="10dp"
android:backgroundTint="#color/red"
android:text="#string/addExpenseButton"
app:layout_constraintBottom_toTopOf="#+id/addIncomeButton"
app:layout_constraintEnd_toEndOf="parent" />
<FrameLayout
android:id="#+id/forChart"
android:layout_width="match_parent"
android:layout_height="350dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The most of the same questions' solvations say to use childFragmentManager so do I but it doesn't work.
I get an error java.lang.IllegalArgumentException: No view found for id 0x7f08023f.
I guess I do not understand something, but I can't realize what.
Thank you!

Seems that you're mixing the ids of the container for the transaction - that's also what the error says. You're trying to put the ChartFragment into a container with R.id.childFragment id:
transaction.replace(R.id.childFragment, childFragment).commit()
And from what I see in the MainFragment layout, the container id is R.id.forChart. Try changing it to this:
transaction.replace(R.id.forChart, childFragment).commit()

Material Container Transform animation using floating action button not working smoothly

I am trying to open a fragment by clicking on floating action button using material container transform animation. I have implemented the animation but it is not working as I expected.
When navigating from one fragment A to Fragment B, the floating action button is still visible (enlarged for a brief second) when Fragment B is being opened.
What changes do I make in the animation so that the transition from floating action button to Fragment B feels more smooth? or How do I hide the enlarged floating action button when navigating to Fragment B?
Below is the code of Fragments and layouts for reference.
Fragment A layout:
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".ui.home.HomeFragment">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/create_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:transitionName="my_transition"
android:src="#drawable/ic_round_add_24"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/dimen_16"
android:contentDescription="New Task"
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Fragment A code:
class FragmentA : Fragment() {
private var _binding: FragmentABinding? = null
private val binding get() = _binding!!
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
exitTransition = Hold()
}
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View {
_binding = FragmentABinding.inflate(inflater)
binding.createTask.setOnClickListener {
val extras = FragmentNavigatorExtras(binding.createTask to "my_transition")
findNavController().navigate(R.id.action_FragmentA_to_FragmentB,null,null,extras)
}
return binding.root
}
override fun onDestroyView() {
super.onDestroyView()
_binding = null
}
}
Fragment B layout:
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:transitionName="my_transition"
tools:context=".ui.edit.EditTaskFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_size"
app:liftOnScroll="true">
<FrameLayout
android:layout_width="match_parent"
android:paddingHorizontal="#dimen/dimen_16"
android:layout_height="match_parent">
<ImageButton
android:id="#+id/close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_close_24"
android:background="?attr/selectableItemBackgroundBorderless"
android:layout_gravity="start|center_vertical"
app:tint="?attr/colorPrimary" />
<com.google.android.material.button.MaterialButton
android:id="#+id/save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|center_vertical"
style="#style/Widget.Material3.Button.TonalButton"
android:text="Save"
android:minWidth="0dp"
android:minHeight="0dp"/>
</FrameLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="#style/TextAppearance.Material3.HeadlineSmall"
android:textAlignment="center"
android:text="This is new Fragment"/>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Fragment B code:
class FragmentB : Fragment() {
private var _binding: FragmentBBinding? = null
private val binding get() = _binding!!
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
sharedElementEnterTransition = MaterialContainerTransform()
}
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View {
_binding = FragmentBBinding.inflate(inflater)
return binding.root
}
override fun onDestroyView() {
super.onDestroyView()
_binding = null
}
}

Solved the problem!!
Just set startContainerColor and endContainerColor parameter in materialContainerTransform to surface color and then the fab transition is done more smoothly
Replace sharedElementEnterTransition in FragmentB with this:
sharedElementEnterTransition = MaterialContainerTransform().apply {
startContainerColor = requireContext().getColorFromAttr(com.google.android.material.R.attr.colorSurface)
endContainerColor = requireContext().getColorFromAttr(com.google.android.material.R.attr.colorSurface)
}

How to use Jetpack View Binding for Abstract Fragments

I have two fragments which have a lot in common. Therefore, I have an abstract fragment with an "abstract" layout file for this, which is included in the other two layout files.
However, I am not sure, how to use Jetpack View Binding for the abstract fragment, because I don't know which layout file is used.
Here a simplified example of my problem:
Abstract fragment (ExampleAbstractFragment.kt):
abstract class ExampleAbstractFragment : Fragment() {
override fun doSomething() {
val abstractTextView = findViewById<TextView>(R.id.abstract_text_view)
// ^^ How to get this with View Binding
val abstractButton = findViewById<Button>(R.id.abstract_button)
// ^^ How to get this with View Binding
}
}
Layout file of abstract fragment (fragment_example_abstract.xml):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/abstract_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/test" />
<Button
android:id="#+id/abstract_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/test" />
</LinearLayout>
--
First fragment (ExampleFragmentA.kt):
class ExampleFragmentA : ExampleAbstractFragment() {
private var _binding: FragmentAExampleBinding? = null
private val binding get() = _binding!!
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
_binding = FragmentAExampleBinding?.inflate(inflater, container, false)
return binding.root
}
override fun onDestroyView() {
super.onDestroyView()
_binding = null
}
override fun doSomething() {
val textView = binding.fragmentAExampleTextView
val button = binding.fragmentAExampleButton
}
}
Layout file of first fragment (fragment_a_example.xml):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/fragment_a_example_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/test" />
<include
layout="#layout/fragment_example_abstract"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/fragment_a_example_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/test" />
</LinearLayout>
--
Second fragment (ExampleFragmentB.kt):
class ExampleFragmentB : ExampleAbstractFragment() {
private var _binding: FragmentBExampleBinding? = null
private val binding get() = _binding!!
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
_binding = FragmentBExampleBinding?.inflate(inflater, container, false)
return binding.root
}
override fun onDestroyView() {
super.onDestroyView()
_binding = null
}
override fun doSomething() {
val editText = binding.fragmentBExampleEditText
val imageView = binding.fragmentBExampleImageView
}
}
Layout file of second fragment (fragment_b_example.xml):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:id="#+id/fragment_b_example_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/test" />
<include
layout="#layout/fragment_example_abstract"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/fragment_b_image_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/test" />
</LinearLayout>

[kotlin]add the button function, it can't run

In MainActivity.kt, add the button function, it can't run.
How to solve?
Thank!
add the button function, it can't run.
binding.button1.setOnClickListener {
binding.text.text = "123"
}
drive.google.com
Source code
activity_main.xml
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:backgroundTint="#702020" />
<TextView
android:id="#+id/text"
android:text="text"
android:textSize="50dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<fragment
android:id="#+id/nav_host_fragment"
android:name="com.android.myapplication.Fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout="#layout/fragment_"
/>
</LinearLayout>
fragment_.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Fragment">
</FrameLayout>
MainActivity.kt
class MainActivity : AppCompatActivity() {
val binding: ActivityMainBinding by viewbind()
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
binding.button1.setOnClickListener {
binding.text.text = "123"
}
}
}
Fragment.kt
class Fragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_, container, false)
}
error code
enter image description here

Add below Gradle dependency
implementation "androidx.fragment:fragment-ktx:1.3.1"
Replace <fragment> with following code
<androidx.fragment.app.FragmentContainerView
android:id="#+id/nav_host_fragment"
android:name="com.android.myapplication.Fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout="#layout/fragment_" />

another replace in MainActivity.kt
class MainActivity : AppCompatActivity() {
val binding: ActivityMainBinding by viewbind()
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val fragmentTransaction: FragmentTransaction = supportFragmentManager.beginTransaction()
fragmentTransaction.add(R.id.nav_host_fragment, com.android.myapplication.Fragment())
fragmentTransaction.show(com.android.myapplication.Fragment())
fragmentTransaction.commit()
binding.button1.setOnClickListener {
binding.text.text = "123"
}

Error :Binary XML file line : Inflating class fragment

I have an activity MainActivity in which I have and fragment signup_fragment I want to call fragment from an activity but it gives an exception of Binary XML file line #23: Binary XML file line #23: Error inflating class fragment
and Caused by: java.lang.RuntimeException: com.example.pickingredients.MainActivity#d9ff1e7 must implement OnFragmentInteractionListener
Below are my code
MainActivity
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val fragment=Signup()
supportFragmentManager.beginTransaction().add(R.id.sigup_fragment,fragment).commit()
}
SignupFragment
class Signup : Fragment() {
// TODO: Rename and change types of parameters
private var param1: String? = null
private var param2: String? = null
private var listener: OnFragmentInteractionListener? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
arguments?.let {
param1 = it.getString(ARG_PARAM1)
param2 = it.getString(ARG_PARAM2)
}
}
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_signup, container, false)
}
// TODO: Rename method, update argument and hook method into UI event
fun onButtonPressed(uri: Uri) {
listener?.onFragmentInteraction(uri)
}
override fun onAttach(context: Context) {
super.onAttach(context)
if (context is OnFragmentInteractionListener) {
listener = context
} else {
throw RuntimeException(context.toString() + " must implement OnFragmentInteractionListener")
}
}
override fun onDetach() {
super.onDetach()
listener = null
} }
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:background="#color/light_grey">
<TextView
android:text="#string/what_is_your_mood"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/mood_tv"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="8dp"
app:layout_constraintHorizontal_bias="0.03"
android:layout_marginTop="16dp" app:layout_constraintTop_toTopOf="parent"
android:textSize="18sp"/>
<androidx.constraintlayout.widget.Guideline android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/guideline" app:layout_constraintGuide_begin="16dp"
android:orientation="vertical"/>
<fragment
android:layout_width="362dp"
android:layout_height="98dp" android:name="com.example.pickingredients.ImagesliderFragment"
android:id="#+id/sigup_fragment" app:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="8dp" app:layout_constraintStart_toStartOf="#+id/guideline"
android:layout_marginStart="8dp" app:layout_constraintTop_toBottomOf="#+id/mood_tv"
android:layout_marginTop="16dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
fragment_signup.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Signup">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/hello_blank_fragment"/>
</FrameLayout>

Just remove android:name tag from <fragment .../>..
And use FrameLayout instead of fragment.
Or you can use below code.
<FrameLayout
android:layout_width="362dp"
android:layout_height="98dp"
android:id="#+id/sigup_fragment"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toBottomOf="#+id/mood_tv" />

Problem is here com.example.pickingredients.ImagesliderFragment. Either this fragment not found or having issues on that fragment.
And you should use FrameLayout instead of Fragment in xml.
Moreover your MainActivity should implement OnFragmentInteractionListener