Android_实现图片轮播

Banner 开源地址:https://github.com/youth5201314/banner

图片加载框架Glide开源地址:https://github.com/bumptech/glide  

 使用第三方控件banner实现图片轮播,这里是根据服务端来获取图片信息的,我的图片是放在服务端中的这个路径内ShoppingService\ShoppingService的文件夹中(要新建文件夹)。首先在数据库录入轮播的图片信息,然后新建一个实体类RotationVo,最后在服务端中查询轮播信息(服务端是MVC写的)。下列就是服务端代码

public ActionResult GetBannerInfo()
{   //查询轮播列表
    List rotation = (from taRataion in myModels.Rotation
                                 where taRataion.IsEffective == true && taRataion.IsShow == true
                                 select new RotationVo
                                 {
                                   RotationID = taRataion.RotationID,
                                   Title=taRataion.Title,
                                   Picture=taRataion.Picture,
                                   Link=taRataion.Link,
                                   IsShow=taRataion.IsShow,
                                   IsEffective=taRataion.IsEffective
                                  }).ToList();
    return Content(JsonConvert.SerializeObject(rotation,Formatting.Indented,timeConverter));
 }

以上就是服务端内容,下面就是App端实现代码。首先在build.gradle中加上下面的两个控件,然后同步一下。

glide图片加载框架:implementation 'com.github.bumptech.glide:glide:4.11.0'

开源轮播控件 :implementation 'com.youth.banner:banner:2.0.7'

第二就是添加权限<uses-permission android:name="android.permission.INTERNET"/>到AndroidManifest.xml中

第三在布局页面添加Banner

<com.youth.banner.Banner
    android:id="@+id/banner_home_Carousel"
    android:layout_width="match_parent"
    android:layout_height="140dp" />(高度自己设置)

第四创建一个Adapter文件,我创建了一个HomeRotationAdapter.java,以下就是Adapter中的内容。

public class HomeRotationAdapter extends BannerAdapter {
    private Context context;
    //构造函数  传递数据到适配器
    public HomeRotationAdapter(List mDatas,Context context){
        //设置数据,也可以调用banner提供的方法,或者自己在adapter中实现
        super(mDatas);
        this.context=context;
    }
    //创建ViewHolder,可以用viewType这个字段来区分不同的ViewHolder
    @Override
    public BannerViewHolder onCreateHolder(ViewGroup parent, int viewType) {
        ImageView imageView=new ImageView(parent.getContext());
        //注意,必须设置为match_parent,这个是viewpager2强制要求的
        imageView.setLayoutParams(new ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT));
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        return new BannerViewHolder(imageView);
    }
    @Override
    public void onBindView(BannerViewHolder holder, RotationBean data, int position, int size) {
        String imageUrl= ServiceUrls.getMainPageBannerImgUrl(data.getPicture());
        //使用Glide加载图片 最简单的用户
        Glide.with(context)
                .load(imageUrl)
                .into(holder.imageView);
    }
     class BannerViewHolder extends RecyclerView.ViewHolder{
         ImageView imageView;
         public BannerViewHolder(@NonNull ImageView view) {
             super(view);
             this.imageView = view;
         }
    }
}

第五Banner具体方法调用,以下的bannerCarousel控件是,在上面的onCreateView中获取的控件,mActivityContext可在下图中查看

Android_实现图片轮播_第1张图片

private void initView() {
     String url = ServiceUrls.getMainPageMethodUrl("GetBannerInfo");//获取轮播信息
    //发送请求
    OkHttpTool.httpPost(url, null, new OkHttpTool.ResponseCallback() {
        @Override
        public void onResponse(boolean isSuccess, int responseCode, String response, Exception exception) {
            //需要在UI线程这更新UI
            mActivityContext.runOnUiThread(new Runnable() {
                @Override
                public void run() {
                    if (isSuccess && responseCode == 200 && Tools.isNotNull(response)) {
                        //对json数据反序列化
                        Type type = new TypeToken>() {}.getType();
                        List rotationList = gson.fromJson(response, type);
                        //初始化轮播
                        bannerCarousel.setAdapter(new HomeRotationAdapter(rotationList, mActivityContext))
                                .setIndicator(new CircleIndicator(mActivityContext))//设置指示器
                                .setIndicatorSelectedColorRes(R.color.colorPrimary)//设置当前轮播指示器的颜色
                                .isAutoLoop(true)//允许自动轮播
                                .setDelayTime(10 * 1000)//设置轮播切换间隔
                                //设置轮播点击事件
                                .setOnBannerListener(new OnBannerListener() {
                                    @Override
                                    public void OnBannerClick(Object data, int position) {
                                        //参数:轮播绑定的数据,轮播图片的索引
                                        RotationBean rotationBean = (RotationBean) data;
                                        int rotationId = rotationBean.getRotationId();
                                        Toast.makeText(mActivityContext, String.valueOf(rotationId), Toast.LENGTH_SHORT).show();
                                    }
                                })
                                .start();
                    }
                    Toast.makeText(mActivityContext, "轮播加载失败", Toast.LENGTH_SHORT).show();
                }
            });
        }
    });
}

 

 

你可能感兴趣的:(android)