<h3><span style="color: #000080;"><strong>Fragment </strong></span></h3>
<ol>
<li>A <span style="color: #008000;"><strong>fragment</strong></span><em> </em>is an independent Android component which can be used by an activity. A fragment encapsulates functionality so that it is easier to reuse within activities and layouts.</li>
<li>A fragment runs in the context of an activity, but has its own <strong><span style="color: #008000;">life cycle</span></strong> and typically its own<span style="color: #008000;"><strong> user interface</strong></span>.</li>
<li>Android devices exists in a variety of screen sizes and densities. Fragments simplify the<span style="color: #008000;"><strong> reuse</strong></span> of components in different layouts and their logic.</li>
<li>You can build <span style="color: #008000;"><strong>single-pane layouts</strong></span> for handsets (phones) and <span style="color: #008000;"><strong>multi-pane layouts</strong></span> for tablets. You can also use fragments supports different layout for landscape and portrait orientation on a smartphone.</li>
<li>As it is possible to <span style="color: #008000;"><strong>dynamically</strong></span> add and remove fragments from an activity. The usage of fragments allows to design very flexible user interfaces.</li>
</ol>
<p>Get <span style="color: #0000ff;"><strong>GITHUB</strong></span> code from <span style="color: #0000ff;"><a style="color: #0000ff;" href="https://github.com/arunk7839/FragmentExample"><strong>Here</strong></a></span>.</p>
<p><amp-youtube layout="responsive" width="1200" height="675" data-videoid="OKd5R0rtPls" title="Android Fragment Example"><a placeholder href="https://youtu.be/OKd5R0rtPls"><img src="https://i.ytimg.com/vi/OKd5R0rtPls/hqdefault.jpg" layout="fill" object-fit="cover" alt="Android Fragment Example"></a></amp-youtube></p>
<p> ;</p>
<p><span style="color: #008000;"><strong>Let&#8217;s have a look at the simple example of Fragment in Android.</strong></span></p>
<p><strong><span style="color: #0000ff;">activity_main.xml</span></strong><br />
<code></code></p>
<pre><strong><;?xml version="1.0" encoding="utf-8"?>;</strong>
<strong><;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"</strong>
<strong> xmlns:tools="http://schemas.android.com/tools"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="match_parent"</strong>
<strong> tools:context="com.example.lenovo.fragmentapp.MainActivity">;</strong>

<strong> <;Button</strong>
<strong> android:id="@+id/btn_frag1"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:layout_margin="5dp"</strong>
<strong> android:background="@android:color/holo_red_light"</strong>
<strong> android:onClick="getFragment"</strong>
<strong> android:text="Fragment1" />;</strong>

<strong> <;Button</strong>
<strong> android:id="@+id/btn_frag2"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:layout_below="@+id/btn_frag1"</strong>
<strong> android:layout_margin="5dp"</strong>
<strong> android:background="@android:color/holo_green_light"</strong>
<strong> android:onClick="getFragment"</strong>
<strong> android:text="Fragment2"</strong>

<strong> />;</strong>

<strong> <;FrameLayout</strong>
<strong> android:id="@+id/fl_fragment"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="match_parent"</strong>
<strong> android:layout_below="@+id/btn_frag2">;</strong>

<strong> <;/FrameLayout>;</strong>

<strong><;/RelativeLayout>;</strong>

</pre>
<p><strong><span style="color: #0000ff;">fragment1.xml</span></strong><br />
<code></code></p>
<pre><strong><;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"</strong>
<strong> xmlns:tools="http://schemas.android.com/tools"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="match_parent"</strong>
<strong> android:gravity="center_vertical"</strong>
<strong> android:orientation="vertical"</strong>
<strong> tools:context="com.example.lenovo.fragmentapp.Fragment1">;</strong>


<strong> <;TextView</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:gravity="center"</strong>
<strong> android:text="This is Fragment1"</strong>
<strong> android:textColor="@android:color/holo_red_light"</strong>
<strong> android:textSize="25sp"</strong>
<strong> android:textStyle="bold" />;</strong>

<strong> <;TextView</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:gravity="center"</strong>
<strong> android:text="Fragment1"</strong>
<strong> android:textColor="@android:color/holo_red_light"</strong>
<strong> android:textSize="20sp"</strong>
<strong> android:textStyle="bold" />;</strong>

<strong><;/LinearLayout>;</strong>
</pre>
<p><strong><span style="color: #0000ff;">fragment2.xml</span></strong><br />
<code></code></p>
<!-- WP QUADS Content Ad Plugin v. 2.0.98.1 -->
<div class="quads-location quads-ad2" id="quads-ad2" style="float:none;margin:0px;">

