(Preliminary learning record)
1. What is Fragment
- Fragment is a UI fragment that can be embedded in Activity. It allows the program to make more reasonable and full use of the space of the large screen, so it is widely used on tablets.
- Much like Activity, it can also contain layout, and it also has its own life cycle.
- Both mobile phones and tablets need to be considered for fragments
2. The basic usage of Fragment
Learn more about it through an example:
- Define the Fragment layout
Create a new Fragment layout left_fragment.xml on the left, and create a new Fragment layout right_fragment.xml on the right, the code is as follows:
left_fragment.xml to be implemented
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Button"
/>
</LinearLayout>
right_fragment.xml to be implemented
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#00ff00">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textSize="24sp"
android:text="This is right fragment"
/>
</LinearLayout>
- Create Fragment
and then write the code in LeftFragment and RightFragment, as shown below:
class LeftFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.left_fragment, container, false)
}
}
class RightFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.right_fragment, container, false)
}
}
- Introduce Fragment into the layout and
then modify activity_main.xml to introduce Fragment into the layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<fragment
android:id="@+id/leftFrag"
android:name="com.example.fragmenttest.LeftFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<fragment
android:id="@+id/rightFrag"
android:name="com.example.fragmenttest.RightFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
The effect in the mobile phone is
as follows: the effect in the tablet is as follows:
- To dynamically add Fragments,
you first need to prepare a layout as a window for dynamically adding Fragments.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<fragment
android:id="@+id/leftFrag"
android:name="com.example.fragmenttest.LeftFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<FrameLayout
android:id="@+id/rightLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" >
</FrameLayout>
</LinearLayout>
- Then add content to FrameLayout in the code to realize the function of dynamically adding Fragment.
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
button.setOnClickListener {
replaceFragment(AnotherRightFragment())
}
}
private fun replaceFragment(fragment: Fragment) {
val fragmentManager = supportFragmentManager
val transaction = fragmentManager.beginTransaction()
transaction.replace(R.id.rightLayout, fragment)
transaction.commit()
}
}
AnotherRightFragment file:
class AnotherRightFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.another_right_fragment, container, false)
}
}
another_right_fragment layout file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#ffff00"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textSize="12sp"
android:text="This is another right fragment"
/>
</LinearLayout>
Steps to dynamically add Fragment
- Create an instance of Fragment to be added.
- Get FragmentManager, you can directly call getSupportFragmentManager() method to get it in Activity.
- To start a transaction, start by calling the beginTransaction() method.
- Adding or replacing Fragments into the container is generally implemented using the replace() method. The id of the container and the Fragment instance to be added need to be passed in.
- Commit the transaction and call the commit() method to complete.
Implementing the return stack in
Fragment FragmentTransaction provides an addToBackStack() method, which can be used to add a transaction to the return stack to achieve an effect similar to the Activity return stack.
class MainActivity : AppCompatActivity() {
…
private fun replaceFragment(fragment: Fragment) {
val fragmentManager = supportFragmentManager
val transaction = fragmentManager.beginTransaction()
transaction.replace(R.id.rightLayout, fragment)
transaction.addToBackStack(null)
transaction.commit()
}
}
Three. Fragment life cycle
-
onAttach() is called when the Fragment and Activity are associated.
-
onCreateView() is called when creating a view for the Fragment (loading the layout).
-
onActivityCreated() is called when the Activity associated with the Fragment has been created.
-
onDestroyView() is called when the view associated with the Fragment is removed.
-
onDetach() is called when the Fragment is disassociated from the Activity.
-
-
large qualifier
Many tablet applications use dual-page mode, so how can I determine whether the program should use dual-page mode or single-page mode at runtime? This requires the help of qualifiers (qualifier) to achieve.
Using the large qualifier, devices with large screens will automatically load the layout in the layout-large folder, and devices with small screens will still load the layout in the layout folder.
- Minimum width qualifier
Using the large qualifier can successfully solve the problem of single-page and double-page judgment, but soon a new problem appeared: how big is large? Sometimes we want to be more flexible in loading layouts for different devices, regardless of whether they are recognized as large by the system, then we can use the smallest-width qualifier.
Create a new layout-sw600dp folder in the res directory, so that when the program runs on a device with a screen width greater than or equal to 600dp, the layout-sw600dp/activity_main layout will be loaded, and when the program runs on a device with a screen width less than 600dp, it will still Load the default layout/activity_main layout