Working with ViewPager and Fragments - android

I am a beginner Android developer. I am trying to get my head around the ViewPager. Before I was trying to work with this example:
http://mobile.tutsplus.com/tutorials/android/android-user-interface-design-horizontal-view-paging/
I had the views working, but could not get functionality working within that, and I was told that I need to use Fragments within the ViewPager.
I went with this tutorial instead:
http://tamsler.blogspot.co.uk/2011/11/android-viewpager-and-fragments-part-ii.html
I have got the basics of a ViewPager with a Fragment working:
FragmentPagerActivity.java
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
public class FragmentPagerActivity extends FragmentActivity {
private static final int NUMBER_OF_PAGES = 10;
private ViewPager mViewPager;
private MyFragmentPagerAdapter mMyFragmentPagerAdapter;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mViewPager = (ViewPager) findViewById(R.id.viewpager);
mMyFragmentPagerAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager());
mViewPager.setAdapter(mMyFragmentPagerAdapter);
}
private static class MyFragmentPagerAdapter extends FragmentPagerAdapter {
public MyFragmentPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int index) {
return PageFragment.newInstance("My Message " + index);
}
#Override
public int getCount() {
return NUMBER_OF_PAGES;
}
}
}
PageFragment.java:
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
public class PageFragment extends Fragment {
public static PageFragment newInstance(String title) {
PageFragment pageFragment = new PageFragment();
Bundle bundle = new Bundle();
bundle.putString("title", title);
pageFragment.setArguments(bundle);
return pageFragment;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment, container, false);
TextView textView = (TextView) view.findViewById(R.id.textView1);
textView.setText(getArguments().getString("title"));
return view;
}
}
main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<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/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
I want to be able to replace the current layout within the ViewPager with 7 of my own layouts that already exist and add functionality to the layouts using Fragments. What can I do with the code that I already have and the changes to make to get this properly working?
If there are any examples of a ViewPager with Fragments available online as well rather than just going briefly over it like the do in the Adroid Developers blog, I will be very grateful.

Declare this inside your MyFragmentPagerAdapter:
private Fragment[] fragments = new Fragment[] { new Fragment1(),Fragment2(),Fragment3(),Fragment4(),Fragment5()};
then implement getItem method like this:
#Override
public Fragment getItem(int index) {
return fragments[index];
}
and for each fragment have it is own class and layout:
public class Fragment1 extends Fragment {
//your code here
}

Assuming you know how to create fragments themselves, just do something like this to get them into your view pager:
#Override
public Fragment getItem(int page) {
switch (page) {
case 0: return new MyFirstFragment();
case 1: return new MySecondFragment();
case 2: return new MyThirdFragment();
//and so on....
}
return null;
}
#Override
public int getCount() {
return [the count of total fragments];
}
instead of this:
#Override
public Fragment getItem(int index) {
return PageFragment.newInstance("My Message " + index);
}

I modified the answer from hambonious a bit:
Declare this inside your MyFragmentPagerAdapter :
private SparseArray<Fragment> fragments = new SparseArray<Fragment>();
then implement getItem method like this:
#Override
public Fragment getItem(int index) {
if(fragments != null && fragments.size() >= index)
return fragments.get(i);
else return null;
}
You also have to override getSize()
#Override
public int getCount() {
return fragments.size();
}
Then you can dynamic add and remove fragments from it.

Related

Can't set adapter of ListView because the ListView has a null object reference

