How to design a slider view like the one as described in image and pass image from URL

Question

I am designing a user interface or say a view.

What approach should I use to design a sliding user interface the one as shown in the image?

EDITED: 25 AUGUST 2017

I am not aware of different views that can be used in creating the UI as shown in the image. So it will be helpful if some one tell me which view or view group should I used to obtain the same results and Also how can I render image from a URL

you can use horizontal listview for this. check [this](https://github.com/sephiroth74/HorizontalVariableListView). — Shvet, Jun 27 '15 at 14:17
can i use ViewPager rather than HorizontalScrollView to achieve the same — Shubham AgaRwal, Jun 29 '15 at 09:53

score 3 · Answer 1 · answered Jun 27 '15 at 14:19

I did something similar like this:

<HorizontalScrollView
            android:id="@+id/about_images_container_scroll"
            android:layout_width="match_parent"
            android:scrollbars="none"
            android:layout_height="115dp">
            <LinearLayout
                android:id="@+id/about_images_container"
                android:layout_width="fill_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">
                </LinearLayout>
        </HorizontalScrollView>

An the java to each items.

private void addImages()
{
   imagesScroll = (LinearLayout) findViewById(R.id.about_images_container);
   imagesScroll.removeAllViews();
   LinearLayout.LayoutParams layoutParams1 = new LinearLayout.LayoutParams(
            CONSTANT_WIDTH,
            ViewGroup.LayoutParams.MATCH_PARENT);
    View aSep = new View(getBaseContext());
    aSep.setLayoutParams(layoutParams1);
    LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
            width,
            ViewGroup.LayoutParams.MATCH_PARENT);
    for (int i = imageList.size()-1 ; i >= 0  ; i--)
    {
        ImageView firstImage = new ImageView(this);
        firstImage.setLayoutParams(layoutParams);
        int imageResource = getResources().getIdentifier("drawable"+"/"+imageList.get(i),null,getPackageName());
        firstImage.setImageResource(imageResource);
        imagesScroll.addView(firstImage);
    }
}

can't i use ViewPager rather than HorizontalScrollView to achieve the same — Shubham AgaRwal, Jun 29 '15 at 09:53

score 0 · Accepted Answer · answered Jun 29 '15 at 11:03

By using viewpager i have done this. It works well.

here are some code snippets

Initialization

    LayoutInflater flater = (LayoutInflater) LayoutInflater.from(this);
    view1 = flater.inflate(R.layout.view_1, null);
    view2 = flater.inflate(R.layout.view_2, null);
    view3 = flater.inflate(R.layout.view_3, null);

    viewList = new ArrayList<View>();
    viewList.add(view1);
    viewList.add(view2);
    viewList.add(view3);

    pagerAdapter = new MyViewPagerAdapter(viewList);

    viewPager = (ViewPager) findViewById(R.id.search_viewpager);
    viewPager.setAdapter(pagerAdapter);
    viewPager.setCurrentItem(0);

    viewPager.setOnPageChangeListener(new MyOnPageChangeListener());

INSIDE XML

    <android.support.v4.view.ViewPager  
        android:id="@+id/search_viewpager"  
        android:layout_width="wrap_content"  
        android:layout_height="200dp"  
        android:layout_gravity="center"  
        android:layout_weight="1.0"  
        android:background="#000000"  
        android:flipInterval="30"  
        android:persistentDrawingCache="animation" >

How to design a slider view like the one as described in image and pass image from URL

2 Answers2