轮播器

全功能智能图片轮播器——支持多格式导入/自定义尺寸/顺序控制/响应式布局的专业级可视化播放系统 这里提供一个优化后的可执行轮播方案,支持文件选择、自定义尺寸和播放控制等功能:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>高级图片轮播器</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <style> * { margin: 0; padding: 0; box-sizing: border-box; } #c 阅读详情

1. .h

#import <UIKit/UIKit.h>

typedef void(^ClickImageBlock)(NSInteger currentIndex);


@interface LoopScrollView : UIView

- (instancetype)initWithFrame:(CGRect)frame imageArray:(NSArray *)imageArray clickImage:(ClickImageBlock)clickImageBlock;

- (void)invalidateTimer;

@end


2. .m

//

//  LoopScrollView.m

//  轮播器

//

//  Created by 李文良 on 2017/4/20.

//  Copyright © 2017年 王新伟. All rights reserved.

//

#define kWidth  self.frame.size.width

#define kHeight self.frame.size.height

#define kImageCount  3


#import "LoopScrollView.h"

#import "Masonry.h"

#import "UIImageView+WebCache.h"

@interface LoopScrollView()<UIScrollViewDelegate>

/**

 *滚动视图的控件

 */

@property(nonatomic,strong)UIScrollView* scroll;

/**

 *页码指示视图的控件

 */

@property(nonatomic,strong)UIPageControl* pageControl;

/**

 *显示左边图片的控件

 */

@property(nonatomic,strong)UIImageView* LeftImageView;

/**

 *显示中心图片的控件

 */

@property(nonatomic,strong)UIImageView* centerImageView;

/**

 *显示右边图片的控件

 */

@property(nonatomic,strong)UIImageView* rightImageView;

/**

 *保存图片的数组

 */

@property(nonatomic,strong)NSArray* imageArray;

/**

 *图片的当前下标索引

 */

@property(nonatomic,assign)NSInteger  currentIndex;

/**

 *图片总数

 */

@property(nonatomic,assign)NSInteger imageCount;


@property(nonatomic,strong)NSTimer *timer;


@property(nonatomic,copy)ClickImageBlock clickImageBlock;


@property(nonatomic,strong)UITapGestureRecognizer *tap;


@end

@implementation LoopScrollView


- (instancetype)initWithFrame:(CGRect)frame imageArray:(NSArray *)imageArray clickImage:(ClickImageBlock)clickImageBlock

{

    self.imageArray = imageArray;

    self.imageCount = imageArray.count;

    self.clickImageBlock = clickImageBlock;

    return [self initWithFrame:frame];

}

- (instancetype)initWithFrame:(CGRect)frame

{

    self = [super initWithFrame:frame];

    if (self) {

        self.currentIndex=0;

        [self createScrollView];

        [self createImageView];

        [self createPageControl];

        [self setImageByIndex:self.currentIndex];

        self.timer = [NSTimer scheduledTimerWithTimeInterval:3 target:self selector:@selector(freshScroll) userInfo:nil repeats:YES];

        [[NSRunLoop currentRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];


    }

    return self;

}


/**

 *以下是搭建UI界面的方法

 */


-(void)createScrollView

{

    self.scroll=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 0,kWidth, kHeight)];

    self.scroll.backgroundColor=[UIColor redColor];

    self.scroll.showsHorizontalScrollIndicator=NO;

    self.scroll.showsVerticalScrollIndicator=NO;

    self.scroll.pagingEnabled=YES;

    self.scroll.bounces=NO;

    self.scroll.delegate=self;

    self.scroll.contentOffset=CGPointMake(kWidth, 0);

    self.scroll.contentSize=CGSizeMake(kWidth*kImageCount, kHeight);

    [self addSubview:self.scroll];

    self.tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapImage:)];

    [self.scroll addGestureRecognizer:self.tap];


}


-(void)createPageControl

{

    self.pageControl = [[UIPageControl alloc] init];

    self.pageControl.currentPageIndicatorTintColor=[UIColor redColor];

    self.pageControl.pageIndicatorTintColor=[UIColor blueColor];

    self.pageControl.enabled=YES;

    self.pageControl.numberOfPages = self.imageArray.count;

    [self addSubview:self.pageControl];

    [self.pageControl mas_makeConstraints:^(MASConstraintMaker *make) {

        make.centerX.equalTo(self.mas_centerX);

        make.bottom.equalTo(self.mas_bottom).offset(-5);

        make.width.mas_equalTo(60);

        make.height.mas_equalTo(20);

    }];

}

-(void)createImageView

{

    self.LeftImageView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, kWidth, 220)];

    [self.scroll addSubview:self.LeftImageView];

    

    self.centerImageView=[[UIImageView alloc]initWithFrame:CGRectMake(kWidth, 0, kWidth, 220)];

    [self.scroll addSubview:self.centerImageView];

    self.centerImageView.backgroundColor = [UIColor yellowColor];

    

    self.rightImageView=[[UIImageView alloc]initWithFrame:CGRectMake(2 * kWidth, 0, kWidth, 220)];

    [self.scroll addSubview:self.rightImageView];

}

#pragma mark------定时器

- (void)freshScroll

{

    [self scrollViewDidEndDecelerating:self.scroll];

}


#pragma mark-----点击图片

- (void)tapImage:(UITapGestureRecognizer *)tap

{

    if (self.clickImageBlock) {

        self.clickImageBlock(self.currentIndex);

    }

}


- (void)invalidateTimer

{

    [self.timer invalidate];

    self.timer = nil;

    [self.tap removeTarget:self action:@selector(tapImage:)];

}


#pragma mark ----刷新图片

-(void)refreshImage

{

    if (self.scroll.contentOffset.x>=kWidth) {

        self.currentIndex=((self.currentIndex+1)%self.imageCount);

    }

    else if(self.scroll.contentOffset.x<kWidth){

        self.currentIndex=((self.currentIndex-1+self.imageCount)%self.imageCount);

    }

    [self setImageByIndex:self.currentIndex];

}


#pragma mark ----该方法根据传回的下标设置三个ImageView的图片

-(void)setImageByIndex:(NSInteger )currentIndex

{

    NSString *currentImageUrl = self.imageArray[currentIndex];

    [self.centerImageView sd_setImageWithURL:[NSURL URLWithString:currentImageUrl] placeholderImage:nil];

    

    NSString *leftImageUrl = self.imageArray[((self.currentIndex-1+self.imageCount)%self.imageCount)];

    [self.LeftImageView sd_setImageWithURL:[NSURL URLWithString:leftImageUrl] placeholderImage:nil];

    

    NSString *rightImageUrl = self.imageArray[((self.currentIndex+1)%self.imageCount)];

    [self.rightImageView sd_setImageWithURL:[NSURL URLWithString:rightImageUrl] placeholderImage:nil];

    self.pageControl.currentPage=currentIndex;

}

#pragma mark ----UIScrollViewDelegate代理方法(停止加速时调用)

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView

{

    [self refreshImage];

    self.scroll.contentOffset = CGPointMake(kWidth,0);

    self.pageControl.currentPage = self.currentIndex;

    NSLog(@"停止了加速,停在第%ld页",self.pageControl.currentPage+1);

}


- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView

{

    [self.timer invalidate];

    self.timer = nil;

}


- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate

{

    self.timer = [NSTimer scheduledTimerWithTimeInterval:3 target:self selector:@selector(freshScroll) userInfo:nil repeats:YES];

    [[NSRunLoop currentRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];


}



@end



构建动态轮播背景的JavaScript点名器 JavaScript点名器是一个利用JavaScript语言开发的小工具,主要功能是随机抽取用户设置的名单,以便公平公正地进行点名。这个工具不仅适用于课堂点名,也广泛用于会议抽签、活动抽奖等多种场景。点名器的实现基于前端技术,主要是JavaScript和HTML。通过JavaScript实现随机号码生成,用户输入处理和号码显示,以及点名和暂停功能的交互逻辑。其主要步骤是:- 设计用户交互界面,收集用户输入的名单。- 利用JavaScript内置的随机函数,实现号码的随机抽取。 阅读详情

相关推荐

js轮播器4种

四种轮播器显示,可上下翻页,左右翻页,点击翻页,鼠标移动翻页等

功能强大的图片、文字轮播器——SBCycleScrollView

功能强大的图片、文字轮播器——SBCycleScrollView 1. 项目基础介绍 SBCycleScrollView 是一个开源的图片、文字轮播器项目,主要使用 Swift 语言开发。该项目旨在为开发者提供一个简单易用、功能丰富的轮播器解决方案。通过该项目,开发者可以轻松地在应用中添加图片轮播、文字滚动展示等功能。 2. 项目核心功能 支持多种展示类型:SBCycleScrollView 支...

gitblog_00800的博客 529

支持多浏览器轮播器

支持IE6-11,chrome,safari,chrome

图片轮播器

回顾一下 之前的实现 现在的区别 效果展示 代码说明图片轮播器是iOS开发中经常用到的一个组件,一般是采用UIScrollView来实现,但是系统的UIScrollView并不支持循环滚动,所以必须要自己手动实现。 回顾一下在我从C++转做iOS之后,自己动手实现过一个。由于我本人只学习了不到一个月的iOS,对iOS各种组件的不熟悉,导致在工作中,我经常查找各种资料,开发App也产生了很大的阻碍。那

人生如梦 698

RK3576处理器RT-Thread与Linux混合部署实现工业EtherCAT实时控制

实时操作系统(RTOS)是工业自动化领域的核心技术,通过精确的任务调度和中断响应机制确保微秒级控制精度。RT-Thread作为开源实时系统,采用优先级抢占式调度算法,能够满足运动控制和总线通信的硬实时需求。在工业显控一体设备中,实时系统需要与富应用系统协同工作,Linux系统负责图形界面和网络通信等非实时任务。混合部署架构通过共享内存和核间通信技术实现数据交换,既保证了实时性能又扩展了应用生态。EtherCAT工业以太网协议作为高性能现场总线,采用主从站结构和分布式时钟同步,可实现多轴运动控制的精确同步。R

weixin_33738982的博客 2627

MediaPipe+Unity动作捕捉实战:如何用普通摄像头驱动3D人物模型(附避坑指南)

本文详细介绍了如何利用MediaPipe和Unity实现低成本动作捕捉,仅需普通摄像头即可驱动3D人物模型。通过MediaPipe的3D坐标预测能力,结合Unity的骨骼映射优化,解决单目摄像头下的三维重建难题,并提供实战避坑指南和性能优化技巧,帮助开发者快速实现专业级的人物模型驱动效果。

weixin_29047545的博客 359

一个简单实用的轮播器

WEB开发经常实用到一种情况,即某个容器内的各项轮流循环播放显示,同时有相应的导航条提示,因为这个在很多地方可以使用,而且功能很相似的,所以写一个这样的播放功能,共享一下,需要注意的是这个需要jQuery的支持, 这个自己网上搜索下载即可,下面总结出来如下,直接看代码, 一,把如下保存为一个独立的文件 itemPlayerApp.js : //attend: this need jQu

shenzhenNBA的专栏 2680

常见的数值积分方法 (欧拉、中值、龙格-库塔,【常用于IMU中】)

1. 积分基本概念 设F(x)为函数f(x)的一个原函数,我们把函数f(x)的所有原函数F(x)+C(C为任意常数)叫做函数f(x)的不定积分(indefiniteintegral)。 非线性微分方程: 在有限的时间间隔Δt积分: 连续时间内积分: 工程上最常见的有三种:欧拉积分(Euler method)、中值积分(Midpoint method)和龙格-库塔法积分(Runge–Kutta methods)。他们的区别就是如何用数值方法模拟一个斜率。这里简单总结如下: ...

努力努力努力 2万+

FLASH广告轮播器

这个广告轮播器分三个部分:1.html代码部分、2.flash.js文件 3.pixviewer.swf FLASH文件相应参数修改即刻1.html代码部分 var focus_width=372 var focus_height=215 var text_height=0 var swf_height = focus_height+text_height var pics=flas

zhuawang的专栏 3840

【DexGraspNet与多指手抓取算法详解】第四章 抓取检测网络架构设计

图 $G=(V, E)$ 包含两类节点:指尖节点 $V_{tip} = \{v_{tip}^i\}_{i=1}^{N_{finger}}$ 与物体表面节点 $V_{obj} = \{v_{obj}^j\}_{j=1}^{N_{surf}}$。节点特征包含位置 $x \in \mathbb{R}^3$ 、法向 $n \in \mathbb{R}^3$ 及视觉特征 $f \in \mathbb{R}^d$。

VectorShift的博客 441

微观交通流仿真软件:SUMO (Simulation of Urban MObility)_(1).SUMO入门与基础概念

SUMO(Simulation of Urban MObility)是一个开源的微观交通流仿真软件,用于模拟城市交通系统中的各种动态行为。SUMO不仅可以模拟车辆的行驶,还可以模拟行人、自行车、公交车等交通参与者的运动。通过SUMO,研究人员和工程师可以对交通系统进行详细建模和分析,从而优化交通规划、评估交通政策和设计智能交通系统。车辆路径规划:SUMO可以模拟车辆在路网中的路径选择,包括动态路径选择和静态路径选择。交通信号控制:支持多种交通信号控制策略,包括固定时间控制、自适应控制等。多模式交通:模拟不同

kkchenjj的博客 1182

swift简单学习之轮播器

初学swift 语法之类的还有点蒙,简单的写了一个轮播器的封装,没有精加工 不喜勿喷!!! import UIKit class ScrollViewLoop: UIView,UIScrollViewDelegate {     var ImgUrl = NSMutableArray()     private var count = 0     var delegate : circl

ZHZMAREN的博客 455

TI单芯片毫米波雷达1642代码走读(〇)——总纲

前言 近年来,自动驾驶行业发展如火如荼,雷达技术也逐渐从军工封闭圈走向了开放的市场。 毫米波雷达具有全天候探测能力,特别是在雨雪雾天气以及夜间都能可靠工作,并且探测距离相对其他车载传感器非常远,对运动目标非常敏感,价格还低廉,这些特性都使其成为自动驾驶感知层面不可或缺的一环。 现如今的雷达已经不仅仅局限于测距测速测角等传统的功能,雷达技术正在从感知走向认知、从宽带走向超宽带、从二维走向三维四维、从相控阵走向数字阵列、从单通道走向MIMO、从独立工作走向分布式协同、从分立组件走向射频数字一体化。MIMO

3万+

jQyery实现轮播器

看到各大网站上都有一个轮播器的效果,自己不禁也想做一个,查了资料,看了轮播器的原理,慢慢的试着做了做,最终效果勉勉强强 原理:如图,试想一下,若是将<ul>的width属性值设置的很宽,直到可以装下你所有的图片,而每一个图片又用<li>包着并且设置了左浮动。 那么当我们向左移动ul的时候并且移动的距离为<li>的宽度,第二个<li&gt...

dengbeizhuo8768的博客 176

【制作100个Unity游戏之35】从零开始构建类《月圆之夜》《杀戮尖塔》的卡牌游戏(附带项目源码)

本文介绍了如何从零开始构建类似《月圆之夜》《杀戮尖塔》的卡牌游戏。主要内容包括:1)获取游戏素材资源;2)导入xyframe框架工具集;3)实现手牌弯曲排列效果,通过样条曲线控制卡牌位置和旋转;4)设计可扩展的MVD卡牌系统架构,分离数据层(ScriptableObject存储)、模型层(业务逻辑)和视图层(显示控制)。文中提供了完整的代码实现,并展示了卡牌动态排列的GIF效果演示。

