使用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的旋转木马效果请求图片的更多相关文章

  1. 原生JS实现"旋转木马"效果的图片轮播插件

    一.写在最前面 最近都忙一些杂七杂八的事情,复习软考.研读经典...好像都好久没写过博客了... 我自己写过三个图片轮播,一个是简单的原生JS实现的,没有什么动画效果的,一个是结合JQuery实现的, ...

  2. jQuery旋转木马仿3D效果的图片切换特效代码

    用jQuery实现的一款仿3D效果的图片切换特效代码,类似旋转木马一样,幻灯图片以三维视觉上下滑动切换,效果很酷炫,兼容IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜 ...

  3. OC基础之推荐一个旋转木马(跑马灯)效果的图片展示Demo

    这个旋转木马(跑马灯)效果的图片展示Demo,包括设定旋转方向,图片倒影,背景设置,旋转速度,开始结束,点击显示选中的图片,彩色的块展示等等功能 效果图:(源码下载:https://github.co ...

  4. 利用CSS3D效果制作简易旋转木马效果

    最近看一下css3d的一些特性,想着也实验学习一下,制作个小demo之类的.就练习了一下.开发一个粗糙的选择木马效果,如图 其实就是找到角度和位置,计算每根柱子的旋转角度摆放到3d空间的置顶位置即可. ...

  5. Volley该框架使用了大量的请求图片

    尊重原创 http://write.blog.csdn.net/postedit/26142025 代码下载:http://download.csdn.net/detail/yuanzeyao2008 ...

  6. Android UI - 实现广告Banner旋转木马效果

    Android UI - 实现广告Banner旋转木马效果 前言 本篇博客要分享的一个效果是实现广告Banner轮播效果,这个效果也比較常见,一些视频类应用就常常有,就拿360影视大全来举例吧: 用红 ...

  7. HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相册

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/32964301 首先说明一下创意的出处:http://www.zhangxinxu ...

  8. HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相冊

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/32964301 首先说明一下创意的出处:http://www.zhangxinxu ...

  9. 用jQuery实现旋转木马效果(带前后按钮和索引按钮)

    项目中要用到旋转木马效果,一共5张图片轮播,并且点击对应的索引按钮能切换到对应的图片.本效果实在jquery.carousel.js插件的基础上做了一些改进,以实现上述需求. 效果图如下: 代码: H ...

随机推荐

  1. split使用和特殊使用(包括截取第一个字符后的数据)

    javaScript中关于split()的使用 1.一般使用对一个字符串使用split(),返回一个数组 例子:   var testArr = "1,2,3,4,5": var ...

  2. ubuntu16.04下ftp服务器的安装与配置

    由于要将本地程序上传至云服务器中,所以需要给云服务器端安装ftp服务器.记录一下ftp的安装过程,以便以后使用.服务器端所用系统为Ubuntu16.04. 1. 安装ftp服务器, apt-get i ...

  3. WPF中使用Grid来实现图层的效果

    <Style x:Key="ScanButtonStyle" TargetType="{x:Type Button}"> <!--<Se ...

  4. Node.js之Console用法小结

    /** * Created by city--online on 16/3/9. */ //console.time()和console.timeEnd()输出中间代码的执行时间(注意:time和ti ...

  5. Spring.Net---1、IOC第一个实例

    Spring.NET IoC容器的用法. 通过简单的例子学习Spring.Net 1.先创建一个控制台程序项目. 2.添加IUserInfoDal 接口. namespace Spring.Net { ...

  6. swagger api文档添加jwt授权配置

    最近写的swagger文档,要加jwt授权,所以几经google终于搞定了,简简单单几行配置如下: securityDefinitions: APIKey: type: apiKey name: Au ...

  7. 【转】Java Spring AOP详解

    一.前言 在以前的项目中,很少去关注spring aop的具体实现与理论,只是简单了解了一下什么是aop具体怎么用,看到了一篇博文写得还不错,就转载来学习一下,博文地址:http://www.cnbl ...

  8. [javaSE] GUI(练习-列出指定目录内容)

    获取Frame对象 获取TextField对象 获取TextArea对象 获取Button对象 调用Frame对象的add()方法,添加进去 调用TextField对象的getText()方法,可以获 ...

  9. JS 监听键盘按键

    1. 实现Ctrl+ Enter 组合键触发事件 document.onkeydown=function(event){ var keyNum = window.event ? event.keyCo ...

  10. groovy实现循环、交换变量、多赋值、?.运算符

    /** * Created by Jxy on 2019/1/3 10:01 * 1.实现循环的方式 * 2.安全导航操作符---?. * 3.一次性赋值给多个变量 */ 0.upto(2){ pri ...