</div>

<pre><strong><;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"</strong>
<strong> xmlns:tools="http://schemas.android.com/tools"</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="match_parent"</strong>
<strong> android:gravity="center_vertical"</strong>
<strong> android:orientation="vertical"</strong>
<strong> tools:context="com.example.lenovo.fragmentapp.Fragment2">;</strong>


<strong> <;TextView</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:gravity="center"</strong>
<strong> android:text="This is Fragment2"</strong>
<strong> android:textColor="@android:color/holo_green_light"</strong>
<strong> android:textSize="25sp"</strong>
<strong> android:textStyle="bold" />;</strong>

<strong> <;TextView</strong>
<strong> android:layout_width="match_parent"</strong>
<strong> android:layout_height="wrap_content"</strong>
<strong> android:gravity="center"</strong>
<strong> android:text="Fragment2"</strong>
<strong> android:textColor="@android:color/holo_green_light"</strong>
<strong> android:textSize="20sp"</strong>
<strong> android:textStyle="bold" />;</strong>

<strong><;/LinearLayout>;</strong>
</pre>
<p><span style="color: #0000ff;"><strong>Fragment1.java</strong></span><br />
<code></code></p>
<pre><strong>package com.example.lenovo.fragmentapp;</strong>

<strong>import android.os.Bundle;</strong>
<strong>import android.support.v4.app.Fragment;</strong>
<strong>import android.view.LayoutInflater;</strong>
<strong>import android.view.View;</strong>
<strong>import android.view.ViewGroup;</strong>


<strong>public class Fragment1 extends Fragment {</strong>

<strong> @Override</strong>
<strong> public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {</strong>

<strong> View view = inflater.inflate(R.layout.fragment1, container, false);</strong>

<strong> return view;</strong>
 
<strong> }</strong>
<strong>}</strong>
</pre>
<p><span style="color: #0000ff;"><strong>Fragment2.java</strong></span><br />
<code></code></p>
<pre><strong>package com.example.lenovo.fragmentapp;</strong>


<strong>import android.os.Bundle;</strong>
<strong>import android.support.v4.app.Fragment;</strong>
<strong>import android.view.LayoutInflater;</strong>
<strong>import android.view.View;</strong>
<strong>import android.view.ViewGroup;</strong>


<strong>public class Fragment2 extends Fragment {</strong>

<strong> @Override</strong>
<strong> public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {</strong>

<strong> View view = inflater.inflate(R.layout.fragment2, container, false);</strong>

<strong> return view;</strong>


<strong> }</strong>
<strong>}</strong>
</pre>
<p><span style="color: #0000ff;"><strong>MainActivity.java</strong></span><br />
<code></code></p>
<pre><strong>package com.example.lenovo.fragmentapp;</strong>


<strong>import android.support.v7.app.AppCompatActivity;</strong>
<strong>import android.os.Bundle;</strong>
<strong>import android.view.View;</strong>

<strong>public class MainActivity extends AppCompatActivity {</strong>

<strong> @Override</strong>
<strong> protected void onCreate(Bundle savedInstanceState) {</strong>
<strong> super.onCreate(savedInstanceState);</strong>
<strong> setContentView(R.layout.activity_main);</strong>

<strong> }</strong>

<strong> public void getFragment(View view) {</strong>
<strong> switch (view.getId()) {</strong>

<strong> case R.id.btn_frag1: {</strong>
<strong> Fragment1 fragment = new Fragment1();</strong>
<strong> getSupportFragmentManager().beginTransaction().replace(R.id.fl_fragment, fragment).commit();</strong>
<strong> break;</strong>
<strong> }</strong>
<strong> case R.id.btn_frag2: {</strong>
<strong> Fragment2 fragment = new Fragment2();</strong>
<strong> getSupportFragmentManager().beginTransaction().replace(R.id.fl_fragment, fragment).commit();</strong>
<strong> break;</strong>
<strong> }</strong>

<strong> }</strong>
<strong> }</strong>


<strong>}</strong>
</pre>
<p><strong><span style="color: #0000ff;">Now when you run the app it will look like this:</span></strong></p>
<p><img class="alignnone wp-image-211" src="https://c1ctech.com/wp-content/uploads/2018/03/Screenshot_2018-03-13-15-11-451-180x300.png" alt="" width="232" height="387" /> <img class="alignnone wp-image-212" src="https://c1ctech.com/wp-content/uploads/2018/03/Screenshot_2018-03-13-15-11-291-180x300.png" alt="" width="230" height="384" />

