Android - Netflix like Swipe-able Banner (Spotlight)

   Netflix's Android application features a spotlight which has a swipe-able banner view recommending few movies. This could be implemented via a android's ViewPager API and open source Circular Page Indicator.



  The pager adapter returns the set of ImageViews and ViewPager invokes adapter APIs based on the user swipe action. A simple adapter looks like,

private static class BannerAdapter extends PagerAdapter {

        private Map<Integer, ImageView> mBannerImageMap = new HashMap<Integer, ImageView>();

        public BannerAdapter(Context context) {
            ImageView image1 = new ImageView(context);
            image1.setImageResource(R.drawable.beach);

            ImageView image2 = new ImageView(context);
            image2.setImageResource(R.drawable.northstar);

            ImageView image3 = new ImageView(context);
            image3.setImageResource(R.drawable.lake_tahoe);
            
            mBannerImageMap.put(new Integer(0), image1);
            mBannerImageMap.put(new Integer(1), image2);
            mBannerImageMap.put(new Integer(2), image3);
        }

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

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

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            ImageView imageView = mBannerImageMap.get(new Integer(position));
            container.addView(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            ImageView imageView = mBannerImageMap.get(new Integer(position));
            container.removeView(imageView);
        }
    }


    private void setBannerView() {
        ViewPager pager = (ViewPager) findViewById(R.id.view_pager);
        pager.setAdapter(new BannerAdapter(this));
    }

  Applications having many set of banner views or each with multiple Images could implement their own caching logic in the PagerAdapter.

No comments: