Search code examples
androidxmlandroid-studioscrollviewandroid-pageradapter

Scrollable PagerAdapter


I did a PagerAdapter, and it works very well but when I put my phone horizontally, many things like TextView are not visible, because they are "below" the screen of the phone. I know I could put a ScrollView, but this option gives a lot of errors.

Is there another option besides the ScrollView or what does the error mean?

This is my code with the LinearLayout without any errors but the PagerAdapter isn't scrollable.

Java code:

public class SlideAdapter_info extends PagerAdapter {
    Context context;
    LayoutInflater inflater;

    public SlideAdapter_info(Context context){
        this.context = context;
    }

    @Override
    public int getCount() {
        return 1;
    }

    @Override
        public boolean isViewFromObject(View view, Object object) {
        return (view==(LinearLayout)object);
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object{
        container.removeView((LinearLayout)object);
    }

    @NonNull
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        inflater = (LayoutInflater) 
        context.getSystemService(context.LAYOUT_INFLATER_SERVICE);
        View view = inflater.inflate(R.layout.slide_info, container, false);
        //other code to set the textviews and the imageview
        container.addView(view);
        return view;
    }
}

xml 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:id="@+id/slidelinear_info"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:gravity="center"
     android:orientation="vertical">

<TextView /> ....

<!-- This allows me to have a circle shaped image-->
<de.hdodenhof.circleimageview.CircleImageView 
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/slideimg"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:paddingTop="10dp"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    app:civ_border_color="@color/black"
    app:civ_border_width="3dp" />

    <TextView /> ....

    </LinearLayout>

This is the result: (horizontal)

This is the result:(vertical)

If instead of LinearLayout I put the ScrollView, Android Studio gives me this error:

java.lang.IllegalStateException: ScrollView can host only one direct child

at esame.progetto.xhondar.github.com.info.SlideAdapter_info.instantiateItem(SlideAdapter_info.java:87)

This is the row: View view = inflater.inflate(R.layout.slide_info, container, false);


Solution

  • java.lang.IllegalStateException: ScrollView can host only one direct child is telling you exactly what your problem is. By just converting your LinearLayout to a ScrollView, you have multiple children. If you want your current layout to be scrollable within your ViewPager, you need to wrap your LinearLayout with the ScrollView in your layout xml file.

    <?xml version="1.0" encoding="utf-8"?>
    <ScrollView 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">
         <LinearLayout
          android:id="@+id/slidelinear_info"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center"
          android:orientation="vertical">
             <TextView /> ....
             <de.hdodenhof.circleimageview.CircleImageView 
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:id="@+id/slideimg"
              android:layout_width="200dp"
              android:layout_height="200dp"
              android:paddingTop="10dp"
              android:layout_centerHorizontal="true"
              android:layout_centerVertical="true"
              app:civ_border_color="@color/black"
              app:civ_border_width="3dp" />
            <TextView /> ....
        </LinearLayout>
    </ScrollView>