横向无限滑动选择日期控件,图片横向滑动启动

作者:计算机知识

图片 1IMG_1484.jpg图片 2IMG_1486.jpg图片 3IMG_1485.jpg

如今遇上三个供给:

横向无限滑动选择日期控件,图片横向滑动启动页。前日做了二个横向滑动接纳日期的控件,记录一下。
意义如下:

图片 4screenCut.gif

  • 几天前做了二个小的demo,很简短,希望能帮忙咱们。首先先说一下本人的思路,使用UICollectionVIew做图片滑动,首先collectionView的layout方式为横向的,然后贰个collectionCell一张满屏的图形,通过左右滑动到分歧的图样cell,有二个pageControl呈现滑动到了哪一张图片。思路相当的粗略,代码也相当的粗略。
  • ViewController.h代码如下:#import <UIKit/UIKit.h>@interface ViewController : UIViewController@end
  • ViewController.m的代码如下:

图片 50.png

图片 6

以此功效是今日公司项目里面遇上的,也是第三遍遇见这种须要,所以记录下来,效果如上海教室。要求入眼是足以兑现上下的滑行,并且同期最左侧的“线路名称”这一列在向左滑动的时候是不能够跟随滚动的。这些功用首要是落到实处用户可以一本万利查看关于一下难以看全的列表数据。上边说一下思路。

要求横向分页显示这种UICollectionView,要是用系统自带的UICollectionViewFlowLayout,会冒出竖着排列的成效

123123456.gif

由地方的GIF图和大旨需要描述大家首先个想到的东西就是全能的tableview,对的,那些效果的做到当然离不开tableview,那么tableview应该怎么着发挥它的造诣呢,左左边的音讯必要对称,所以在那处作者利用了七个tableview,也正是最左边线路名称这一列是叁个tableview,右边的粉樱桃红黑字体那几个行是一个tableview。上下滑动两个关系是采用scrollview实现的。这接下去就整合代码轻巧说一下,也造福自身然后回头看,哈哈哈。

#define identifier @"welcomeCell"//屏幕宽度#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width//屏幕高度#define SCREEN_HEIGHT [[UIScreen mainScreen] bounds].size.height#import "ViewController.h"@interface ViewController ()<UIScrollViewDelegate,UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>@property (nonatomic, strong)NSMutableArray *imageArray;@property (nonatomic, assign)Boolean isFullScreen;@property (nonatomic, strong)UICollectionView *collectionView;@property (nonatomic, strong)UIPageControl *pageControl;@property (nonatomic, assign)int currentIndex;@end

 @implementation ViewController - viewDidLoad { [super viewDidLoad]; self.imageArray = [NSMutableArray arrayWithArray:@[@"001.jpg",@"002.jpg",@"003.jpg"]]; [self intiWithCollection]; } - didReceiveMemoryWarning { [super didReceiveMemoryWarning]; } - intiWithCollection { int imageCount = self.imageArray.count; UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init]; layout.scrollDirection = UICollectionViewScrollDirectionHorizontal; layout.itemSize = CGSizeMake(SCREEN_WIDTH, SCREEN_HEIGHT); layout.minimumInteritemSpacing = 0.0f; _collectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH , SCREEN_HEIGHT) collectionViewLayout:layout]; _collectionView.backgroundColor = [UIColor clearColor]; _collectionView.delegate = self; _collectionView.dataSource = self; _collectionView.pagingEnabled = YES; self.collectionView.showsHorizontalScrollIndicator = NO; self.collectionView.showsVerticalScrollIndicator = NO; [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:identifier]; self.collectionView.contentSize = CGSizeMake(SCREEN_WIDTH*imageCount, SCREEN_HEIGHT); self.collectionView.contentOffset = CGPointMake; [self.view addSubview:_collectionView]; //pageControl 一直不居中 只能这样设置了 self.pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(SCREEN_WIDTH/2, SCREEN_HEIGHT- 60, 40, 40)]; self.pageControl.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill; self.pageControl.numberOfPages = self.imageArray.count; if(self.imageArray.count == 1){ self.pageControl.alpha = 0; } self.pageControl.currentPage = 0; self.pageControl.pageIndicatorTintColor = [UIColor greenColor]; self.pageControl.currentPageIndicatorTintColor = [UIColor orangeColor]; [self.view insertSubview:_pageControl aboveSubview:_collectionView]; } - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return _imageArray.count; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath]; for (UIView *view in cell.contentView.subviews) { [view removeFromSuperview]; } NSLog(@"indexPath.row ====>%ld",indexPath.row); UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:_imageArray[indexPath.row]]]; imageView.frame = CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT); [cell.contentView addSubview:imageView]; return cell; } - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section { return UIEdgeInsetsMake(0, 0, 0, 0); } - collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{ return 0; } - collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(SCREEN_WIDTH, SCREEN_HEIGHT); } - scrollViewDidScroll:(UIScrollView *)scrollView { //得到每页宽度 CGFloat pageWidth = scrollView.frame.size.width; // 根据当前的x坐标和页宽度计算出当前页数 _currentIndex = floor((scrollView.contentOffset.x - pageWidth/2)/pageWidth)   1; if(_currentIndex == _imageArray.count-1){ } self.pageControl.currentPage = _currentIndex; } @end - MarkDown得使用还不熟练,使用代码块感觉真的不好用-----引入代码真的很辛苦。demo的下载的地址为:<https://github.com/tanghan0328/WelcomeImageCollection>