I am trying to make a TabLayout with a ViewPager, but whenever I leave the app (Don't close it, just switch to another app and back) the fragments kind of get killed. I don't know that for sure, but the fragment's need to reCreate, and then fail.
The code for creating the TabLayout, TabLayoutAdapter and the ViewPager:
TabLayout tabLayout = (TabLayout) findViewById(R.id.tablayout);
MyTabLayoutAdapter tabLayoutAdapter;
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
tabLayout.addTab(tabLayout.newTab().setText("-2"));
tabLayout.addTab(tabLayout.newTab().setText("-1"));
tabLayout.addTab(tabLayout.newTab().setText("0"));
tabLayout.addTab(tabLayout.newTab().setText("1"));
tabLayout.addTab(tabLayout.newTab().setText("2"));
tabLayoutAdapter = new MyTabLayoutAdapter(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(tabLayoutAdapter);
viewPager.setOffscreenPageLimit(3);
tabLayout.setupWithViewPager(viewPager);
viewPager.setCurrentItem(2);
The code of my TabLayoutAdapter:
public class MyTabLayoutAdapter extends FragmentStatePagerAdapter {
private MyFragment fragmentOne;
private MyFragment fragmentTwo;
private MyFragment fragmentDefault;
private MyFragment fragmentFour;
private MyFragment fragmentFive;
private int numberOfTabs;
public MyTabLayoutAdapter(FragmentManager fragmentManager, int numberOfTabs) {
super(fragmentManager);
fragmentOne = new MyFragment();
fragmentTwo = new MyFragment();
fragmentDefault = new MyFragment();
fragmentFour = new MyFragment();
fragmentFive = new MyFragment();
this.numberOfTabs = numberOfTabs;
}
#Override
public MyFragment getItem(int position) {
switch (position) {
case 0:
return fragmentOne;
case 1:
return fragmentTwo;
case 2:
return fragmentDefault;
case 3:
return fragmentFour;
case 4:
return fragmentFive;
default:
return fragmentDefault;
}
}
#Override
public int getCount() {
return numberOfTabs;
}
}
The MyFragment fragment:
public class MyFragment extends Fragment {
private View currentView;
private ListView listView;
public MyFragment() {}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
currentView = LayoutInflater.from(getContext()).inflate(R.layout.my_fragment_layout, container, false);
listView = (ListView) currentView.findViewById(R.id.listview);
return currentView;
}
//This line throws a NullPointer when I resume the app
public void populateListView(MyListAdapter myListAdapter) {
listView.setAdapter(myListAdapter);
}
}
Whenever I call
MyListAdapter myListAdapter = new MyListAdapter(this, R.layout.my_item, justSomeStringArray);
tabLayoutAdapter.getItem(0).populateListView(myListAdapter);
I get a NullPointerException saying that it can't set a adapter on a null object reference.
Anyone any idea how I can fix this?
Here's an approach which lets the Fragment instance drive the data retrieval by using an AsyncTask implementation (GetDataForListViewTask).
But, to follow Commonsware's advice, GetDataForListViewTask merely obtains the data. It does not set up the adapter for use on the ListViews. Instead, setting up the ListAdapter is done in the Fragment itself.
GetDataForListViewTask passes the data back to the Fragment instance using EventBus. This keeps GetDataForListViewTask from having to maintain a reference to the ListView, Activity, Context or any of that risky stuff.
And, by not "reaching in" to a Fragment from the outside to change its widgets or even hand it data, this code also tries (very broadly) to follow another piece of CommonsWare's guidance:
In general, having code outside of a fragment attempt to manipulate
the widgets inside that fragment — as you are doing here — is a bad
idea.
In any case, if you use this approach, which is a bit different from your original approach, you'll want to modify the GetDataForListViewTask so that it obtains the data from elsewhere in your app or the network, etc.
GetDataForListViewTask.java
import android.os.AsyncTask;
import org.greenrobot.eventbus.EventBus;
import java.util.ArrayList;
class GetDataForListViewTask extends AsyncTask<Void, Void, ArrayList<String>> {
#Override
protected ArrayList<String> doInBackground(Void... ignored) {
// since this method runs on a worker thread, you may
// replace this code with a network call or a background computation
// from another part of the app is ready
ArrayList<String> listItems = new ArrayList<>();
for (int i=0; i<10; i++) {
listItems.add("item " + i);
}
return listItems;
}
#Override
protected void onPostExecute(ArrayList<String> result) {
super.onPostExecute(result);
// post event so that Fragment can use the data to populate its ListView
EventBus.getDefault().post(new MyFragment.ListViewDataReadyEvent(result));
}
}
MainActivity.java
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tablayout);
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
MyAdapter tabLayoutAdapter = new MyAdapter(getSupportFragmentManager(), 5);
viewPager.setAdapter(tabLayoutAdapter);
viewPager.setOffscreenPageLimit(3);
tabLayout.setupWithViewPager(viewPager);
viewPager.setCurrentItem(2);
}
class MyAdapter extends FragmentStatePagerAdapter {
private final int count;
public MyAdapter(FragmentManager fm, int count) {
super(fm);
this.count = count;
}
#Override
public MyFragment getItem(int position) {
return MyFragment.newInstance();
}
#Override
public int getCount() {
return this.count;
}
#Override
public CharSequence getPageTitle(int position) {
return "Tab " + position;
}
}
}
MyFragment.java
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import org.greenrobot.eventbus.EventBus;
import org.greenrobot.eventbus.Subscribe;
import org.greenrobot.eventbus.ThreadMode;
import java.util.ArrayList;
public class MyFragment extends Fragment {
private ListView listView;
private GetDataForListViewTask getDataForListViewTask;
public static MyFragment newInstance() {
return new MyFragment();
}
#Override
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setRetainInstance(true); // to support use of GetDataForListViewTask
EventBus.getDefault().register(this);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
listView = (ListView) LayoutInflater.from(getContext()).inflate(
R.layout.my_fragment_layout, container, false);
getDataForListViewTask = new GetDataForListViewTask();
getDataForListViewTask.execute();
return listView;
}
#Override
public void onDestroy() {
if (getDataForListViewTask != null) {
getDataForListViewTask.cancel(false);
}
EventBus.getDefault().unregister(this);
super.onDestroy();
}
static class ListViewDataReadyEvent {
ArrayList<String> data;
ListViewDataReadyEvent(ArrayList<String> data) {
this.data = data;
}
}
#SuppressWarnings("unused")
#Subscribe(threadMode = ThreadMode.MAIN)
public void onMessageEvent(ListViewDataReadyEvent event) {
if (listView != null) {
ArrayAdapter<String> listAdapter = new ArrayAdapter<>(listView.getContext(),
android.R.layout.simple_list_item_1, event.data.toArray(new String[]{}));
listView.setAdapter(listAdapter);
}
}
}
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" android:padding="4dip"
android:gravity="center_horizontal"
android:layout_width="match_parent" android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill" />
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</LinearLayout>
my_fragment_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<ListView android:id="#+id/listview"
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
</ListView>
Selected compile statements for build.gradle
compile 'org.greenrobot:eventbus:3.0.0'
compile 'com.android.support:design:25.3.1'
compile 'com.android.support:appcompat-v7:25.3.1'
onCreateView() is not called on a fragment until the fragment is being added to a FragmentManager. Your final code snippet will only work, at best, if it is called sometime after fragmentOne is added to a FragmentManager. Otherwise, the fragment's ListView will not exist yet.
In general, having code outside of a fragment attempt to manipulate the widgets inside that fragment — as you are doing here — is a bad idea.

