I was able to create a tab layout using the tutorial in androidhive. I was wondering if I can put a side tab on it. . When you click an Item on the left side, an activity will be displayed on the right side.
I was wondering If I can do it. Thank you very much.
Try to design your layout as below:
Here its fragment_top_rated.xml file code:
<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"
tools:context=".MainActivity" >
<LinearLayout
android:id="#+id/passenger"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="2dp"
android:orientation="horizontal"
android:weightSum="1">
<FrameLayout
android:id="#+id/frameLayout1"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".4"
android:background="#android:color/background_dark" >
</FrameLayout>
<FrameLayout
android:id="#+id/frameLayout2"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".6"
android:background="#android:color/darker_gray" >
</FrameLayout>
</LinearLayout>
</RelativeLayout>
You can load this screen on tabs click with the fragments into it.
EDITED:
Supposing that you have developed your project exactly same as the defined demo of you question link.
In your Tabactivity as you select places tab load the Fragment of places in the left side.
It defined in link on tab selected you just have to load fragments.
PlacesFragment
In your PlacesFragment write code as below:
public class PlacesFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_top_rated,
container, false);
FragmentManager fm = getFragmentManager();
FragmentTransaction ft1 = fm.beginTransaction();
Fragment m_fragSet = new GamesFragment();
ft1.replace(R.id.frameLayout2, m_fragSet);
ft1.commit();
FragmentManager fmg = getFragmentManager();
FragmentTransaction ftrans = fmg.beginTransaction();
Fragment m_frag = new MoviesFragment();
ftrans.replace(R.id.frameLayout1, m_frag);
ftrans.commit();
return rootView;
}
}
Create right side fragment Games
public class GamesFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_games, container, false);
return rootView;
}
}
Here is MoviesFragment.java
public class MoviesFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_movies, container, false);
return rootView;
}
}
In your TabsAdapter define as below:
public class TabsPagerAdapter extends FragmentPagerAdapter {
FragmentActivity context;
public TabsPagerAdapter(FragmentManager fm,FragmentActivity act) {
super(fm);
context=act;
}
#Override
public Fragment getItem(int index) {
switch (index) {
case 0:
// Top Rated fragment activity
return new TopRatedFragment();
case 1:
// Games fragment activity
return new GamesFragment();
case 2:
// Movies fragment activity
return new MoviesFragment();
}
return null;
}
#Override
public int getCount() {
// get item count - equal to number of tabs
return 3;
}
}
Here is the Output
Related
I'm now following a viewpager guide in
http://developer.android.com/training/implementing-navigation/lateral.html
And I met a serious problem.
As I wrote in title, I tried to put the Google map v2 in each fragment of viewpager and I met this error. (Two ScreenSlidePageFragment gets generated at once and it inflates map for each them.)
Caused by: java.lang.IllegalArgumentException: Binary XML file line #8: Duplicate id 0x7f0a0059, tag null, or parent id 0xffffffff with another fragment for com.google.android.gms.maps.MapFragment
at android.app.Activity.onCreateView(Activity.java:4835)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:689)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:755)
at android.view.LayoutInflater.inflate(LayoutInflater.java:492)
at android.view.LayoutInflater.inflate(LayoutInflater.java:397)
at com.maurat.trackuz.ScreenSlidePageFragment.onCreateView(ScreenSlidePageFragment.java:39)
I think because this viewpager loads 2 pages at once at the first time and the map fragment's id gets duplicated.
ScreenSlidePagerAdapter
private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {
public ScreenSlidePagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
Log.d(TAG, "getItem " + position);
return new ScreenSlidePageFragment();
}
#Override
public int getCount() {
return NUM_PAGES;
}
}
ScreenSlidePageFragment
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstance) {
Log.d(TAG, "onCreateView");
ViewGroup view = (ViewGroup) inflater.inflate(
R.layout.fragment_screen_slide_page,
container,
false);
return view;
}
fragment_screen_slide_page.xml
<?xml version="1.0" encoding="utf-8"?>
<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:background="#C7F464">
<fragment
android:name="com.google.android.gms.maps.MapFragment"
android:id="#+id/map_container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
So I've found and tried several solution but didn't found the solution for now.
https://stackoverflow.com/a/14929151/1122517
https://stackoverflow.com/a/14695397/1122517
Now I'm finding a solution such like making a fragment programmatically.
Please help me.
Ok, I found a solution and it's maybe workaround but work perfectly.
What I wanted to make is a viewpager having map fragment.
First of all I made a basic of viewpager reference to below site
Using ViewPager for Screen Slides
and make a fragment class which to be a parent of 2 nested fragments
A fragment class for 2 nested fragments
public class TPageParentFragment extends Fragment {
private int position = -1;
/* Constructor */
public TPageParentFragment(int position) {
this.position = position;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
ViewGroup rootView = (ViewGroup) inflater.inflate(
R.layout.fragment_screen_slide_page, container, false);
return rootView;
}
#Override
public void onResume() {
Log.d(TAG, "onResume : " + this.position);
super.onResume();
// Here I add 2 nested fragments
FragmentManager mFragmentManager = getChildFragmentManager();
FragmentTransaction fragmentTransaction = mFragmentManager.beginTransaction();
Fragment mapFragment = new TMapFragment();
Fragment mapInfoFragment = new TMapInfoFragment();
fragmentTransaction.add(R.id.fragContainer1, mapFragment);
fragmentTransaction.add(R.id.fragContainer2, mapInfoFragment).commit();
}
}
And the xml of this parent fragment is
fragment_screen_slide_page.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/fragContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#C7F464">
<FrameLayout
android:id="#+id/fragContainer1"
android:layout_width="fill_parent"
android:layout_height="300dp"/>
<FrameLayout
android:id="#+id/fragContainer2"
android:layout_below="#+id/fragContainer1"
android:layout_width="fill_parent"
android:layout_height="500dp"/>
</RelativeLayout>
All of these FrameLayout will be changed with 2 nested fragments.
And 2 nested fragments are
TMapFragment
import com.google.android.gms.maps.SupportMapFragment;
public class TMapFragment extends SupportMapFragment {
public TMapFragment(){}
#Override
public View onCreateView(LayoutInflater arg0, ViewGroup arg1, Bundle arg2) {
Log.d(TAG, "onCreateView");
View v = super.onCreateView(arg0, arg1, arg2);
initMap();
return v;
}
private void initMap() {
Log.d(TAG, "initMap");
}
}
and
TMapInfoFragment
public class TMapInfoFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
Log.d(TAG, "onCreateView");
ViewGroup rootView = (ViewGroup) inflater.inflate(
R.layout.fragment_mapinfofragment, container, false);
return rootView;
}
}
Surely you need to add a xml for fragment_mapinfofragment
I have a problem with the layout I created. I used the Navigation Drawer as a main navigation pattern. It looks and works as I wanted, but the problem is that after returning to the fragment which holds ViewPager - the inner-fragments are not shown. However, they are shown when the application is first opened and shows the ViewPager-holding Fragment by default.
Other navigation drawer Fragments are displayed ok, so I don't expect that there is any problem with my Navigation Drawer implementation
RecordFragment.java (fragment holding ViewPager Fragments):
public class RecordFragment extends Fragment {
private ViewPager mViewPager;
public RecordFragment() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.record_fragment, container, false);
//getActivity().setTitle(R.string.record);
return rootView;
}
#Override
public void onViewCreated(View view, Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
mViewPager = (ViewPager) view.findViewById(R.id.record_pager);
FragmentManager manager = getFragmentManager();
mViewPager.setAdapter(new MyFragmentPagerAdapter(manager));
}
class MyFragmentPagerAdapter extends FragmentPagerAdapter {
public MyFragmentPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int item) {
Fragment fragment = null;
if (item == 0) {
fragment = new NumbersFragment();
} else if (item == 1) {
fragment = new MapFragment();
}
return fragment;
}
#Override
public int getCount() {
return 2;
}
#Override
public CharSequence getPageTitle(int position) {
String title = new String();
if (position == 0) {
title = "Numbers";
} else if (position == 1) {
title = "Map";
}
return title;
}
}
}
NumbersFragment.java (one of the Fragments holded by RecordFragment)
public class NumbersFragment extends Fragment {
public NumbersFragment() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.numbers_fragment, container, false);
//getActivity().setTitle(R.string.record);
return rootView;
}
}
record_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/record_pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.PagerTabStrip
android:id="#+id/pager_title_strip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:textColor="#fff"
android:paddingTop="4dp"
android:paddingBottom="4dp" />
</android.support.v4.view.ViewPager>
</LinearLayout>
You use Fragments inside another Fragment, in this case you need to use the Fragment#getChildFragmentManager() method:
FragmentManager manager = getChildFragmentManager();
If it doesn't work you can try to switch to FragmentStatePagerAdapter instead of FragmentPagerAdapter (but you still need to use child fragment manager).
As the ViewPager required Fragments and ViewPager itself on Fragment, we have to use getChildFragmentManager() instead of getSupportFragmentManager().
hello Friends i am little new to this Fragments concept!
Problem is
I am having a Actionbar with tabs and fragments now I want to implement viewpager inside one of the fragment of Actionbar tabs.
the point is to implement View pager with tabstrip inside a fragment
Please help me!
I hope that will be useful at least for anyone with the same problem if not for you.
You can put this fragment in every tab from action bar. The code is:
public class TabFragment extends Fragment {
ViewPager mViewPager;
DemoCollectionPagerAdapter mPagerAdapter;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_tab, container, false);
mPagerAdapter = new DemoCollectionPagerAdapter(getChildFragmentManager());
// Set up the ViewPager, attaching the adapter.
mViewPager = (ViewPager) view.findViewById(R.id.view_pager);
mViewPager.setAdapter(mPagerAdapter);
return view;
}
}
I took PagerAdapter from the Effective Navigation example and just removed the "static" attribute in order to move it in the separate file:
public class DemoCollectionPagerAdapter extends FragmentStatePagerAdapter {
public DemoCollectionPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int i) {
Fragment fragment = new DemoObjectFragment();
Bundle args = new Bundle();
args.putInt(DemoObjectFragment.ARG_OBJECT, i + 1); // Our object is just an integer :-P
fragment.setArguments(args);
return fragment;
}
#Override
public int getCount() {
// For this contrived example, we have a 100-object collection.
return 5;
}
#Override
public CharSequence getPageTitle(int position) {
return "OBJECT " + (position + 1);
}
/**
* A dummy fragment representing a section of the app, but that simply displays dummy text.
*/
public static class DemoObjectFragment extends Fragment {
public static final String ARG_OBJECT = "object";
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_collection_object, container, false);
Bundle args = getArguments();
((TextView) rootView.findViewById(android.R.id.text1)).setText(
Integer.toString(args.getInt(ARG_OBJECT)));
return rootView;
}
}
}
And the fragment_tab.xml for this TabFragment is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.PagerTabStrip android:id="#+id/pager_tab_strip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:textColor="#fff"
android:paddingTop="4dp"
android:paddingBottom="4dp" />
</android.support.v4.view.ViewPager>
Consider using a PagerTabStrip as a child view of ViewPager if you want the tab headers to be clickable and a PagerTitleStrip for them to be static (user can only swipe in order to switch to the tab).
Depending on your implementation of ActionBar with tabs I suppose there can arise some dependency problems because in this example I've used support library.
i want add a fragment inside another one dynamically .
the outer fragment is a DialogFragment :
public class MapFragmentDialog extends DialogFragment implements OnMapClickListener, OnMapLongClickListener,
OnMarkerDragListener {
FragmentManager fmanager;
Fragment fragment;
SupportMapFragment supportmapfragment;
public static MapFragmentDialog newInstance() {
MapFragmentDialog f = new MapFragmentDialog();
return f;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
super.onCreateView(inflater, container, savedInstanceState);
View v = inflater.inflate(R.layout.map_fragment, container, false);
// *********** add myMapFragment
FragmentManager fragmentManager = getActivity().getSupportFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
// add a fragment
MyMapFragment myFragment = new MyMapFragment();
fragmentTransaction.add(R.id.myfragment, myFragment);
fragmentTransaction.commit();
myMap = ((SupportMapFragment)getActivity().getSupportFragmentManager().findFragmentById(R.id.myMap)).getMap();
return v;
}
the map_fragment layout is like this :
<TextView
android:id="#+id/txtHelp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:paddingBottom="6dip"
android:textAlignment="center"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="12sp" />
<FrameLayout
android:id="#+id/myfragment"
android:layout_width="0px"
android:layout_height="wrap_content" />
my inner fragment MyMapFragment :
public class MyMapFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View myFragmentView = inflater.inflate(R.layout.my_map_fragment, container, false);
return myFragmentView;
}}
the my_map_fragment layout contain :
<fragment
android:id="#+id/myMap"
android:layout_width="match_parent"
android:layout_height="300dp"
class="com.google.android.gms.maps.SupportMapFragment" />
i get an exception on getting the map fragment on my DialogFragment , a NullPointerException at this line
myMap = ((SupportMapFragment)getActivity().getSupportFragmentManager().findFragmentById(R.id.myMap)).getMap();
I remember seeing something about fragments in fragments working only dynamically and not by placing them XML. I think Abd El-Rahman El-Tama has the correct idea of using a frameLayout nstead of specifying a fragment directly
To change the Fragments dynamically all what you need is
1) A FrameLayout in your Layout as following:
<FrameLayout
android:id="#+id/fragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
2) Initialize the FrameLayout into your activity as following:-
FrameLayout fragment = (FrameLayout) findViewById(R.id.fragment);
3) Start Fragment transaction as following:
getSupportFragmentManager().beginTransaction().replace(R.id.fragment, new MyFragment()).commit();
Or
FragmentManager fragMan = new FragmentManager();
fragMan.beginTransaction ();
fragMan.replace (R.id.fragment);
fragMan.commit ();
I have a ViewPager with 3 Fragments, each fragment has its own unique layout. Each Fragment knows which layout to use by getting layout id as parameter in newInstance() method from FragmentActivity that holds ViewPager. This ViewPager is controlled by FragmentStatePagerAdapter called MyPagerAdapter.
public class MainActivity extends FragmentActivity {
ViewPager pager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pager = (ViewPager) findViewById(R.id.viewPager);
pager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
}
private class MyPagerAdapter extends FragmentStatePagerAdapter {
SparseArray<Fragment> registeredFragments = new SparseArray<Fragment>();
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int pos) {
switch(pos) {
case 0: return FirstFragment.newInstance("FirstFragment, Instance 1");
case 1: return SecondFragment.newInstance("SecondFragment, Instance 1");
case 2: return ThirdFragment.newInstance("ThirdFragment, Instance 1");
}
}
#Override
public int getCount() {
return 3;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
Fragment fragment = (Fragment) super.instantiateItem(container, position);
registeredFragments.put(position, fragment);
return fragment;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
registeredFragments.remove(position);
super.destroyItem(container, position, object);
}
public Fragment getRegisteredFragment(int position) {
return registeredFragments.get(position);
}
}
public void setBackgroundImage(View view){
int i = pager.getCurrentItem();
Fragment page = ((MyPagerAdapter)pager.getAdapter()).getRegisteredFragment(i);
page.getView().findViewById(R.id.first).findViewById(R.id.button1);
page.getView().findViewById(R.id.first).setBackgroundResource(R.drawable.ic_launcher);
}
}
activity_main.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"
tools:context=".MainActivity" >
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</RelativeLayout>
Here is the FirstFragment:
public class FirstFragment extends Fragment{
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.first_frag, container, false);
TextView tv = (TextView) v.findViewById(R.id.tvFragFirst);
tv.setText(getArguments().getString("msg"));
return v;
}
public static FirstFragment newInstance(String text) {
FirstFragment f = new FirstFragment();
Bundle b = new Bundle();
b.putString("msg", text);
f.setArguments(b);
return f;
}}
first_frag.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_orange_dark"
android:id="#+id/first" >
<TextView
android:id="#+id/tvFragFirst"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textSize="26dp"
android:text="TextView" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/tvFragFirst"
android:text="Button"
android:onClick="setBackgroundImage"/>
</RelativeLayout>
It has more buttons and imagebuttons with onClick methods, but it's not necessary to the question, except that it's important to know that I have many onClick methods similar to setBackgroundImage that change appearance of layout.
the SecondFragment and ThirdFragment is similar, as their layouts.
As you can see the method setBackgroundImage in MainActivity, it changes background image of the fragment. But once its changed, it's not permanent, because as I flip through fragments and return to this first fragment the change isn't saved, but the original layout is shown. I understand that once out of vision, fragment's layout gets destroyed. Is there a way to retain layout changes?
Have you tried calling onRetainInstance(true) in the Fragments onCreate() method?
Certainly, one way to solve the problem would be to store in the Activity, the background resources for each fragment such that when the fragments are created, they are initialized correctly. This would also involve storing the background data in a bundle in the onSaveInstanceState() method.