ViewpagerがRecyclerView行内に表示されない

Question

関連する写真（2つのタブ）のコメントといいね！の両方を表示するaViewpPagerの上と下に写真を表示する「写真の詳細」アクティビティまたはフラグメントを作成します。画面を「スクロール可能」にして、コメントといいね！の両方で上下にスクロールし、左右にスライドできるようにするために、2行のRecyclerViewを使用することにしました。

行1：写真（ImageView）。

行2：SlidingTabLayout + ViewPager + FragmentPagerAdapter。

コードをコンパイルして実行し、画像とslideTabLayoutを表示しますが、ViewPagerは表示しません。

私の2つの主な質問は次のとおりです。

1-私の実装の何が問題なのか。

2-私が達成したいことのための代替またはより良い解決策はありますか？

注：ヘッダー付きのlistViewを使用したくありません。ネットワークから上/下に要素を追加する方が簡単なため、RecyclerViewを使用します。

PhotoDetailsActivity.Java

public class MainActivity extends ActionBarActivity {
    RecyclerView recyclerViewPhotoDetails;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        this.recyclerViewPhotoDetails = (RecyclerView) this.findViewById(R.id.recycler_view_photo_details);
        this.recyclerViewPhotoDetails.setLayoutManager(new LinearLayoutManager(this));
        this.recyclerViewPhotoDetails.setAdapter(new PhotoDetailsRecyclerAdapter(this.getSupportFragmentManager()));
    }
}

PhotosDetailsRecyclerAdapter.Java

public class PhotoDetailsRecyclerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    private static final int ROW_IMAGE = 0;
    private static final int ROW_LIKES_AND_COMMENTS = 1;
    private static final int TOTAL_ROWS = 2;

    private FragmentManager fragmentManager;

    public PhotoDetailsRecyclerAdapter(FragmentManager fragmentManager) {
        this.fragmentManager = fragmentManager;
    }

    @Override
    public int getItemViewType(int position) {
        if (position == 0) {
            return ROW_IMAGE;
        } else {
            return ROW_LIKES_AND_COMMENTS;
        }
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        if(viewType == ROW_IMAGE) {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.layout_image, parent, false);
            return new ImageViewHolder(view);
        } else {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.layout_comments_and_likes, parent, false);
            return new CommentsAndLikesViewHolder(view);
        }
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int i) {
    }

    @Override
    public int getItemCount() {
        return TOTAL_ROWS;
    }

    public class ImageViewHolder extends RecyclerView.ViewHolder {
        public ImageViewHolder(View itemView) {
            super(itemView);
        }
    }

    public class CommentsAndLikesViewHolder extends RecyclerView.ViewHolder {
        private SlidingTabLayout slidingTabLayout;
        private ViewPager viewPager;

        public CommentsAndLikesViewHolder(View view) {
            super(view);

            slidingTabLayout = (SlidingTabLayout) view.findViewById(R.id.sliding_tab_layout_comments_and_likes);
            viewPager = (ViewPager) view.findViewById(R.id.view_pager_comments_and_likes);

            viewPager.setAdapter(new CommentsAndLikesPagerAdapter(fragmentManager));
            slidingTabLayout.setDistributeEvenly(true);
            slidingTabLayout.setViewPager(viewPager);
        }
    }
}

activity_main.xml

<Android.support.v7.widget.RecyclerView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/recycler_view_photo_details"
    Android:scrollbars="vertical"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    />

layout_image.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:orientation="vertical"
    >

    <ImageView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:adjustViewBounds="true"
        Android:scaleType="centerCrop"
        Android:src="@drawable/img"
        />

</FrameLayout>

layout_comments_and_likes.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"
    >

    <org.bitbucket.androidapp.SlidingTabLayout
        Android:id="@+id/sliding_tab_layout_comments_and_likes"
        Android:layout_width="match_parent"
        Android:layout_height="48dp"
        Android:background="@Android:color/darker_gray"
        />

    <Android.support.v4.view.ViewPager
        Android:id="@+id/view_pager_comments_and_likes"
        Android:layout_height="match_parent"
        Android:layout_width="match_parent"
        Android:background="@Android:color/holo_blue_dark"
        />

</LinearLayout>

CommentsAndLikesPagerAdapter.Java

public class CommentsAndLikesPagerAdapter extends FragmentPagerAdapter {
    private static final int TOTAL_TABS = 2;

    private String[] tabs = { "comments", "likes" };

    public CommentsAndLikesPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        if(position == 0) {
            return new CommentsFragment();
        } else {
            return new LikesFragment();
        }
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return tabs[position];
    }

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

CommentsFragment.Java

 public class CommentsFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_comments, container, false);
        RecyclerView recyclerViewComments = (RecyclerView) view.findViewById(R.id.recycler_view_comments);
        recyclerViewComments.setLayoutManager(new LinearLayoutManager(this.getActivity()));
        recyclerViewComments.setAdapter(new CommentsRecyclerAdapter());
        return view;
    }
}

fragment_comments.xml

<Android.support.v7.widget.RecyclerView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/recycler_view_comments"
    Android:scrollbars="vertical"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    />