TabLayout or horizontal scrollview Android

Image for the TabLayout that I wanted to achieve.
Can somebody shows me the way to achieve this?
My code:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable"
app:tabGravity="center"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#android:color/white" />
</LinearLayout>
I already set the attributes app:tabMode="scrollable" and app:tabGravity="center" but all the tabs just stick to the left in the layout.
I wanna achieve the result like the above image no matter how many the tabs are. Means the position of the tabs will away at the center or the tablayout.
PageFragment.java:
package com.example.testing;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
// In this case, the fragment displays simple text based on the page
public class PageFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";
private int mPage;
public static PageFragment newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE, page);
PageFragment fragment = new PageFragment();
fragment.setArguments(args);
return fragment;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage = getArguments().getInt(ARG_PAGE);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_page, container, false);
TextView textView = (TextView) view;
textView.setText("Fragment #" + mPage);
return view;
}
}
SampleFragmentPagerAdapter.java:
package com.example.testing;
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 3;
private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" };
private Context context;
public SampleFragmentPagerAdapter(FragmentManager fm, Context context) {
super(fm);
this.context = context;
}
#Override
public int getCount() {
return PAGE_COUNT;
}
#Override
public Fragment getItem(int position) {
return PageFragment.newInstance(position + 1);
}
#Override
public CharSequence getPageTitle(int position) {
// Generate title based on item position
return tabTitles[position];
}
}
TabActivity.java:
package com.example.testing;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class TabAcitivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab_layout);
// Get the ViewPager and set it's PagerAdapter so that it can display items
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(new SampleFragmentPagerAdapter(getSupportFragmentManager(),TabAcitivity.this));
// Give the TabLayout the ViewPager
TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
tabLayout.setupWithViewPager(viewPager);
}
}
The tabs start from the left. How do I place it to make it start at the middle? Or is it better to use a horizontal scrollable ListView?
use this for scrolling tabs:
sliding_tabs.setTabMode(TabLayout.MODE_SCROLLABLE);
For any other reference please have a look at the following url.
https://guides.codepath.com/android/google-play-style-tabs-using-tablayout

