title: Android Material View Pager GridView Layout Design not proper
body: <p>am trying to implement a material view pager using <a href="https://github.com/florent37/MaterialViewPager" rel="nofollow noreferrer">this</a>. The pager is working properly. But what i need is a grid layout of cards under the view pager like <a href="https://i.stack.imgur.com/r71hO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/r71hO.png" alt="this"></a>  .</p>
  
  <p>But am using <code>GridLayoutManager</code> and am ending up with a result like<a href="https://i.stack.imgur.com/CmJ2R.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CmJ2R.png" alt="this"></a>. Can anyone please help me out to realign this.</p>
  
  <p>This is my code:
  Inside recyclerview fragment :</p>
  
  <pre><code>@Override
  public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
      super.onViewCreated(view, savedInstanceState);
      // Calling the RecyclerView
      mRecyclerView = (RecyclerView)view.findViewById(R.id.recyclerView);
      mRecyclerView.setHasFixedSize(true);
  
  
              mLayoutManager = new GridLayoutManager(context, 2);
              mRecyclerView.setLayoutManager(mLayoutManager);
              mAdapter = new RecyclerViewMaterialAdapter(new GridAdapter(context, mContentItems));
              mRecyclerView.setAdapter(mAdapter);               
  
      MaterialViewPagerHelper.registerRecyclerView(getActivity(), mRecyclerView, null);
  }
  </code></pre>
  
  <p>And inside GridAdapter:</p>
  
  <pre><code>public class GridAdapter  extends RecyclerView.Adapter&lt;GridAdapter.ViewHolder&gt; {
  
  List&lt;CommonCategoryItem&gt; mItems;
  Context context;
  public GridAdapter(Context context,ArrayList&lt;CommonCategoryItem&gt; list) {
      super();
      mItems = new ArrayList&lt;&gt;();
      mItems = list;
      this.context = context;
  }
  
  @Override
  public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
      final View view= LayoutInflater.from(viewGroup.getContext())
                  .inflate(R.layout.list_item_card_small, viewGroup, false);
  
      return new ViewHolder(view);
  }
  
  @Override
  public void onBindViewHolder(ViewHolder viewHolder, int i) {
  
              CommonCategoryItem item = mItems.get(i);
              viewHolder.title.setText(item.getTitle());
              int resId = ImageHelper.getResourceId(context,mItems.get(i).getImage());
              if(resId!=0)
              {viewHolder.imageView.setImageResource(resId);}
  
  }
  
  @Override
  public int getItemCount() {
  
      return mItems.size();
  }
  
  
  public static class ViewHolder extends RecyclerView.ViewHolder {
  
      public ImageView imageView;
      public TextView title;
      public CardView cardView;
  
      public ViewHolder(View itemView) {
          super(itemView);
          imageView = (ImageView)itemView.findViewById(R.id.img_thumbnail);
          title = (TextView)itemView.findViewById(R.id.title);
          cardView = (CardView)itemView.findViewById(R.id.smallCardView);
      }       
  }
  
  }
  </code></pre>
  
  <p>Also need a onclick listener to move toa different fragment on each of the gridview item click. I am unable to get the childposition. Can someone help me out.</p>