UPCardsCarousel

UPCardsCarousel is a carousel with a cards based UI for iOS.

UPCardsCarousel是一个旋转木马效果的UI控件.

UPCardsCarousel

Requirements

UPCardsCarousel uses ARC and requires iOS 7.0+.

需要ARC,iSO7.0以上.

Works for iPhone.

只针对iPhone开发.

Installation

CocoaPods

UPCardsCarousel is available through CocoaPods. To install it, simply add the following line to your Podfile:

你可以通过 CocoaPods 来安装.执行以下一段话即可.

pod "UPCardsCarousel"

Manual

Simply copy the folder UPCardsCarousel to your project and import it in XCode.

你只需要将UPCardsCarousel文件夹复制到你的项目中即可.

Usage

Start by importing the header file:

一开始,先引入头文件:

#import "UPCardsCarousel.h"

Now, you can create a UPCardsCarousel object by giving it a frame:

然后,你可以创建出UPCardsCarousel实体,然后给定一个frame值:

UPCardsCarousel *carousel = [[UPCardsCarousel alloc] initWithFrame:aFrame];

Then you need to assign to it:

之后,你需要设定代理以及给代理提供数据:

  • delegate object that conforms to the UPCardsCarouselDelegate protocol
  • dataSource object that conforms to the UPCardsCarouselDataSource protocol

Data Source

The data source informs the carousel about the total number of cards and the content of each card through two self-explanatory methods:

数据源是给carousel提供有多少张卡片,以及每张图片上面的内容:

  • - (NSUInteger)numberOfCardsInCarousel:(UPCardsCarousel *)carousel (required)
  • - (UIView *)carousel:(UPCardsCarousel *)carousel viewForCardAtIndex:(NSUInteger)index (required)

The labels in the banner are given with an optional method. If the data source doesn't implement this method, the label banner will not be displayed.

以下方法是可选方法,用来给卡片提供标题的,如果没有实现,默认是不会显示出来的.

  • - (NSString *)carousel:(UPCardsCarousel *)carousel labelForCardAtIndex:(NSUInteger)index (optional)

Delegate

The delegate is optional and will be notified when some events occur:

代理方法是非必须的,用以提示事件发生的时机:

  • - (void)carousel:(UPCardsCarousel *)carousel didTouchCardAtIndex:(NSUInteger)index
  • - (void)carousel:(UPCardsCarousel *)carousel willDisplayCardAtIndex:(NSUInteger)index
  • - (void)carousel:(UPCardsCarousel *)carousel willHideCardAtIndex:(NSUInteger)index
  • - (void)carousel:(UPCardsCarousel *)carousel didDisplayCardAtIndex:(NSUInteger)index
  • - (void)carousel:(UPCardsCarousel *)carousel didHideCardAtIndex:(NSUInteger)index

Methods

Method Description
reloadData Reloads the carousel data and recreates the visible cards and moves to the top of the cards deck
reloadDataWithCurrentIndex:(NSUInteger)index Reloads the carousel data and recreates the visible cards and moves to the specified index in the cards deck
reloadNumberOfCards Reloads only the number of cards in the carousel and doesn't change the visible cards
reloadCardAtIndex:(NSUInteger)index Recreates the card at the specified index
cardAtIndex:(NSUInteger)index Return the card view at the specified index

Customization

Cards Deck

Usually, the carousel will not display all the cards supplied by the data source at once. It will handle a infinite scrolling process by destroying and creating cards at both ends. The number of visible cards is given and can be customized through the following property:

通常情况下,carousel不会一下子显示出所有的图片.他有重用机制,并支持无限滑滚.可见的卡片数由以下方法提供:

  • maxVisibleCardsCount (default is 6)

You can customize the duration of the card movement between the hidden deck and the visible deck, with this property:

你可以定制每张卡片的移动时间,默认是0.4秒:

  • movingAnimationDuration (defaut is 0.4 seconds)

By default, the carousel will return to the top of the deck when making a double-tap on the first hidden card.

默认情况下,双击carousel会返回第一张显示的图片.

You can disable this behaviour by setting the doubleTapToTop property to NO.

你可以禁用双击功能.

Labels Banner

You can customize the text font and color of the banner through these two methods:

你可以通过以下两个方法来定制横幅:

  • - (void)setLabelFont:(UIFont *)font (default is system font)
  • - (void)setLabelTextColor:(UIColor*)color (default is [UIColor blackColor])

You can choose between two locations for the banner through the labelBannerPosition property:

你可以通过labelBannerPosition属性来设置位移值:

  • UPCardsCarouselLabelBannerLocation_bottom - the banner will be located below the cards deck (default)
  • UPCardsCarouselLabelBannerLocation_top - the banner will be located above the cards deck

