美文网首页
FlaycoBanner开源图片轮播框架使用,支持android

FlaycoBanner开源图片轮播框架使用,支持android

作者: jjswer | 来源:发表于2017-10-24 12:06 被阅读0次

    git地址:https://github.com/H07000223/FlycoBanner_Master
    导入FlaycoBanner框架依赖:

        compile 'com.flyco.banner:FlycoBanner_Lib:2.0.2@aar'//banner
        compile 'com.nineoldandroids:library:2.4.0'//banner
    

    导入Glide框架依赖:

    compile 'com.github.bumptech.glide:glide:3.7.0'
    

    自定义类SimpleImageBanner继承BaseIndicatorBanner<BannerItem, SimpleImageBanner>:

    public class SimpleImageBanner extends BaseIndicatorBanner<BannerItem, SimpleImageBanner> {
        private ColorDrawable colorDrawable;
    
        public SimpleImageBanner(Context context) {
    
            this(context,null,0);
        }
    
        public SimpleImageBanner(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public SimpleImageBanner(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            colorDrawable = new ColorDrawable(Color.parseColor("#555555"));
        }
    
        @Override
        public void onTitleSlect(TextView tv, int position) {
            BannerItem bannerItem=mDatas.get(position);
            tv.setText(bannerItem.title);
        }
    
        @Override
        public View onCreateItemView(int position) {
            View inflate = View.inflate(mContext, R.layout.layout_banner, null);
            ImageView imageView = ViewFindUtils.find(inflate, R.id.iv);
            Log.i("bannerItem.title", "bannerItem.title: "+imageView);
            BannerItem bannerItem=mDatas.get(position);
            int itemWidth=mDisplayMetrics.widthPixels;
            int itemHight=(int) (itemWidth * 360 * 1.0f / 640);
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setLayoutParams(new LinearLayout.LayoutParams(itemWidth,itemHight));
            String imgUrl=bannerItem.imgUrl;
            if (!TextUtils.isEmpty(imgUrl)){         Glide.with(mContext).load(imgUrl).override(itemWidth,itemHight).centerCrop().placeholder(R.mipmap.ic_launcher).into(imageView);
            }else {
                imageView.setImageDrawable(colorDrawable);
            }
    
            return inflate;
        }
    }
    

    资源类DataProvider:

    public class DataProvider {
        public static String[] titles = new String[]{
                "欢乐颂:五美破案总动员",
                "无心法师:生死离别!月牙遭虐杀",
                "花千骨:尊上沦为花千骨",
                "综艺饭:胖轩偷看夏天洗澡掀波澜",
                "碟中谍4:阿汤哥高塔命悬一线,超越不可能",
        };
        public static String[] urls = new String[]{//640*360 360/640=0.5625
                "http://r2.ykimg.com/050C0000571EB4F867BC3D14E908D907",//"欢乐颂:五美破案总动员"
                "http://photocdn.sohu.com/tvmobilemvms/20150907/144158380433341332.jpg",//无心法师:生死离别!月牙遭虐杀
                "http://photocdn.sohu.com/tvmobilemvms/20150907/144160286644953923.jpg",//花千骨:尊上沦为花千骨
                "http://photocdn.sohu.com/tvmobilemvms/20150902/144115156939164801.jpg",//综艺饭:胖轩偷看夏天洗澡掀波澜
                "http://photocdn.sohu.com/tvmobilemvms/20150907/144159406950245847.jpg",//碟中谍4:阿汤哥高塔命悬一线,超越不可能
        };
        public static ArrayList<BannerItem> getList() {
            ArrayList<BannerItem> list = new ArrayList<>();
            for (int i = 0; i < urls.length; i++) {
                BannerItem item = new BannerItem();
                item.imgUrl = urls[i];
                item.title = titles[i];
                list.add(item);
            }
            return list;
        }
    }
    

    findViewById帮助类ViewFindUtils:

    public class ViewFindUtils
    {
        /**
         * ViewHolder简洁写法,避免适配器中重复定义ViewHolder,减少代码量 用法:
         * 
         * <pre>
         * if (convertView == null)
         * {
         *  convertView = View.inflate(context, R.layout.ad_demo, null);
         * }
         * TextView tv_demo = ViewHolderUtils.get(convertView, R.id.tv_demo);
         * ImageView iv_demo = ViewHolderUtils.get(convertView, R.id.iv_demo);
         * </pre>
         */
        public static <T extends View> T hold(View view, int id)
        {
            SparseArray<View> viewHolder = (SparseArray<View>) view.getTag();
    
            if (viewHolder == null)
            {
                viewHolder = new SparseArray<>();
                view.setTag(viewHolder);
            }
    
            View childView = viewHolder.get(id);
    
            if (childView == null)
            {
                childView = view.findViewById(id);
                viewHolder.put(id, childView);
            }
    
            return (T) childView;
        }
    
        /**
         * 替代findviewById方法
         */
        public static <T extends View> T find(View view, int id)
        {
            return (T) view.findViewById(id);
        }
    }
    

    实体BannerItem:

    public class BannerItem {
        public String imgUrl;
        public String title;
    }
    

    MainActivity:

    public class MainActivity extends AppCompatActivity {
    private ImageView imageView;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main_layout);
            SimpleImageBanner simpleImageBanner= (SimpleImageBanner) findViewById(R.id.ban);
            simpleImageBanner.setSource(DataProvider.getList()).startScroll();
            simpleImageBanner.setOnItemClickL(new BaseBanner.OnItemClickL() {
                @Override
                public void onItemClick(int position) {
                    Toast.makeText(MainActivity.this,"position->"+position,Toast.LENGTH_SHORT).show();
                }
            });
        }
    }
    

    主布局文件main_layout:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
       <include layout="@layout/layout_simpbanner"/>
    </LinearLayout>
    

    轮播图中的imageview:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"/>
    </LinearLayout>
    

    轮播SimpleImageBanner:

    <com.cutv.myflaycobanner.SimpleImageBanner xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:banner="http://schemas.android.com/apk/res-auto"
        android:id="@+id/ban"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        banner:bb_barColor="#88000000"
        banner:bb_barPaddingBottom="5dp"
        banner:bb_barPaddingLeft="10dp"
        banner:bb_barPaddingRight="10dp"
        banner:bb_barPaddingTop="5dp"
        banner:bb_delay="5"
        banner:bb_indicatorCornerRadius="3dp"         //指示器圆点半径
        banner:bb_indicatorGap="8dp"                        //两个指标之间的差距,dp,默认的6dp
        banner:bb_indicatorGravity="RIGHT"              //指示器位置
        banner:bb_indicatorHeight="5dp"
        banner:bb_indicatorSelectColor="#07a7e1"
        banner:bb_indicatorStyle="CORNER_RECTANGLE"         //指示器样式:矩形
        banner:bb_indicatorUnselectColor="#88ffffff"
        banner:bb_indicatorWidth="5dp"
        banner:bb_isAutoScrollEnable="true"
        banner:bb_isBarShowWhenLast="true"                            //当位置是最后的时候,设置底部的栏显示
        banner:bb_isIndicatorShow="true"
        banner:bb_isLoopEnable="true"                                   //是否为LoopViewPager,默认为true
        banner:bb_isTitleShow="true"                                       //设置标题显示或不显示,默认为true
        banner:bb_period="5"                                                    //滚动周期,单位秒,默认5秒
        banner:bb_scale="0.5"                                                  //横幅高度和宽度,高度/屏幕宽度
        banner:bb_textColor="#ffffff"
        banner:bb_textSize="13.5sp" />
    

    相关文章

      网友评论

          本文标题:FlaycoBanner开源图片轮播框架使用,支持android

          本文链接:https://www.haomeiwen.com/subject/plvwyxtx.html