图片 71.png

第一正是用来选用日期来做一些刷新数据UI之类的操作

  • 那是急需的原料,每一个变量皆有注释它的意义了,一眼懂。titleTableView是最侧面包车型大巴线路名称这一列。infoTableView是粉莲红字体那么些。contentViewtitleTableView和最上边这一列内容的superView

以那个时候候就须求自定义UICollectionViewFlowLayout

切实落实

获得必要的时候开首思谋达成的措施,一早先是想行使UIScrollView来贯彻,但构思到能够按周滑动(正是按页翻,一翻翻八个星期),决定用UICollectionView达成会越发实惠一点。

比如是用xib拖得UICollectionView,修改下图所处

兑现控件决定后,还会有数据源难题,如何获取数据源呢?

1.先是要显著贰个最早时间点(startDate),经常就选当前时刻为最早时间,将伊始时间插入数据源dataList
2.得到初叶时间(startDate卡塔尔(قطر‎是周几(week,分明暗许贰次加载的周数offsetWeeks
3.在数量源dataList后面循环插入初始时间(startDate卡塔尔国前的(offsetWeeks * 7

  • week - 1)个日期
    4.在数量源dataList前面循环插入开头时间(startDate卡塔尔后的(offsetWeeks * 7
  • 7 - week)个日期

    [_dateDataList addObject:self.selectedDate];

              NSInteger week = [self.selectedDate weekday];
              // 插入开始日期前的数组
              for (int i = 1; i <= OFFSETDAYS   week - 1; i  ) {
                 [_dateDataList insertObject:[self.selectedDate dateBySubtractingDays:i] atIndex:0];
              }
              // 插入开始日期后的数组
              for (int i = 1; i <= OFFSETDAYS    7 - week; i  ) {
                  [_dateDataList addObject:[self.selectedDate dateByAddingDays:i]];
              }
    
@property (nonatomic, strong) UITableView *titleTableView;//标题TableView@property (nonatomic, strong) UITableView *infoTableView;//内容TableView@property (nonatomic, strong) UIScrollView *contentView;//内容容器@property (nonatomic, strong) NSArray *infoArr;//数组@end@implementation ViewController { CGFloat _kOriginX; CGFloat _kScreenWidth; CGFloat _kScreenHeight;}

本文由bwin必赢发布,转载请注明来源

关键词: iOS 图片 横向 iOS 开发随记