How to show one JSON Object per ViewPager in Android? - android

I am working on a short news app. It's parsed JSON from a URL. I want to show one news per view pager.on swipe on next ViewPager, I want to show next news like the list. How can I can do that with ViewPager?

Set JSON data to PagerAdapter as we set to Base Adapter or other adapters & create custom layout for adapter.
view_pager_layout.xml
<RelativeLayout
android:id="#+id/loutPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/loutCirIndicator"
android:background="#android:color/transparent"
android:padding="5dp"/>
<LinearLayout
android:id="#+id/loutCirIndicator"
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_alignParentBottom="true"
android:background="#android:color/transparent"
android:gravity="center_vertical"
android:orientation="horizontal">
<me.relex.circleindicator.CircleIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
app:ci_drawable="#drawable/bg_selected_indicator"
app:ci_drawable_unselected="#drawable/bg_unselected_indicator" />
</LinearLayout>
</RelativeLayout>
row_pager_item.xml
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="200dp"
android:adjustViewBounds="true"
android:clickable="false"
android:scaleType="centerInside" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="abc" />
</LinearLayout>
ViewPager Adapter
public class SamplePagerAdapter extends PagerAdapter {
Activity activity;
List<Response_Model> Arr_ResultList;
ImageView imageView;
TextView textView;
public SamplePagerAdapter(final Activity activity,final List<Response_Model> Arr_ResultList) {
this.activity = activity;
this.Arr_ResultList = Arr_ResultList;
}
#Override
public int getCount() {
return Arr_ResultList.size();
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
final int pos = position;
View view = LayoutInflater.from(container.getContext()).inflate(R.layout.row_pager_item, container, false);
imageView = (ImageView) view.findViewById(R.id.imageView);
textView = (TextView) view.findViewById(R.id.textView);
Glide.with(activity).load(Arr_ResultList.get(pos).getImage())
.thumbnail(0.5f)
.crossFade()
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(imageView);
textView.setText(Arr_ResultList.get(pos).getName());
container.addView(view);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((LinearLayout) object);
}
}
Set Pager Adapter to ViewPager
SamplePagerAdapter pagerAdapter = new SamplePagerAdapter(MainActivity.this, Arr_Result_List);
viewPager.setAdapter(pagerAdapter);
indicator.setViewPager(viewPager);

You can use PagerAdapter for ViewPager and create your custom xml layout and
set your view on cell by position. Pass your list into pager adapter in adapter constructor.
You can refer this link it will be help you.
https://www.journaldev.com/10096/android-viewpager-example-tutorial

Related

Android whitespace in imageview

