使用iCarousel的旋转木马效果请求图片
使用iCarousel的旋转木马效果请求图片
https://github.com/nicklockwood/iCarousel
先看看效果:
源码如下:
//
// RootViewController.m
//
// Created by YouXianMing on 14-5-16.
// Copyright (c) 2014年 Y.X. All rights reserved.
// #import "RootViewController.h"
#import "iCarousel.h"
#import "YXJSON.h"
#import "YXGCD.h"
#import "SDWebImage.h" // 数据源
#define SOURCE_DATA @"http://www.duitang.com/album/1733789/masn/p/0/50/" @interface RootViewController ()<iCarouselDataSource, iCarouselDelegate> @property (nonatomic, strong) iCarousel *carousel; // iCarousel
@property (nonatomic, strong) NSMutableArray *dataArray; // 数据源 @end @implementation RootViewController - (void)viewDidLoad
{
[super viewDidLoad]; // 初始化数据源
_dataArray = [[NSMutableArray alloc] init]; // 初始化iCarousel
self.carousel = [[iCarousel alloc] initWithFrame:self.view.bounds];
[self.view addSubview:_carousel];
_carousel.backgroundColor = [UIColor blackColor];
_carousel.type = iCarouselTypeWheel; // 设置代理
self.carousel.delegate = self;
self.carousel.dataSource = self; // 异步加载数据
[[GCDQueue globalQueue] execute:^{
// 获取json数据
NSData *data = [[NSData alloc] initWithContentsOfURL:[NSURL URLWithString:SOURCE_DATA]]; // 转换为字典
NSDictionary *dataDic = [YXJSON dictionaryOrArrayWithJSONSData:data];
if (dataDic)
{
NSArray *dataArray = dataDic[@"data"][@"blogs"];
for (NSDictionary *dic in dataArray)
{
NSLog(@"%@", dic[@"isrc"]); // 存储数据
[_dataArray addObject:dic[@"isrc"]];
}
} // 主线程更新
[[GCDQueue mainQueue] execute:^{ // 重新加载carousel
[_carousel reloadData];
}];
}];
} #pragma mark -
#pragma mark iCarousel methods
- (NSUInteger)numberOfItemsInCarousel:(iCarousel *)carousel
{
// 元素个数
return [_dataArray count];
} - (UIView *)carousel:(iCarousel *)carousel
viewForItemAtIndex:(NSUInteger)index // view的标志
reusingView:(UIView *)view // 重用的view
{
if (view == nil)
{
view = [[UIImageView alloc] initWithFrame:CGRectMake(, , 300.0f, 400.0f)];
} // 强行转换指针
UIImageView *pointView = (UIImageView *)view; // 使用SDWebImage异步下载图片
[pointView setImageWithURL:[NSURL URLWithString:_dataArray[index]]]; // 图片自动适应
pointView.contentMode = UIViewContentModeScaleAspectFit; return view;
} - (CGFloat)carousel:(iCarousel *)carousel
valueForOption:(iCarouselOption)option
withDefault:(CGFloat)value
{
if (option == iCarouselOptionSpacing)
{
return value * 1.1f;
} return value;
} @end
RootViewController.m
以下几个地方使用了本人自己封装的类,不开源,看官请自行替换相关方法-_-!
核心的地方如下:
so easy :)
问:如何实现view的点击事件?
实现协议方法 - (void)carousel:(iCarousel *)carousel didSelectItemAtIndex:(NSInteger)index; 即可
问:如何获取偏移量?
实现协议,然后如下使用
- (void)carouselDidScroll:(iCarousel *)carousel
{
NSLog(@"scrollOffset %f", carousel.scrollOffset);
}
使用iCarousel的旋转木马效果请求图片的更多相关文章
- 原生JS实现"旋转木马"效果的图片轮播插件
一.写在最前面 最近都忙一些杂七杂八的事情,复习软考.研读经典...好像都好久没写过博客了... 我自己写过三个图片轮播,一个是简单的原生JS实现的,没有什么动画效果的,一个是结合JQuery实现的, ...
- jQuery旋转木马仿3D效果的图片切换特效代码
用jQuery实现的一款仿3D效果的图片切换特效代码,类似旋转木马一样,幻灯图片以三维视觉上下滑动切换,效果很酷炫,兼容IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜 ...
- OC基础之推荐一个旋转木马(跑马灯)效果的图片展示Demo
这个旋转木马(跑马灯)效果的图片展示Demo,包括设定旋转方向,图片倒影,背景设置,旋转速度,开始结束,点击显示选中的图片,彩色的块展示等等功能 效果图:(源码下载:https://github.co ...
- 利用CSS3D效果制作简易旋转木马效果
最近看一下css3d的一些特性,想着也实验学习一下,制作个小demo之类的.就练习了一下.开发一个粗糙的选择木马效果,如图 其实就是找到角度和位置,计算每根柱子的旋转角度摆放到3d空间的置顶位置即可. ...
- Volley该框架使用了大量的请求图片
尊重原创 http://write.blog.csdn.net/postedit/26142025 代码下载:http://download.csdn.net/detail/yuanzeyao2008 ...
- Android UI - 实现广告Banner旋转木马效果
Android UI - 实现广告Banner旋转木马效果 前言 本篇博客要分享的一个效果是实现广告Banner轮播效果,这个效果也比較常见,一些视频类应用就常常有,就拿360影视大全来举例吧: 用红 ...
- HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相册
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/32964301 首先说明一下创意的出处:http://www.zhangxinxu ...
- HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相冊
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/32964301 首先说明一下创意的出处:http://www.zhangxinxu ...
- 用jQuery实现旋转木马效果(带前后按钮和索引按钮)
项目中要用到旋转木马效果,一共5张图片轮播,并且点击对应的索引按钮能切换到对应的图片.本效果实在jquery.carousel.js插件的基础上做了一些改进,以实现上述需求. 效果图如下: 代码: H ...
随机推荐
- Hibernate5.1+Sqlserver2000分页查询
前几天改到一个bug:从MS SQLserver上面同步表结构并且采集数据写入其他库.然后用的核心技术是用的Hibernate. 其中bug出在SQLServer2000版本上.排查下来发现2000版 ...
- Linux系统快速查找文件
有时候下载新的文件或安装新的包 但是却搞不清默认放在哪个目录了,这个时候可以使用locate命令进行快速模糊查找 比如我使用 go get github.com/coreos/bbolt/... 在一 ...
- ognl,jstl,struts2标签中符号#,$,%的用法
STRUTS2标签操作Map <s:iterator value="sundayMap"> <td colspan="7" ...
- Go RabbitMQ 工作队列 (二)
rabbitMQ工作队列 在之前内容中我们通过一个队列实现了消息的发送跟接收.接下来我们创建工作队列(Work Queue),用于在多个工作者之间分配耗时的任务 工作队列(任务队列)背后的核心主要是避 ...
- JavaScript自动化构建工具grunt、gulp、webpack介绍
前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...
- vue2.0读书笔记1-基础
一.概述 二.模版语法 三.计算属性 四.class与style绑定 五.条件渲染 六.列表渲染 七.事件处理器 八.表单控件绑定 九.组件 一.概述 在底层的实现上, Vue 将模板编译成虚 ...
- Tomcat源码分析——请求原理分析(下)
前言 本文继续讲解TOMCAT的请求原理分析,建议朋友们阅读本文时首先阅读过<TOMCAT源码分析——请求原理分析(上)>和<TOMCAT源码分析——请求原理分析(中)>.在& ...
- nginx 配置 单页面应用的解决方案
server { listen 80; server_name example.com; root /var/www/example.com; gzip_static on; location / ...
- echart.js 参数解释
Data参数 获取容器对象 var canvas = document.getElementById("myCanvas"); 渲染 var ctx = canvas.getCon ...
- SQL SERVER2014的安装
sqlserver2014安装 启动安装程序 下载sqlserver2014,双击startup.exe进行安装 系统配置检查器 使用系统配置检查器,看系统是否符合安装sqlserver2014的所有 ...