向宇的博客,专注php/web全栈 unity游戏开发,欢迎大家评论纠错 1429

MATLAB极坐标伪彩色圆图绘制之polarPcolor函数

polarPcolor函数介绍 我们经常在论文或期刊上看到如下图这种以色调冷暖代表数值大小的极坐标圆图, 而function [varargout] = polarPcolor(R,theta,Z,varargin)可以很好的帮助我们快速绘制这类极坐标圆图。它非常适合雷达或激光雷达的平面位置指示器。使用polarPcolor函数时,我们只需根据手中数据构造相应的二维矩阵Z即可,十分便捷。varargin值为绘制模式选择。R值为半径坐标一维矩阵,theta值为角坐标一维矩阵。 代码示例 这里使用了海洋表面耀光

qq_19512613的博客 1万+

Bootstrap-打造自己的轮播器

在上篇博客中介绍了Bootstrap框架的一些基本情况。也通过一个小例子说明了如何具体在项目中使用这个框架。相信大家对这套框架已经有了一定认识。 这篇博客就介绍一下Bootstrap实际应用在项目中时所遇到的一个问题。博客标题已经说明了这篇博客的内容将是关于Bootstrap轮播器的。 什么是轮播器?轮播器大家经常看到,无论是视频网站、新闻网站还是某宝网站等等。他们的首页都会有一个轮播器,用来

969

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

Javascrip之轮播器的实现

Javascript视频已经进行到最后了这部分主要是实现了一些功能,我们一般在网站上都能够看到很多动画特效,殊不知这些特效都是用CSS+JS和页面html代码来实现的上篇博客我们了解的base.js和tool.js的作用都是我们在后面用到的,在我们看淘宝的时候我们知道看不同的衣服图片不断闪动,但是当我们将鼠标固定到一张图片时,他又能停止那这又是怎么实现的呢,这就是我们看到的轮播器的作用首先我们要有

郭蕾蕾 努力的包子 1491

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

android简单轮播器代码,简单实现android轮播图

轮播图是很常用的一个效果 核心功能已经实现 没有什么特殊需求 自己没事研究的 所以封装的不太好 一些地方还比较糙 为想要研究轮播图的同学提供个参考目前测试图片为mipmap中的图片 没有写从网络加载图片 可自行根据需求在getShowView()方法中修改1.定时切换通过handle延时发送通知改变界面 然后在切换viewpage的界面之后 再次发送此延时通知 就ok咯 还可以通过timer定时器...

weixin_30741979的博客 376

iOS开发那些事儿(一)轮播器

前言 市面上绝大部分的APP被打开之后映入眼帘的都是一个美轮美奂的轮播器,所以能做出一个符合需求、高效的轮播器成为了一个程序员的必备技能。所以今天的这篇博客就来谈谈轮播器这个看似简单的控件其中蕴含的道理。 正文    首先我们来分析一下该如何去实现一个类似下图的轮播器(图片数量、URL由服务器返回):         策略一:U...

HB8889的博客 212

轮播器连续点击问题

                                    轮播器连续点击问题 目的:当一次轮播结束方可点击进行下一次轮播 方法:如果轮播器使用的是transition:动画未结束不可再进行下次轮播 var flag = false; oRight.onclick = function(){ if(flag) return; //如果是true表示动画未结束...

shaonian1996 1104

javascript实现轮播器

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"&gt; &lt;

Ibelievesunshine的博客 449

OC Control NewPagedFlowView(卡片轮播器)

一直觉得自己写的不是技术,而是情怀,一个个的教程是自己这一路走来的痕迹。靠专业技能的成功是最具可复制性的,希望我的这条路能让你们少走弯路,希望我能帮你们抹去知识的蒙尘,希望我能帮你们理清知识的脉络,希望未来技术之巅上有你们也有我。 效果 提供的属性和方法 /** * 默认为横向 */ @property (nonatomic,assign) FHXNewPagedFlowViewOrientation orientation; @property (nonatomic, strong) UIS

weixin_38716347的博客 634
上一篇: 帮助页
下一篇: iOS多线程开发之NSOperation用法总结-----经典
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值