My ViewPager is empty

I've created an about activity in my Android application, with a ViewPager. But I can't see any content
My AboutActivity.java:
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v13.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.loloof64.android.chess_positions_archiver.R;
/**
* The about activity
*/
public class AboutActivity extends Activity {
static final int NUM_ITEMS = 2;
AboutDialogFragmentPagerAdapter pagerAdapter;
ViewPager viewPager;
static String pagesContents [] = new String[NUM_ITEMS];
public void exit(View view){
finish();
}
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.about_dialog_layout);
pagesContents[0] = getString(R.string.this_app_manual);
pagesContents[1] = getString(R.string.about_resources_content);
pagerAdapter = new AboutDialogFragmentPagerAdapter(getFragmentManager(),
new String[]{
"Chess Positions Archiver",
getString(R.string.about_resources_title)
});
viewPager = (ViewPager) findViewById(R.id.about_dialog_pager);
viewPager.setAdapter(pagerAdapter);
viewPager.setCurrentItem(0);
}
public static class AboutDialogFragmentPagerAdapter extends FragmentStatePagerAdapter {
private String [] titles;
public AboutDialogFragmentPagerAdapter(FragmentManager fragmentManager, String [] titles){
super(fragmentManager);
this.titles = titles;
}
#Override
public Fragment getItem(int position) {
return AboutDialogSingleFragment.newInstance(position);
}
#Override
public int getCount() {
return NUM_ITEMS;
}
#Override
public CharSequence getPageTitle(int position) {
return titles[position];
}
}
public static class AboutDialogSingleFragment extends Fragment {
static String PAGE_TEXT_KEY = "PageTextKey";
private String pageText;
static AboutDialogSingleFragment newInstance(int position){
AboutDialogSingleFragment fragment = new AboutDialogSingleFragment();
Bundle arguments = new Bundle();
arguments.putString(PAGE_TEXT_KEY, pagesContents[position]);
fragment.setArguments(arguments);
return fragment;
}
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.about_dialog_single_page_layout, container, false);
TextView pageTextView = (TextView) view.findViewById(R.id.about_dialog_page_textview);
pageTextView.setText(pageText);
container.addView(view);
return view;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
pageText = getArguments() != null ? getArguments().getString(PAGE_TEXT_KEY) : getResources().getString(R.string.about_dialog_content_error);
}
}
}
My about_dialog_layout.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/about_dialog_tabs"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/about_dialog_pager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1">
</android.support.v4.view.ViewPager>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="#string/quit_about"
android:onClick="exit" />
</RelativeLayout>
My about_dialog_single_page_layout.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">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/about_dialog_page_textview"/>
</LinearLayout>
I am using the support library 13.
So, what is my programming error ?
android:layout_weight="1" works only with LinearLayout (it is a property of LinearLayout). Since the ViewPager's parent is a RelativeLayout the property is ignored, and your ViewPager has height 0, which explain why you are not see anything

Viewpager cannot change imageView background programmatically

