在fragment中用ViewFlipper做网络图片轮播手动+自动+点击事件

2024-02-02 18:32
文章标签 图片 网络 自动 事件 点击 手动 fragment 中用 轮播 viewflipper

本文主要是介绍在fragment中用ViewFlipper做网络图片轮播手动+自动+点击事件，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

本人刚步入大三，从大二开始自学Android，已经学了一年了，所以我还是个小菜，希望老鸟们勿喷。本博客分享个人开发经验，用于互相交流学习。

由于项目中需要用到图片轮播所以花了一天的时间把它弄了出来，我也是第一次来做，数据缓存还没有做，如有更好的方法请与我分享。（1021766585@qq.com）
先需求分析一下

分析
UI主线程中初始化ViewFlipper
我是在fragment来做的底部导航，所以我的ViewFlipper在fragment中。

public class FragmentHome extends Fragment {private ViewFlipper flipper;private GridView gridView;private List<Map<String, Object>> dataList;private SimpleAdapter sim_adapter;private String url="http://******/microclass/index.php?g=service&m=index&a=index";private Handler handler = new Handler();@Override@Nullablepublic View onCreateView(LayoutInflater inflater,@Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {// TODO Auto-generated method stubView view = inflater.inflate(R.layout.fragment_home,container,false);flipper = (ViewFlipper) view.findViewById(R.id.viewFlipper);new ThreadGetHomeImages(url, handler, flipper, getActivity()).start();return view;}

将接口的URL传递给网络线程获取所有的JSON数据（由于一些安全性问题，不方便将JSON数据完全分享出来）

{"flag":"Success","msg":"\u9996\u9875\u6eda\u52a8\u56fe\u7247","data":[{"slide_name":"\u4e60\u5927\u5927\u7684\u8868\u60c5\u8bf4\u660e\u4e86\u4e00\u5207\uff01","slide_pic":"http:\/\/**********\/microclass\/data\/upload\/20160916\/57dbdacb2e1ff.jpg","slide_url":"http:\/\/**********\/microclass\/index.php?g=&m=article&a=index&id=27"},{"slide_name":"\u5fae\u8bfb\u4e66\uff01","slide_pic":"http:\/\/******\/microclass\/data\/upload\/20160916\/57dbb7cdbc81b.jpg","slide_url":"http:\/\/*******\/microclass\/index.php?g=portal&m=article&a=index&id=26"},{"slide_name":"\u61a7\u61ac\u7684\u7ae5\u5e74","slide_pic":"http:\/\/**********\/microclass\/data\/upload\/20160916\/57dbd6de2036c.jpg","slide_url":"http:\/\/********\/microclass\/index.php?g=portal&m=article&a=index&id=28"}]}
public class ThreadGetHomeImages extends Thread {private String url,str,imageUrl;private ViewFlipper flipper;private List<ImageView> imageViews = new ArrayList<ImageView>();private List<CarouselImage> data;//方便数据的写入和读取private ImageView temp;private Handler handler;private Context context;private TranslateAnimation rightInAnim,leftOutAnim,rightOutAnim,leftInAnim;private float startX;private HttpClient client;public ThreadGetHomeImages(String url,Handler handler,ViewFlipper flipper,Context context) {// TODO Auto-generated constructor stubthis.url = url;this.handler = handler;this.flipper = flipper;this.context = context;}@Overridepublic void run() {// TODO Auto-generated method stubtry {client = new DefaultHttpClient();HttpGet request = new HttpGet(); //用GET方法request.setURI(new URI(url));//设置URLHttpResponse response = client.execute(request);//发送请求返回响应HttpEntity entity = response.getEntity();//获得网页内容实体if(entity != null){str = EntityUtils.toString(entity);//如果不为空就转换成字符串类型Log.i("Json", str);data = parseJson(str);//对获取到的JSON字符串进行解析赋值给List<CarouselImage> datafor(int i = 0; i<data.size();i++){//通过循环将图片的URL数据读取出来imageUrl = data.get(i).getImageUrl();Log.i("ImageUrl", imageUrl+"");temp = new ImageView(context);temp.setImageBitmap(getBitmap(imageUrl));//getbitmap方法获取网络图片temp.setScaleType(ScaleType.CENTER_CROP);//控制图片的显示imageViews.add(temp);//添加到ImageView集合中}}} catch (MalformedURLException e) {// TODO Auto-generated catch blocke.printStackTrace();} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();} catch (URISyntaxException e) {// TODO Auto-generated catch blocke.printStackTrace();}handler.post(new Runnable() {@Overridepublic void run() {// TODO Auto-generated method stubsetVeiwFlipperAnim();//在主线程中更新UI}});super.run();}private List<CarouselImage> parseJson(String json) {List<CarouselImage> items = new ArrayList<CarouselImage>();//new一个CarouselImage集合try {JSONObject object = new JSONObject(json);String state = object.getString("flag");if(state.equals("Success")){JSONArray ImagesData = object.getJSONArray("data");for(int i = 0;i<ImagesData.length();i++){CarouselImage image = new CarouselImage();  JSONObject item = ImagesData.getJSONObject(i);image.setImageName(item.getString("slide_name"));image.setImageUrl(item.getString("slide_pic"));image.setTextUrl(item.getString("slide_url"));Log.i("ImageUrl", item.getString("slide_pic"));items.add(image);}return items;}else{Log.i("STATE", "数据获取失败!!");}} catch (JSONException e) {// TODO Auto-generated catch blocke.printStackTrace();}return null;}public static Bitmap getBitmap(String imageUri) {Log.v("ImageUrl", "getbitmap:" + imageUri);// 显示网络上的图片Bitmap bitmap = null;try {URL myFileUrl = new URL(imageUri);HttpURLConnection conn = (HttpURLConnection) myFileUrl.openConnection();conn.setDoInput(true);conn.connect();InputStream is = conn.getInputStream();bitmap = BitmapFactory.decodeStream(is);is.close();Log.v("download finished", "image download finished." + imageUri);} catch (OutOfMemoryError e) {e.printStackTrace();bitmap = null;} catch (IOException e) {e.printStackTrace();Log.v("getbitmap", "getbitmap bmp fail---");bitmap = null;}return bitmap;}private void setVeiwFlipperAnim() {for(int i =0;i<imageViews.size();i++){flipper.addView(imageViews.get(i));//将之前做好的ImageView集合中的元素逐一添加添加到ViewFlipper中}//设置ViewFlipper的滑动行为的动画// 图片从右侧滑入rightInAnim = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 1.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f);rightInAnim.setDuration(1000);// 图片从左侧滑出leftOutAnim = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, -1.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f);leftOutAnim.setDuration(1000);// 图片从右侧滑出rightOutAnim = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 1.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f);rightOutAnim.setDuration(1000);// 图片从左侧滑入leftInAnim = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, -1.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f);leftInAnim.setDuration(1000);// 正常情况左侧划出，右侧滑入flipper.setOutAnimation(leftOutAnim);flipper.setInAnimation(rightInAnim);flipper.setFlipInterval(5000);//设置自动切换时间flipper.startFlipping();flipper.setOnTouchListener(new OnTouchListener() {@Overridepublic boolean onTouch(View v, MotionEvent event) {// TODO Auto-generated method stubint action = event.getAction();switch (action) {case MotionEvent.ACTION_DOWN:startX = (int) event.getX();//flipper.stopFlipping();// 当手指按下时，停止图片的循环播放。并记录当前x坐标Log.i("count", flipper.getDisplayedChild()+"");break;case MotionEvent.ACTION_MOVE:break;case MotionEvent.ACTION_UP:if (event.getX() - startX > 100) { // 手指向右滑动，左侧滑入，右侧滑出flipper.setInAnimation(leftInAnim);flipper.setOutAnimation(rightOutAnim);flipper.showPrevious();flipper.startFlipping();} else if (startX - event.getX() > 100) {// 手指向左滑动，右侧滑入，左侧滑出flipper.setInAnimation(rightInAnim);flipper.setOutAnimation(leftOutAnim);flipper.showNext();flipper.startFlipping();}else if(startX - event.getX()<10||event.getX()-startX<10){//当左右滑动的坐标差<10时,可以确定为点击动作，解决了OnTouch和OnClick的冲突//Toast.makeText(context, "当前索引"+flipper.getDisplayedChild(), Toast.LENGTH_SHORT).show();data.get(flipper.getDisplayedChild());Intent intent = new Intent();intent.putExtra("titleName",data.get(flipper.getDisplayedChild()).getImageName());//传递文章标题intent.putExtra("textUrl", data.get(flipper.getDisplayedChild()).getTextUrl());//传递文章的URLintent.setClass(context, WebActivity.class);context.startActivity(intent);}break;}//返回false只执行一次监听，返回true会一直进行监听return true;}}); }
}

CarouselImage类

public class CarouselImage {private String imageName;   private String imageUrl;private String textUrl;public String getImageName() {return imageName;}public void setImageName(String imageName) {this.imageName = imageName;}public String getImageUrl() {return imageUrl;}public void setImageUrl(String imageUrl) {this.imageUrl = imageUrl;}public String getTextUrl() {return textUrl;}public void setTextUrl(String textUrl) {this.textUrl = textUrl;}
}

fragment加载的xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginBottom="50dp"android:orientation="vertical"android:weightSum="3" ><ViewFlipper android:id="@+id/viewFlipper"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"></ViewFlipper><GridView android:id="@+id/gridView"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="2"android:layout_marginTop="20dp"android:gravity="center_horizontal"android:numColumns="3"android:stretchMode="columnWidth"></GridView>
</LinearLayout>

贴下图
这里写图片描述

这篇关于在fragment中用ViewFlipper做网络图片轮播手动+自动+点击事件的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/671592。

相关文章

基于Python实现一个图片拆分工具

基于Python实现一个图片拆分工具

《基于Python实现一个图片拆分工具》这篇文章主要为大家详细介绍了如何基于Python实现一个图片拆分工具,可以根据需要的行数和列数进行拆分,感兴趣的小伙伴可以跟随小编一起学习一下... 简单介绍先自己选择输入的图片，默认是输出到项目文件夹中，可以自己选择其他的文件夹，选择需要拆分的行数和列数，可以通过
阅读更多...
SpringBoot+Docker+Graylog 如何让错误自动报警

SpringBoot+Docker+Graylog 如何让错误自动报警

《SpringBoot+Docker+Graylog如何让错误自动报警》SpringBoot默认使用SLF4J与Logback,支持多日志级别和配置方式,可输出到控制台、文件及远程服务器,集成ELK... 目录01 Spring Boot 默认日志框架解析02 Spring Boot 日志级别详解03 Sp
阅读更多...
Linux中压缩、网络传输与系统监控工具的使用完整指南

Linux中压缩、网络传输与系统监控工具的使用完整指南

《Linux中压缩、网络传输与系统监控工具的使用完整指南》在Linux系统管理中,压缩与传输工具是数据备份和远程协作的桥梁,而系统监控工具则是保障服务器稳定运行的眼睛,下面小编就来和大家详细介绍一下它... 目录引言一、压缩与解压：数据存储与传输的优化核心1. zip/unzip：通用压缩格式的便捷操作2.
阅读更多...
浏览器插件cursor实现自动注册、续杯的详细过程

浏览器插件cursor实现自动注册、续杯的详细过程

《浏览器插件cursor实现自动注册、续杯的详细过程》Cursor简易注册助手脚本通过自动化邮箱填写和验证码获取流程,大大简化了Cursor的注册过程,它不仅提高了注册效率,还通过友好的用户界面和详细... 目录前言功能概述使用方法安装脚本使用流程邮箱输入页面验证码页面实战演示技术实现核心功能实现1. 随机
阅读更多...
利用Python脚本实现批量将图片转换为WebP格式

利用Python脚本实现批量将图片转换为WebP格式

《利用Python脚本实现批量将图片转换为WebP格式》Python语言的简洁语法和库支持使其成为图像处理的理想选择,本文将介绍如何利用Python实现批量将图片转换为WebP格式的脚本,WebP作为... 目录简介1. python在图像处理中的应用2. WebP格式的原理和优势2.1 WebP格式与传统
阅读更多...
如何在Mac上彻底删除Edge账户? 手动卸载Edge浏览器并清理残留文件技巧

如何在Mac上彻底删除Edge账户? 手动卸载Edge浏览器并清理残留文件技巧

《如何在Mac上彻底删除Edge账户?手动卸载Edge浏览器并清理残留文件技巧》Mac上的Edge账户里存了不少网站密码和个人信息，结果同事一不小心打开了，简直尴尬到爆炸，想要卸载edge浏览器并清... 如果你遇到 Microsoft Edge 浏览器运行迟缓、频繁崩溃或网页加载异常等问题，可以尝试多种方
阅读更多...
HTML5实现的移动端购物车自动结算功能示例代码

HTML5实现的移动端购物车自动结算功能示例代码

《HTML5实现的移动端购物车自动结算功能示例代码》本文介绍HTML5实现移动端购物车自动结算,通过WebStorage、事件监听、DOM操作等技术,确保实时更新与数据同步,优化性能及无障碍性,提升用... 目录1. 移动端购物车自动结算概述2. 数据存储与状态保存机制2.1 浏览器端的数据存储方式2.1.
阅读更多...
基于 HTML5 Canvas 实现图片旋转与下载功能(完整代码展示)

基于 HTML5 Canvas 实现图片旋转与下载功能(完整代码展示)

《基于HTML5Canvas实现图片旋转与下载功能(完整代码展示)》本文将深入剖析一段基于HTML5Canvas的代码，该代码实现了图片的旋转（90度和180度）以及旋转后图片的下载... 目录一、引言二、html 结构分析三、css 样式分析四、JavaScript 功能实现一、引言在 Web 开发中，
阅读更多...
Python如何去除图片干扰代码示例

Python如何去除图片干扰代码示例

《Python如何去除图片干扰代码示例》图片降噪是一个广泛应用于图像处理的技术,可以提高图像质量和相关应用的效果,：本文主要介绍Python如何去除图片干扰的相关资料,文中通过代码介绍的非常详细,... 目录一、噪声去除1. 高斯噪声（像素值正态分布扰动）2. 椒盐噪声（随机黑白像素点）3. 复杂噪声（如伪
阅读更多...
Python中图片与PDF识别文本(OCR)的全面指南

Python中图片与PDF识别文本(OCR)的全面指南

《Python中图片与PDF识别文本(OCR)的全面指南》在数据爆炸时代,80%的企业数据以非结构化形式存在,其中PDF和图像是最主要的载体,本文将深入探索Python中OCR技术如何将这些数字纸张转... 目录一、OCR技术核心原理二、python图像识别四大工具库1. Pytesseract - 经典O
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2