I am using a ViewPager to load images from server using Picasso. I see whitespace below the actual image. When I swipe the area with whitespace the image is swiped.
I have set scaleType="fitXy" to stretch to the ImageView's size.Below is the xml layout and code.
Please dont mark it as duplicate.I have googled it and the solutions did not help me.
#dimen/viewpager_img=150dp in w320dp-xhdpi
amblnce_display.xml:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:id="#+id/amblnce_dsp_lyt"
>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="#dimen/viewpager_img"
android:id="#+id/pager"
>
</android.support.v4.view.ViewPager>
view_pager_lyt.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="wrap_content">
<ImageView
android:layout_width="match_parent"
android:layout_height="#dimen/viewpager_img"
android:id="#+id/image1"
android:scaleType="fitXY"
/>
</LinearLayout>
ImagePagerAdapter.java:
public class ImagePagerAdapter extends PagerAdapter {
public ImagePagerAdapter(Context context,String ctgry){
if (category.equalsIgnoreCase("Ambulance")){
count=AmbulanceDisplayData.getInstance().imagecount();
}
layoutInflater=(LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
Log.e("Count",Integer.toString(count));
return count;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
view=layoutInflater.inflate(R.layout.view_pager_lyt,container,false);
linearLayout=(LinearLayout) view.findViewById(R.id.pgr_lyt);
imageView=(ImageView) view.findViewById(R.id.image1);
if (category.equalsIgnoreCase("Ambulance"))
{
count= ambulanceDisplayData.getInstance().imagecount();
images =ambulanceDisplayData.getInstance().getArrayList();
if(count!=0)
{
Log.e("Images", (String) images.get(position));
Picasso.with(context).load("http://abcd.com/xyz/"+(String) images.get(position))
.placeholder(R.drawable.noimage)
.fit().into(imageView);
}
}
container.addView(view);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
#Override
public boolean isViewFromObject(View view, Object object) {
if(view==object){
return true;
}
else {
return false;
}
}}
You should Set match_parent .
Hard-Coded Value causing problem here .
MATCH_PARENT means that the view wants to be as big as its parent,
minus the parent's padding .
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/image1"
android:adjustViewBounds="true"
android:scaleType="fitXY"
/>
Add android:adjustViewBounds="true" like
<ImageView
android:layout_width="match_parent"
android:layout_height="#dimen/viewpager_img"
android:id="#+id/image1"
android:adjustViewBounds="true"
android:scaleType="fitXY"
/>

Can I use ViewPager inside custom InfoWindowAdapter?

I'm using a InfoWindowAdapter within Google Maps API2. My XML layout has some simple TextView and ImageView views, but I also need a ViewPager to allow the users to swipe a series of custom layouts associated with the marker on the map (an image and some text). My InfoWindow layout is:
spot_window_complex.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/my_relative_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/transparent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/lin1"
android:layout_width="275.0dip"
android:layout_height="140.0dip"
android:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="275.0dip"
android:layout_height="85.0dip"
android:background="#drawable/round" />
<LinearLayout
android:layout_width="275.0dip"
android:layout_height="40.0dip"
android:background="#ffeeeeee"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="10.0dip"
android:paddingTop="10.0dip">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10.0dip"
android:paddingRight="3.0dip"
android:src="#drawable/clock" />
<ImageButton
android:id="#+id/imgThumbsUp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffeeeeee"
android:paddingRight="3.0dip"
android:src="#drawable/thumbsup" />
<TextView
android:id="#+id/txtPve"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="50.0dip"
android:textColor="#ff29c200"
android:textStyle="bold" />
<ImageButton
android:id="#+id/imgThumbsDown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffeeeeee"
android:paddingRight="3.0dip"
android:src="#drawable/thumbsdown" />
<TextView
android:id="#+id/txtNve"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffc91c11"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
I've created a simple XML layout to try to get the ViewPager working within the InfoWindowAdapter:
viewpager_item.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:padding="10dp" >
<TextView
android:id="#+id/countrylabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Country: " />
<TextView
android:id="#+id/country"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/countrylabel" />
</RelativeLayout>
My ViewPagerAdapter seems pretty standard:
class ViewPagerAdapter extends PagerAdapter {
LayoutInflater inflater;
String[] country = new String[]{"China", "India", "United States","Indonesia",
"Brazil", "Pakistan", "Nigeria", "Bangladesh", "Russia", "Japan"};
#Override
public int getCount() {
return country.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == ((RelativeLayout) object);
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
inflater = (LayoutInflater) getActivity()
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View itemView = inflater.inflate(R.layout.viewpager_item, container,
false);
TextView txtcountry = (TextView) itemView.findViewById(R.id.country);
txtcountry.setText(country[position]);
((ViewPager) container).addView(itemView);
return itemView;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
// Remove viewpager_item.xml from ViewPager
((ViewPager) container).removeView((RelativeLayout) object);
}
}
And my InfoWindowAdapter seems OK too:
public class SimpleInfoWindowAdapter implements GoogleMap.InfoWindowAdapter {
public SimpleInfoWindowAdapter() {
}
#Override
public View getInfoWindow(Marker marker) {
return null;
}
#Override
public View getInfoContents(Marker marker) {
View v;
MySimpleMarker myMarker = mSimpleMarkersHashMap.get(marker);
v = getActivity().getLayoutInflater().inflate(R.layout.spot_window_complex, null);
TextView txtPve = (TextView) v.findViewById(R.id.txtPve);
TextView txtNve = (TextView) v.findViewById(R.id.txtNve);
txtPve.setText("0"); //test string only
txtNve.setText("0"); //test string only
ViewPager vPager = (ViewPager) v.findViewById(R.id.pager);
vPager.setAdapter(new ViewPagerAdapter());
return v;
}
}
The TextView and ImageView views that are static from the XML or are set by the adapter work fine, as does the general layout. However, my ViewPager, which should in this test case have 10 swipeable countries in TextViews, is blank. All the relevant code is being handled inside one fragment and there are no errors in the Android Monitor.
Any ideas what I've done wrong?
I also need a ViewPager to allow the users to swipe a series of custom layouts associated with the marker on the map
That is not possible.
Any ideas what I've done wrong?
The View you return from your InfoWindowAdapter is converted immediately into a Bitmap. That Bitmap is what winds up being rendered on the screen. Hence, you cannot have interactive widgets, like a ViewPager. Not only will they not be interactive, but anything that is rendered asynchronously (e.g., pages in a ViewPager) might not be rendered in time before the Bitmap is created.
Or, quoting the documentation:
Note: The info window that is drawn is not a live view. The view is rendered as an image (using View.draw(Canvas)) at the time it is returned. This means that any subsequent changes to the view will not be reflected by the info window on the map. To update the info window later (for example, after an image has loaded), call showInfoWindow(). Furthermore, the info window will not respect any of the interactivity typical for a normal view such as touch or gesture events. However you can listen to a generic click event on the whole info window as described in the section below.

CardView not showing content eclipse

I am using android.support.v7.widget.CardView to show ImageView with two TextView's in RecyclerView but card view not showing the content(showing only blank white cards) when the screen orientation is vertical, on the other hand it is showing content when orientation is landscape.
When I run the same project from AndroidStudio there is no problem everything works fine.
I don't understand what is problem out there, is there problem with eclipse?
Please see the code below,
PostListFragment
public class PostListFragment extends Fragment implements AppConfig {
private ArrayList<Post> mPostArrayList;
private PostRecyclerAdapter mPostRecyclerAdapter;
private RecyclerView mRecyclerView;
//other declarations
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//removed
}
private void init() {
// Set up RecyclerView
mRecyclerView = (RecyclerView) mRootView
.findViewById(R.id.mPostListRecyclerView);
// Setup layout manager for mPostArrayList and column count
final LinearLayoutManager mLayoutManager = new LinearLayoutManager(
getActivity());
// Control orientation of the mPostArrayList
mLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
mLayoutManager.scrollToPosition(0);
// Attach layout manager
mRecyclerView.setLayoutManager(mLayoutManager);
// Listen to the item touching
mRecyclerView.addOnItemTouchListener(new RecyclerItemClickListener(
getActivity(),
new RecyclerItemClickListener.OnItemClickListener() {
#Override
public void onItemClick(View itemView, int position) {
//some action
}
}));
mPostArrayList = new ArrayList<>();
// Bind adapter to recycler
mPostRecyclerAdapter = new PostRecyclerAdapter(
getActivity(), mPostArrayList);
mRecyclerView.setAdapter(mPostRecyclerAdapter);
}
private void getPosts() {
// Execute async task
new AsyncPosts().execute(mPostURL);
}
public class AsyncPosts extends AsyncTask<Object, String, JSONObject> {
//no problem with this
}
}
Layout used for PostListFragment
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mParentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/mPostListContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/mPostListSwipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.RecyclerView
android:id="#+id/mPostListRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v4.widget.SwipeRefreshLayout>
</FrameLayout>
<!-- removed -->
</LinearLayout>
Here is adapter to set the values,
PostRecyclerAdapter
public class PostRecyclerAdapter extends
RecyclerView.Adapter<PostRecyclerAdapter.SimpleItemViewHolder> {
private Context mContext;
private List<Post> post;
// Provide a suitable constructor (depends on the kind of data store)
public PostRecyclerAdapter(Context context, List<Post> items) {
this.mContext = context;
this.post = items;
}
// Return the size of your data set (invoked by the layout manager)
#Override
public int getItemCount() {
return this.post.size();
}
// Create new items (invoked by the layout manager)
// Usually involves inflating a layout from XML and returning the holder
#Override
public SimpleItemViewHolder onCreateViewHolder(ViewGroup viewGroup,
int viewType) {
View itemView = LayoutInflater.from(viewGroup.getContext()).inflate(
R.layout.post_list_item, viewGroup, false);
return new SimpleItemViewHolder(itemView);
}
// Replace the contents of a view (invoked by the layout manager)
// Involves populating data into the item through holder
#Override
public void onBindViewHolder(SimpleItemViewHolder viewHolder, int position) {
Glide.with(mContext).load(post.get(position).IMG_URL)
.placeholder(R.drawable.ic_placeholder).crossFade(1000)
.centerCrop().into(viewHolder.mPostListSmallThumbnail);
viewHolder.mPostListSmallTitle.setText(post.get(position).POST_TITLE);
viewHolder.mPostListSmallContent
.setText(post.get(position).POST_CONTENT);
}
// Provide a reference to the views for each data item
// Provide access to all the views for a data item in a view holder
public final static class SimpleItemViewHolder extends
RecyclerView.ViewHolder {
ImageView mPostListSmallThumbnail;
TextView mPostListSmallTitle, mPostListSmallContent;
public SimpleItemViewHolder(View itemView) {
super(itemView);
mPostListSmallThumbnail = (ImageView) itemView
.findViewById(R.id.mPostListSmallThumbnail);
mPostListSmallTitle = (TextView) itemView
.findViewById(R.id.mPostListSmallTitle);
mPostListSmallContent = (TextView) itemView
.findViewById(R.id.mPostListSmallContent);
}
}
}
post_list_item
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mPostListSmallCard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:foreground="#drawable/card_background"
android:clickable="true"
app:cardCornerRadius="#dimen/blog_card_radius"
app:cardUseCompatPadding="true"
app:contentPadding="#dimen/blog_card_radius">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mPostListSmallThumbnail"
android:layout_width="#dimen/blog_image_thumb_dim"
android:layout_height="#dimen/blog_image_thumb_dim"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_placeholder"
android:adjustViewBounds="true"
android:contentDescription="#string/image_thumbnail_placeholder" />
<TextView
android:id="#+id/mPostListSmallTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="#dimen/post_list_margin_left"
android:layout_marginStart="#dimen/post_list_margin_right"
android:layout_toEndOf="#+id/mPostListSmallThumbnail"
android:layout_toRightOf="#+id/mPostListSmallThumbnail"
android:ellipsize="end"
android:lines="2"
android:singleLine="false"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/mPostListSmallContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/mPostListSmallThumbnail"
android:layout_alignEnd="#+id/mPostListSmallTitle"
android:layout_alignLeft="#+id/mPostListSmallTitle"
android:layout_alignRight="#+id/mPostListSmallTitle"
android:layout_alignStart="#+id/mPostListSmallTitle"
android:layout_below="#+id/mPostListSmallTitle"
android:ellipsize="end"
android:lines="3"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Here is post_list_item for landscape layout
land/post_list_item
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mPostListSmallCard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="#dimen/blog_card_margin_landscape"
android:layout_marginLeft="#dimen/blog_card_margin_landscape"
app:cardCornerRadius="#dimen/blog_card_radius"
app:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mPostListSmallThumbnail"
android:layout_width="#dimen/blog_image_thumb_dim"
android:layout_height="#dimen/blog_image_thumb_dim"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:contentDescription="#string/image_thumbnail_placeholder" />
<TextView
android:id="#+id/mPostListSmallTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="#dimen/post_list_margin_left"
android:layout_marginStart="#dimen/post_list_margin_right"
android:layout_toEndOf="#+id/mPostListSmallThumbnail"
android:layout_toRightOf="#+id/mPostListSmallThumbnail"
android:ellipsize="end"
android:lines="2"
android:singleLine="false"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/mPostListSmallContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/mPostListSmallThumbnail"
android:layout_alignEnd="#+id/mPostListSmallTitle"
android:layout_alignLeft="#+id/mPostListSmallTitle"
android:layout_alignRight="#+id/mPostListSmallTitle"
android:layout_alignStart="#+id/mPostListSmallTitle"
android:layout_below="#+id/mPostListSmallTitle"
android:ellipsize="end"
android:lines="3"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</android.support.v7.widget.CardView>

Android - ViewPager inside a Fragment not using Fragments

I have a Fragment, and I want to have a ViewPager inside of it, but only want part of the page to be a ViewPager, so I'm not making the ViewPager the contentView of the Activity. I'm having a couple problems: I don't know where to "fill in" my view, and I don't know what to do in destoryItem.
Here's what I have (I'm probably missing stuff):
In my Fragment, I am getting the entire fragment layout, and then the ViewPager item from within it, setting the Adapter, the id (not sure if this is needed or what it does), and setting the currentItem.
public View onCreateView(LayoutInflater inflater, ViewGroup parent, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_how_to_play, parent, false);
HowToPlayPagerAdapter adapter = new HowToPlayPagerAdapter(getActivity());
ViewPager viewPager = (ViewPager) v.findViewById(R.id.how_to_play_view_pager);
viewPager.setAdapter(adapter);
viewPager.setId(R.id.viewPager);
viewPager.setCurrentItem(0);
return v;
}
Still in this Class I have my PagerAdapter, this is where I know there are problems as I am not sure how exactly to implement this.
class HowToPlayPagerAdapter extends PagerAdapter {
private Activity parent;
public HowToPlayPagerAdapter(Activity parent) {
this.parent = parent;
}
public Object instantiateItem(View collection, int position) {
// TODO: In here I think we'll want to really get the same view every time and just fill it in properly
return parent.findViewById(R.id.how_to_play_view_pager_id);
}
#Override
public int getCount() {
return mHowToPlayPages.size();
}
#Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == ((View) arg1);
}
#Override
public void destroyItem(View container, int position, Object object) {
super.destroyItem(container, position, object);// No idea what to do in here
}
}
This is my fragment layout where the ViewPager is actually defined.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/top_header_background_shadowed"
android:orientation="horizontal"
android:paddingBottom="8dp"
android:paddingLeft="16dp"
android:paddingTop="8dp" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_launcher" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/logo_need2buythis" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:id="#+id/how_to_play_view_pager" />
</LinearLayout>
And this is the layout for the View I'd like to be inside the ViewPager and then I would fill in the TextView and other elements I'm yet to add depending on which position we're at in the Pager.
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/how_to_play_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="32dp"
android:text="Gameplay" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
Currently when I run it I do see the fragment layout but I see nothing where the ViewPager content should be (no surprise there because I'm not filling in anything with the Text in my current implementation because I don't know where/how to), and when I start just swiping back and forth for a while my app eventually crashes saying I did not override destroyItem.

