Android : How to set viewpager with multiple views and view with margins from otherview?

Im using Viewpagerindicator and got blocked . I need to implement it for 2 viewpagers : 1) one viewpager with multiple views (in my case 2 elements) like in this image http://shashikawlp.files.wordpress.com/2012/12/viewpager2.png?w=614&h=346

2) one viewpager with 1 main view and margins from other views like in this image http://i.stack.imgur.com/ddm1j.jpg

Here is the code i used :

wish_pager_item.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#f1e7dd"
    >
    <ImageView
        android:id="@+id/wish_item_image"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_gravity="center"/>
    <TextView
        android:id="@+id/wish_item_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="15sp"
        android:gravity="center"/>
    <TextView
        android:id="@+id/wish_item_price"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="15sp"
        android:gravity="center"
        android:textColor="#e12f2f"/>
</LinearLayout>

fragment_home.xml

  <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="300dp"
                android:gravity="center"
                android:orientation="vertical"
                >

                <android.support.v4.view.ViewPager
                    android:id="@+id/pager"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_weight="0.75"
                    android:background="#ffffff"
                    android:clipToPadding="false"
                    android:paddingBottom="10dp"
                    />

                <com.viewpagerindicator.CirclePageIndicator

                    android:id="@+id/indicator"
                    android:layout_width="fill_parent"
                    android:layout_height="0dp"
                    android:layout_weight="0.25"
                    app:fillColor="#fed70d" />
            </LinearLayout>

ViewPagerAdapter.java

public class ViewPagerAdapter extends PagerAdapter {
    // Declare Variables
    Context context;
    LayoutInflater inflater;
    ArrayList<WishItem> wishList = new ArrayList<WishItem>();

    public ViewPagerAdapter(Context context, ArrayList<WishItem> wishList) {
        this.context = context;
        this.wishList = wishList;
    }

    @Override
    public int getCount() {
        return wishList.size();
    }

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

    public float getPageWidth(int position)
    {
        return 0.9f;
    }

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

        // Declare Variables
        TextView wishItemName;
        TextView wishItemPrice;
        ImageView wishItemImage;

        inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View itemView = inflater.inflate(R.layout.view_pager_item, container,
                false);

        // Locate the TextViews in viewpager_item.xml
        wishItemPrice= (TextView) itemView.findViewById(R.id.wish_item_price);
        wishItemName= (TextView) itemView.findViewById(R.id.wish_item_name);

        // Capture position and set to the TextViews


        wishItemName.setText(wishList.get(position).getTitle());
        wishItemPrice.setText(Integer.toString(wishList.get(position).getPrice()));
        // Locate the ImageView in viewpager_item.xml

        wishItemImage = (ImageView) itemView.findViewById(R.id.wish_item_image);
        // Capture position and set to the ImageView
        wishItemImage.setImageBitmap(wishList.get(position).getImage());
        // Add viewpager_item.xml to ViewPager
        ((ViewPager) container).addView(itemView);


        return itemView;
    }


    @Override
    public void setPrimaryItem(ViewGroup container, int position, Object object) {

        super.setPrimaryItem(container, position, object);
        if(object instanceof HomeFragment){
            HomeFragment f = (HomeFragment) object;
            View v = f.getView();
            if(v != null){
                v.bringToFront();
            }
        }
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        // Remove viewpager_item.xml from ViewPager
        ((ViewPager) container).removeView((LinearLayout) object);

    }
}

HomeFragment.java

ViewPager viewPager;
    PagerAdapter adapter;
    CirclePageIndicator mIndicator;
    ArrayList<WishItem> viewPagerList = new ArrayList<WishItem>();
    View rootView;

    public HomeFragment() {
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragment_home, container, false);
        ((MainActivity) getActivity()).setSlidintMenuFalse();
        setRetainInstance(true);
        ButterKnife.inject(this, rootView);

 this.rootView = rootView;

  Bitmap wishListItem1 = BitmapFactory.decodeResource(this.getResources(), R.drawable.image_track_phone);
        Bitmap wishListItem2 = BitmapFactory.decodeResource(this.getResources(), R.drawable.image_track_phone);
        viewPagerList.add(new WishItem(wishListItem1, "item1", 500));
        viewPagerList.add(new WishItem(wishListItem2, "item2", 600));
        viewPagerList.add(new WishItem(wishListItem1, "item3", 700));
        viewPagerList.add(new WishItem(wishListItem2, "item4", 800));

     setViewPager();
        setViewPager2();

 return rootView;
    }

 public void setViewPager2() {


        // Locate the ViewPager in viewpager_main.xml
        viewPager = (ViewPager) rootView.findViewById(R.id.pager2);
        // Pass results to ViewPagerAdapter Class
        adapter = new ViewPagerAdapter(getActivity(), viewPagerList);
        // Binds the Adapter to the ViewPager
        viewPager.setAdapter(adapter);
        // ViewPager Indicator
        mIndicator = (CirclePageIndicator) rootView.findViewById(R.id.indicator2);
        mIndicator.setViewPager(viewPager);


    }

    public void setViewPager() {
        // Locate the ViewPager in viewpager_main.xml
        viewPager = (ViewPager) rootView.findViewById(R.id.pager);


        // Pass results to ViewPagerAdapter Class
        adapter = new ViewPagerAdapter(getActivity(), viewPagerList);
        // Binds the Adapter to the ViewPager
        viewPager.setAdapter(adapter);


        // ViewPager Indicator
        mIndicator = (CirclePageIndicator) rootView.findViewById(R.id.indicator);
        mIndicator.setViewPager(viewPager);


    }

How to set setViewPager and setViewPager2 like in those images ???