I am trying to initialize a ViewPager. I've failed to set image of programmatically to the viewpager. This is what I've come up with:
TutorialActivity.class
package app.trial.com;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
public class TutorialActivity extends FragmentActivity {
/**
* The number of pages (wizard steps) to show in this demo.
*/
private static final int NUM_PAGES = 3;
/**
* The pager widget, which handles animation and allows swiping horizontally to access previous
* and next wizard steps.
*/
private ViewPager mPager;
/**
* The pager adapter, which provides the pages to the view pager widget.
*/
private PagerAdapter mPagerAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tutorial);
// Instantiate a ViewPager and a PagerAdapter.
mPager = (ViewPager) findViewById(R.id.pager);
mPagerAdapter = new ScreenSlidePagerAdapter(getSupportFragmentManager());
mPager.setAdapter(mPagerAdapter);
}
#Override
public void onBackPressed() {
if (mPager.getCurrentItem() == 0) {
// If the user is currently looking at the first step, allow the system to handle the
// Back button. This calls finish() on this activity and pops the back stack.
super.onBackPressed();
} else {
// Otherwise, select the previous step.
mPager.setCurrentItem(mPager.getCurrentItem() - 1);
}
}
/**
* A simple pager adapter that represents 5 ScreenSlidePageFragment objects, in
* sequence.
*/
private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {
public ScreenSlidePagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
return TutorialFragment.create(position);
}
#Override
public int getCount() {
return NUM_PAGES;
}
}
}
TutorialFragment.class
package app.trial.com;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
public class TutorialFragment extends Fragment {
public static final String ARG_PAGE = "page";
private int mPageNumber;
public static TutorialFragment create(int pageNumber) {
TutorialFragment fragment = new TutorialFragment();
Bundle args = new Bundle();
args.putInt(ARG_PAGE, pageNumber);
fragment.setArguments(args);
return fragment;
}
public TutorialFragment() {}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments() != null) {
mPageNumber = getArguments().getInt(ARG_PAGE);
}
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
ViewGroup rootView = (ViewGroup) inflater.inflate(R.layout.fragment_tutorial, container, false);
switch(mPageNumber) {
case 1:
((ImageView) rootView.findViewById(R.id.tutorialImage)).setImageResource(R.drawable.tutorial_03);
break;
case 2:
((ImageView) rootView.findViewById(R.id.tutorialImage)).setImageResource(R.drawable.tutorial_02);
break;
case 3:
((ImageView) rootView.findViewById(R.id.tutorialImage)).setImageResource(R.drawable.tutorial_03);
break;
default:
break;
}
return rootView;
}
/**
* Returns the page number represented by this fragment object.
*/
public int getPageNumber() {
return mPageNumber;
}
}
When I try to change R.id.tutorialImage using rootView.findViewById(R.id.tutorialImage).setImageResource() it doesn't change the background image. Also, it doesn't return null.
By the way my fragmentTutorial layout is:
<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="app.trial.com.TutorialFragment">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tutorialImage" />
</ScrollView>
</FrameLayout>

View Pager with huge number of fragment