How to combine two view in ViewPager Android?

I'm creating ViewPager with CirclePageIndicator.There are two View inside. Right now, It's showing two View in one page. But when i scroll to next the previous one is showing. It means it is showing like previous one + new.
Current Look like:
ItemA, ItemB | ItemB, ItemC | ItemC, ItemD |
Expected look like
ItemA, ItemB | ItemC, ItemD | ItemE, ItemF |
How can i fix it?
Is there any way to combine this two ItemA and ItemB?
Here is my code.
Adapter
public class ViewPagerAdapter extends PagerAdapter {
// Declare Variables
Context context;
ViewPager pager;
String[] domain;
String[] title;
int[] flag;
LayoutInflater inflater;
public ViewPagerAdapter(ViewPager pager,Context context, String[] domain,
String[] title, int[] flag) {
this.pager= pager;
this.context = context;
this.domain = domain;
this.title = title;
this.flag = flag;
}
#Override
public int getCount() {
//Show the CirclePageIndicator for only half of array.
return (int) Math.ceil((double)title.length/2);
// return title.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == ((RelativeLayout) object);
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View itemView = inflater.inflate(R.layout.related_article_item, container,
false);
// Locate the TextViews in viewpager_item.xml
final Button btnSave = (Button) itemView.findViewById(R.id.btn_save);
final Button btnLike = (Button) itemView.findViewById(R.id.btn_like);
final TextView tv_domain = (TextView) itemView.findViewById(R.id.domain_text);
TextView tv_title = (TextView) itemView.findViewById(R.id.title_text);
ResizableImageView imageView = (ResizableImageView) itemView.findViewById(R.id.imageViewDynamic);
final ProgressBar progressBar = (ProgressBar) itemView.findViewById(R.id.loading);
// Capture position and set to the TextViews
tv_domain.setText(domain[position]);
tv_title.setText(title[position]);
// Locate the ImageView in viewpager_item.xml
imageView.setImageResource(flag[position]);
// Add viewpager_item.xml to ViewPager
((ViewPager) container).addView(itemView);
return itemView;
}
//This is the code to show two view inside one page.
#Override
public float getPageWidth(int position) {
return (0.5f);
}
// return (super.getPageWidth(position) / 2);
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
// Remove viewpager_item.xml from ViewPager
((ViewPager) container).removeView((RelativeLayout) object);
}
}
MainActivity
public class TestingActivity extends ActionBarActivity {
// Declare Variables
ViewPager viewPagerRelated;
PagerAdapter adapter;
String[] title;
String[] domain;
int[] flag;
ViewPager pager1;
CirclePageIndicator mIndicator;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Get the view from viewpager_main.xml
setContentView(R.layout.viewpager_main);
title = new String[]{"Sample1", "Sample2", "Sample3",
"Sample4", "Sample5", "Sample6", "Sample7", "Sample8",
"Sample9", "Sample10"};
domain = new String[]{"text1", "text1",
"text1", "text1", "text1", "text1",
"text1", "text1", "text1", "text1"};
flag = new int[]{R.drawable.arsenal, R.drawable.aston_villa,
R.drawable.manchester_city, R.drawable.liverpool,
R.drawable.chelsea, R.drawable.manchester_united, R.drawable.swansea,
R.drawable.liverpool, R.drawable.west_brom, R.drawable.west_ham};
// Locate the ViewPager in viewpager_main.xml
viewPagerRelated = (ViewPager) findViewById(R.id.pager2);
// Pass results to ViewPagerAdapter Class
adapter = new ViewPagerAdapter(pager1, ArticleViewActivityV2.this, domain,
title, flag);
// Binds the Adapter to the ViewPager
viewPagerRelated.setAdapter(adapter);
// viewPagerRelated.setPageMargin(3);
// ViewPager Indicator
mIndicator = (CirclePageIndicator) findViewById(R.id.indicator_pager);
mIndicator.setViewPager(viewPagerRelated);
}
}
XML Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
layout="#layout/related_article_item"
android:id="#+id/article_1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<include
layout="#layout/related_article_item"
android:id="#+id/article_2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
Item 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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="220dp"
android:background="#drawable/gridview_item_selector"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp">
<RelativeLayout
android:id="#+id/imageLayout"
android:layout_width="200dp"
android:layout_height="100dp">
<com.bindez.news.utils.ResizableImageView
android:id="#+id/imageViewDynamic"
android:layout_width="match_parent"
android:layout_height="100dp"
android:src="#drawable/app_icon" />
<ProgressBar
android:id="#+id/loading"
style="?android:attr/progressBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:padding="10dp"
android:visibility="visible" />
</RelativeLayout>
<TextView
android:id="#+id/title_text"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="#+id/imageLayout"
android:layout_marginTop="7dp"
android:maxLines="10"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingTop="7dp"
android:text="Title Text"
android:textColor="#color/tile_text"
android:textSize="14sp" />
<TextView
android:id="#+id/domain_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/title_text"
android:layout_marginBottom="3dp"
android:ellipsize="end"
android:maxLines="1"
android:paddingBottom="7dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:text=""
android:textColor="#color/text_gray"
android:textSize="12sp" />
<TextView
android:id="#+id/seperator"
android:layout_width="fill_parent"
android:layout_height="1px"
android:layout_below="#+id/domain_text"
android:background="#color/light_gray_seperator" />
<Button
android:id="#+id/btn_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/seperator"
android:background="#android:color/transparent"
android:drawableRight="#drawable/ic_unsave"
android:minHeight="0dp"
android:minWidth="0dp"
android:paddingBottom="5dp"
android:paddingRight="7dp"
android:paddingTop="5dp" />
<Button
android:id="#+id/btn_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/seperator"
android:background="#android:color/transparent"
android:drawableLeft="#drawable/ic_unlike"
android:drawablePadding="5dp"
android:minHeight="0dp"
android:minWidth="0dp"
android:paddingBottom="5dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingTop="5dp"
android:text=""
android:textColor="#color/btn_green"
android:textSize="14sp" />
</RelativeLayout>
</RelativeLayout>

Categories

Resources