Finally, you also have access to the banner view object through the labelBanner property so you can customize it as you want.

当然,你也可以写你自己的横幅view.给labelBanner赋值即可.

License

The MIT License (MIT)

Copyright (c) 2014 Paul Ulric

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

[翻译] UPCardsCarousel的更多相关文章

  1. 《Django By Example》第五章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者@ucag注:大家好,我是新来的翻译, ...

  2. 《Django By Example》第四章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:祝大家新年快乐,这次带来<D ...

  3. [翻译]开发文档:android Bitmap的高效使用

    内容概述 本文内容来自开发文档"Traning > Displaying Bitmaps Efficiently",包括大尺寸Bitmap的高效加载,图片的异步加载和数据缓存 ...

  4. 【探索】机器指令翻译成 JavaScript

    前言 前些时候研究脚本混淆时,打算先学一些「程序流程」相关的概念.为了不因太枯燥而放弃,决定想一个有趣的案例,可以边探索边学. 于是想了一个话题:尝试将机器指令 1:1 翻译 成 JavaScript ...

  5. 《Django By Example》第三章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:第三章滚烫出炉,大家请不要吐槽文中 ...

  6. 《Django By Example》第二章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:翻译完第一章后,发现翻译第二章的速 ...

  7. 《Django By Example》第一章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:本人目前在杭州某家互联网公司工作, ...

  8. 【翻译】Awesome R资源大全中文版来了,全球最火的R工具包一网打尽,超过300+工具,还在等什么?

    0.前言 虽然很早就知道R被微软收购,也很早知道R在统计分析处理方面很强大,开始一直没有行动过...直到 直到12月初在微软技术大会,看到我软的工程师演示R的使用,我就震惊了,然后最近在网上到处了解和 ...

  9. ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第一章:创建基本的MVC Web站点

    在这一章中,我们将学习如何使用基架快速搭建和运行一个简单的Microsoft ASP.NET MVC Web站点.在我们马上投入学习和编码之前,我们首先了解一些有关ASP.NET MVC和Entity ...

随机推荐

  1. windows下安装并使用redis

    一.安装前首先了解一下phpinfo里面的一些信息,能否正确安装非常有帮助. (下图是我的本机环境) compiler :编译器 Architecture :CPU架构 Configuration F ...

  2. 微服务Kong(十)——负载均衡参考

    KONG为请求多个后端服务提供了多种负载均衡方案:一种是简单的基于DNS,另一种是更加动态的环形均衡器,他在不需要DNS服务器的情况下也允许服务注册. 一.基于DNS的负载均衡 当使用基于DNS的负载 ...

  3. jQuery 1.9/2.0/2.1及其以上 on 无效的解决办法

    jQuery 1.9/2.0/2.1及其以上版本无法使用live函数了,然而jQuery 1.9及其以上版本提供了on函数来代替.本文讲解了jQuery on函数的使用方法,以及在使用jQuery函数 ...

  4. activemq控制面板含义

    Name 消息队列的名称 Number Of Pending Messages 等待消费的消息数量,即未出队列的消息数量.可以理解为总接收数-总出队列数 (未持久化的话,重启acmq后会清零) Num ...

  5. asp查找</td>标记时遇到以外的文件结尾

    正确的<td></td> 错误的<td> 没有写完整

  6. Springboot --- Spring Security (一)

      文章部分图片来自参考资料 问题 : Spring Security 内部实现的原理是什么 概述 Spring Security 是个安全框架,可以提供认证,防止网络功能等功能,可以结合 sprin ...

  7. 动态计算area位置

    window.onresize = adjuest; function adjuest(){ var picw = $(".imgbox img").width(); var pi ...

  8. 通过UA判断,对滚动条样式进行不同的操作

    浏览器滚动条的默认样式比较丑,有些情况下,又不能直接overflow:hidden掉. 本文阐述如何通过 document.styleSheets[0].insertRule 简单的实现pc端和移动端 ...

  9. [微信小程序]微信开发工具出现 1not found 编译 .wxss文件信息错误怎么办?

    错误代码: "1not found 编译 .wxss文件信息错误",如 下图 出现场景: 1.一般出现在安装新版本之后出现的状况,可能由于版本之间的兼容导致 解决办法: 1.重装整 ...

  10. VMware安装vnwaretools

    1. 在VMware Fusion 6.0.4下安装Ubuntu镜像:ubuntu-14.04.1-desktop-amd64.iso 2. 点击虚拟机菜单栏-安装VMware Tools 3. 进入 ...