How to Make Android Apps 10
In this few parts of my Android tutorial I’ll focus on a Android Fragment Tutorial. I’ll start off slow here by showing you how to switch fragments based on screen orientation, which is very commonly used.
I’ll specifically cover the basics of fragments, layout fragments, FragmentManager, FragmentTransaction, committing fragment replacements, LayoutInflator, Configuration and more.
If you like videos like this, it helps to share on Google Plus with a click here [googleplusone]
Code From the Video
portrait_fragment.xml
<RelativeLayout 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"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin">
<TextView
android:text="@string/portrait_mode_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="30dp"/>
</RelativeLayout>
landscape_fragment.xml
<RelativeLayout 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"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin">
<TextView
android:text="@string/landscape_mode_text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="30dp"/>
</RelativeLayout>
activity_my.xml
<RelativeLayout 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"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MyActivity">
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/landscape_fragment" />
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/portrait_fragment" />
</RelativeLayout>
FragmentLandscape.java
package com.newthinktank.derekbanas.androidfragments;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class FragmentLandscape extends Fragment{
/*
LayoutInflator takes the provided xml layout and puts it in a view
container is the view the fragment should be attached to
savedInstanceState is passed if the fragment is being re-constructed from a saved state
inflate() is passed the layout xml to place, the optional view to attach to and
true or false on whether to attach to the optional view named container
*/
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.landscape_fragment, container, false);
}
}
FragmentPortrait.java
package com.newthinktank.derekbanas.androidfragments;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class FragmentPortrait extends Fragment{
/*
LayoutInflator takes the provided xml layout and puts it in a view
container is the view the fragment should be attached to
savedInstanceState is passed if the fragment is being re-constructed from a saved state
inflate() is passed the layout xml to place, the optional view to attach to and
true or false on whether to attach to the optional view named container
*/
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.portrait_fragment, container, false);
}
}
MyActivity.java
package com.newthinktank.derekbanas.androidfragments;
import android.app.Activity;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.content.res.Configuration;
import android.os.Bundle;
/*
Fragments make it easy to create interfaces that work on different
screen sizes. They do this by breaking different parts of your
interface into fragments. Activities can then decide which fragments
to use and where to put them based on screen size or orientation.
It is also nice to use the same fragment on multiple activities.
If your app is running on a phone you should have a single fragment
normally and as the screen size increases you can add more.
Version 3.0 is required to use fragments unless you use a support
library. You cannot use the PreferenceFragment class unless you
use API 11 or higher though. You install the support library in the
SDK Manager. Look in the Extras folder. The location of the jar file
is /sdk/extras/android/support/v4/android-support-v4.jar ( Save it in
your libs folder )
*/
public class MyActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Allows you to interact with Fragments in an Activity
FragmentManager fragmentManager = getFragmentManager();
// beginTransaction() begins the FragmentTransaction which allows you to
// add, attach, detach, hide, remove, replace, animate, transition or
// show fragments
FragmentTransaction fragmentTransaction =
fragmentManager.beginTransaction();
// The Configuration object provides device configuration info
// http://developer.android.com/reference/android/content/res/Configuration.html
Configuration configInfo = getResources().getConfiguration();
// Depending on the screen orientation replace with the correct fragment
if(configInfo.orientation == Configuration.ORIENTATION_LANDSCAPE){
FragmentLandscape fragmentLandscape = new FragmentLandscape();
fragmentTransaction.replace(android.R.id.content,
fragmentLandscape);
} else {
FragmentPortrait fragmentPortrait = new FragmentPortrait();
fragmentTransaction.replace(android.R.id.content,
fragmentPortrait);
}
// Schedule for the replacement of the Fragment as soon as possible
fragmentTransaction.commit();
// setContentView(R.layout.activity_my);
}
}
Seriously love your tutorials!
😉
Thank you 🙂
Great tutorial. your explanation is simply good. easy understand the coding and its implementation
Thanks
Thank you very much 🙂
Hi derek ,thanks for the tutorial , its really detailed good and even fun 🙂 even for people who are not english native speaker like me.
A little basic question, is the procedure onCreate on myActivity is executed each time I change the orientation of my device?
I understand fragmentTransaction is responsible for replacing fragments. However,the condition to replace a fragment (=what is our orientation) is checked in onCreate procedure.
thanks!
You’re very welcome 🙂 Yes onCreate is called every time the Activity has to be re-drawn to the screen.
O love your code comments, it helps me a lot.
Thank you Derek.
I’m very happy that they help 🙂
Hi Derek!
Thanks for tutorial. It really helped me a lot . But i am not sure about one thing. Can you please tell me what is activity_my.xml for?
It is not used anywhere and i deleted it from my app and everything worked just perfect. Thank you for your answer.
Hi Daniel, You’re very welcome 🙂 activity_my.xml is normally the default xml layout for the app. I kept it there for those people that used it because it is created by default.
Hi Derek,
The support folder is not in my sdk directory structure. Am I missing a package to install from the SDK manager?