LikesFragment.Java

public class LikesFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_likes, container, false);
        RecyclerView recyclerViewLikes = (RecyclerView) view.findViewById(R.id.recycler_view_likes);
        recyclerViewLikes.setLayoutManager(new LinearLayoutManager(this.getActivity()));
        recyclerViewLikes.setAdapter(new LikesRecyclerAdapter());
        return view;
    }
}

fragment_likes.xml

<Android.support.v7.widget.RecyclerView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/recycler_view_likes"
    Android:scrollbars="vertical"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    />

layout_comment.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_centerInParent="true"
        Android:text="Comment"
        />

</RelativeLayout>

layout_like.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_centerInParent="true"
        Android:text="Like"
        />

</RelativeLayout>

Answer 1

私はこの問題に直面し、各ViewPagerのIDを設定することでこれを解決しました:) ViewPagerは、recyclerviewコンテキストの一部であっても、同じフラグメント内のidの共有を許可しません。

pagerHolder.pager.setId(position);

Answer 2

ViewPagerの高さを更新します。recyclerViewのアイテムには特定の高さが必要です

<Android.support.v4.view.ViewPager
    Android:id="@+id/view_pager"
    Android:layout_height="300dp"
    Android:layout_width="match_parent"
    Android:background="@Android:color/holo_blue_dark" />

Answer 3

このコードを見て、コードを更新できます。私はこのコードを自分のプロジェクトで使用して作業しました。 onBinViewHolderメソッド内のViewPagerにViewPagerAdapterを設定する必要があります。うまくいかない場合は、お手伝いします。

RecylerviewAdapter

    // Replace the contents of a view (invoked by the layout manager)
   @Override
   public void onBindViewHolder(ViewHolder holder, int position) {
      // - get element from your dataset at this position
      // - replace the contents of the view with that element
      initializeViews("Mustafa", holder, position);
   }

   private void initializeViews(final String object, final ViewHolder holder, int position) {
      holder.textViewCount.setText("5");
      holder.imageViewStar.setImageResource(R.drawable.info);
      holder.imageViewFavorite.setImageResource(R.drawable.info);
      ViewPagerBoundariesAdapter adapter = new ViewPagerBoundariesAdapter(activity, new ArrayList<ViewPagerItem>(), listener);
      holder.viewPager.setAdapter(adapter);
      holder.viewPager.setClipToPadding(false);
      holder.viewPager.setPadding(40, 0, 40, 0);
   }

ViewPagerAdapter

/**
 * Created by MustafaS on 10.3.2015.
 */
public class ViewPagerBoundariesAdapter extends PagerAdapter {
   private ArrayList<ViewPagerItem>    pagerItems;
   private LayoutInflater              inflater;
   private Context                     context;
   private ViewPagerItemClickInterface listener;

   public ViewPagerBoundariesAdapter(Context context, ArrayList<ViewPagerItem> pagerItems, ViewPagerItemClickInterface callback) {
      super();
      this.pagerItems = pagerItems;
      this.context = context;
      this.listener = callback;
      inflater = LayoutInflater.from(context);
   }

   @Override
   public Object instantiateItem(ViewGroup container, int position) {

      LinearLayout layout = (LinearLayout) inflater.inflate(R.layout.row_viewpager, container, false);
      ImageView imageViewCampaign = (ImageView) layout.findViewById(R.id.imageview_campaign);
      TextView textViewCampaign = (TextView) layout.findViewById(R.id.textview_campaign);
      imageViewCampaign.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            listener.onViewPagerItemClick(1);
         }
      });
      // textViewCampaign.setText("Lorem ipsum dolor sit amet\n" + "aliquam nec nisi in lorem");
      imageViewCampaign.setImageDrawable(context.getResources().getDrawable(R.drawable.nusret));
      container.addView(layout);
      return layout;
   }

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

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

   @Override
   public boolean isViewFromObject(View view, Object obj) {
      return view.equals(obj);
   }

}

recylerview 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">
    <Android.support.v7.widget.RecyclerView
        Android:id="@+id/listview_brand"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent" />
</LinearLayout>

recylerview行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">

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_marginBottom="8dp"
        Android:layout_marginLeft="8dp"
        Android:orientation="horizontal">

        <ImageView
            Android:id="@+id/imageview_favorite"
            Android:layout_width="32dp"
            Android:layout_height="32dp"
            Android:layout_gravity="center" />

        <TextView
            Android:id="@+id/textview_brand_name"
            Android:layout_width="0dp"
            Android:layout_height="match_parent"
            Android:layout_weight="1"
            Android:gravity="center_vertical"
            Android:paddingLeft="8dp"
            Android:text="Gucci"
            Android:textSize="@dimen/standart_text_size" />

        <FrameLayout
            Android:layout_width="32dp"
            Android:layout_height="32dp"
            Android:layout_marginRight="8dp">

            <ImageView
                Android:id="@+id/imageview_star"
                Android:layout_width="match_parent"
                Android:layout_height="match_parent" />

            <TextView
                Android:id="@+id/textview_count"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_gravity="center"
                Android:ellipsize="end"
                Android:gravity="center"
                Android:singleLine="true"
                Android:textSize="@dimen/standart_text_size" />
        </FrameLayout>
    </LinearLayout>

    <Android.support.v4.view.ViewPager
        Android:id="@+id/pager"
        Android:layout_width="match_parent"
        Android:layout_height="@dimen/pager_image_and_text_height" />