I have to change the views on swipe. This can be obtained through view pager. But I have 60 views and creating 60 different fragment will not be a good approach.
Please someone guide me what will be the best way to design swiping 60 views.
Firstly create one fragment where you can inflate different views using "position" parameter as follow..
public class SuperAwesomeCardFragment extends Fragment {
private static final String ARG_POSITION = "position";
private int position;
View mainView;
public static SuperAwesomeCardFragment newInstance(int position) {
SuperAwesomeCardFragment f = new SuperAwesomeCardFragment();
Bundle b = new Bundle();
b.putInt(ARG_POSITION, position);
f.setArguments(b);
return f;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
position = getArguments().getInt(ARG_POSITION);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
if(position==1){
mainview = inflater.inflate(R.layout.layout1, null);
}else if(position==2){
mainview =inflater.inflate(R.layout.layout2, null);
.
.
.
.
}else if(position==50){
mainview =inflater.inflate(R.layout.layout50, null);
}
return mainView;
}
}
Now in Your MainActivity Create an Adapter that extends FragmentPagerAdpater and in getItem() method create the instances of previously create fragment as follow
public class MyPagerAdapter extends FragmentPagerAdapter {
private final String[] TITLES = { "Title1", "Title2"...., "Title50"};
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public CharSequence getPageTitle(int position) {
return TITLES[position];
}
#Override
public int getCount() {
return TITLES.length;
}
#Override
public Fragment getItem(int position) {
return SuperAwesomeCardFragment.newInstance(position);
}
}
}
Then finally add this in your Activity's OnCreat() method...
MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager());
yourViewPager.setAdapter(adapter);
Thus you will have to create single fragment and use it for multiple views.
Thank you. Hope it helps..!!
You can safely use the ViewPager with an implementation of FragmentStatePagerAdapter. The adapter will optimize the memory usage by destroying fragments that are not visible at a given moment. Check the documentation for details and code sample.
Below is the complete code to add Fragments to a View pager.
Since this is just a demonstration I have used just a textView and each fragment added will have a random colour.On clicking a button you can add as many fragments as you want.On clicking the Page you can just remove it from the View Pager.You can move from one Page to another in a View Pager by Swiping to the right or left.
MainActivity.java
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.widget.Button;
import java.util.ArrayList;
import java.util.Random;
public class MainActivity extends FragmentActivity {
private MyPagerAdapter mpg;
private ArrayList<MyFragment> fragmentlist = new ArrayList<>();
public FragmentManager fmr = getSupportFragmentManager();
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ViewPager pager = (ViewPager) findViewById(R.id.viewPager);
mpg = new MyPagerAdapter(fmr,fragmentlist);
pager.setAdapter(mpg);
for (int q = 0; q < 5; q++) {
int r = new Random().nextInt(100) + 155;
int g = new Random().nextInt(100) + 155;
int b = new Random().nextInt(100) + 155;
fragmentlist.add(MyFragment.newInstance(q, "Page number: " + (q + 1), Color.rgb(r, g, b)));
mpg.notifyDataSetChanged();
}
Button B1 = (Button) findViewById(R.id.button);
B1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
int r = new Random().nextInt(100) + 155;
int g = new Random().nextInt(100) + 155;
int b = new Random().nextInt(100) + 155;
int count = mpg.getCount();
fragmentlist.add(MyFragment.newInstance(count, "Page number: " + (count+1), Color.rgb(r, g, b)));
mpg.notifyDataSetChanged();
}
});
}
public void delete(int pos) {
int i = 0;
while (i <= fragmentlist.size()) {
if (pos == fragmentlist.get(i).getPosition()) break;
i++;
}
fragmentlist.remove(i);
mpg.notifyDataSetChanged();
}
public class MyPagerAdapter extends FragmentStatePagerAdapter {
private ArrayList<MyFragment> fragmentList;
public MyPagerAdapter(FragmentManager fm, ArrayList<MyFragment> f) {
super(fm);
this.fragmentList = f;
}
#Override
public Fragment getItem(int pos) {
return fragmentlist.get(pos);
}
#Override
public int getCount() {
return fragmentlist.size();
}
#Override
public int getItemPosition(Object object) {
return POSITION_NONE;
}
}
}
MyFragment.java
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.TextView;
import java.util.List;
public class MyFragment extends Fragment {
int pos;
#Override
public View onCreateView(LayoutInflater inflater, final ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.f_1, container, false);
pos = getArguments().getInt("num");
v.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.v("MainActivity", "Deleting at pos - " + pos);
MainActivity activity = (MainActivity) getActivity();
activity.delete(pos);
}
});
TextView tv = (TextView) v.findViewById(R.id.tvFragFirst);
FrameLayout fl = (FrameLayout) v.findViewById(R.id.frame_layout);
tv.setText(getArguments().getString("msg"));
fl.setBackgroundColor(getArguments().getInt("colour"));
return v;
}
public int getPosition() {
return pos;
}
public static MyFragment newInstance(int num,String text,int clr) {
MyFragment f = new MyFragment();
Bundle b = new Bundle();
b.putString("msg", text);
b.putInt("colour", clr);
b.putInt("num",num);
f.setArguments(b);
return f;
}
}
And the xml.files,
activity_main.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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.shakthivels.assingment10.MainActivity"
android:id="#+id/r_v"
>
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ADD a fragment"
android:id="#+id/button"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
f_1.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/av"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:id="#+id/frame_layout">
<TextView
android:id="#+id/tvFragFirst"
android:layout_width="203dp"
android:layout_height="127dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textSize="26sp"
android:text="TextView"
android:layout_gravity="center"
android:textColor="#000000" />
</FrameLayout>
</RelativeLayout>
1
2

Categories

Resources