</LinearLayout>

ビューページャー行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="wrap_content"
    Android:orientation="vertical">

    <ImageView
        Android:id="@+id/imageview_campaign"
        Android:layout_width="match_parent"
        Android:layout_height="@dimen/parallax_image_height"
        Android:layout_marginLeft="4dp"
        Android:layout_marginRight="4dp"
        Android:adjustViewBounds="true"
        Android:scaleType="centerCrop" />

    <TextView
        Android:id="@+id/textview_campaign"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:paddingLeft="4dp"
        Android:paddingRight="4dp"
        Android:paddingTop="8dp"
        Android:text="Lorem ipsum dolor sit amet
aliquam nec nisi in lorem"
        Android:textSize="@dimen/standart_text_size" />
</LinearLayout>

Answer 4

私は同じ問題を抱えていて、ここですべての答えを読みました。これをどのように解決するかを説明します。

少し背景を説明すると、アプリの起動時に3つのフラグメントを表示するタブが上部にあるビューページャーがあります。

フラグメントの1つの内部には、ビュー内のアイテムの1つとしてビューページャーを含むrecyclerviewがあります。そのフラグメントAを呼び出します。

フラグメントA内でこれを呼び出して、RECYCLERVIEWアダプターを設定します。

FragmentOuterAdapter fragmentOuterAdapter  = new FragmentOuterAdapter(getActivity(), this ); //this here refers to Fragment A - note this as this is IMPORTANT
mRecyclerView.setAdapter(fragmentOuterAdapter);

RECYCLERVIEWアダプター内で、次を呼び出してviewHolderを作成します。

class ViewPagerViewHolder extends RecyclerView.ViewHolder {
    ViewPager viewPager;
    public ViewPagerViewHolder(View view) {
        super(view);
        viewPager = (ViewPager) view.findViewById(R.id.viewPager);
    }
}

OnCreateViewHolderの下で、ビューを初期化し、そのハンドルを取得します。

重要なコードはonBindViewHolderの下にあります。

        FragmentManager fragmentManager = fragment.getChildFragmentManager();
        ((ViewPagerViewHolder) holder).viewPager.setAdapter(new SubViewFragmentPagerAdapter(fragmentManager));

FragmentOuterAdapterで渡されたフラグメントオブジェクトは、オブジェクトをgetChildFragmentManager（）に使用している場所に表示されます。

ビューページャーを介してフラグメント内にフラグメントを表示しているため、fragmentmanagerの代わりに子フラグメントマネージャを使用する必要があります。

これにより、ビューページャーが機能します。

Answer 5

ViewPagerを、wrap-contentまたはmatch-parentではなく、ハードコーディングされた高さに設定してみてください。 ViewPagerにデータを入力しても、画面が空白になるという奇妙な問題がありました。

Answer 6

2番目の行として、線形レイアウトを使用する必要があり、その中にコメントといいね！フラグメントを表示するtabhostウィジェットとともにビューページャーを追加します。

ライブラリ https://github.com/daimajia/AndroidSwipeLayout を使用すると、より簡単な方法で同じ効果を得ることができます。

興味のある方は詳細をお知らせください。

Answer 7

私のために働いた唯一の方法は、Android Support Library v7で登場した新しいものを使用することです

RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
recyclerview.setLayoutManager(new LinearLayoutManager(context,
                        LinearLayoutManager.HORIZONTAL,false));
recyclerview.setAdapter(adapter);
SnapHelper snapHelper = new PagerSnapHelper();
snapHelper.attachToRecyclerView(recyclerView);

Answer 8

Linh Nguyen によって与えられた答えはそれを修正しましたが、元の質問とは少し異なるケースがありました。

アクティビティでは、行を持つRecyclerViewがありました。
ROW1：Xイメージを含むViewPager（_layout_height="200dp"_）
ROW2：テキスト
ROW3：YページのViewPager（_layout_height="100dp"_）
...

ROW1とROW3に同じレイアウトを再利用していたため、両方のViewPagersに同じ_@+id_がありました。
ROW1のViewPagerは正常に機能しました。
ただし、ROW3のViewPagerは次のように動作します。

• 最初の画面ロード時に、ViewPagerページ作成メソッドが呼び出されます（ROW3のViewPagerの最初と2つの周囲のページ/フラグメントのonCreateView()）
• 何もレンダリングされないように見えました（空のページ）

しかし、ROW3に5つ以上の画像がある場合、空のページをスワイプすると、最終的に3、4ページなどが表示されることに気付きました。最後に到達すると、ページ2と1に戻ることが適切に作成されます（それらが再作成されたため）。

ROW3のViewPagerに一意のIDを付与すると、すべてが正常に機能し始めました。