iCarousel 线性类型从中心开始
Posted
技术标签:
【中文标题】iCarousel 线性类型从中心开始【英文标题】:iCarousel Linear Type starts from center 【发布时间】:2013-01-22 07:34:20 【问题描述】:我希望 iCarousel 从左侧开始出现,即它应该左对齐。我发现在线性轮播的情况下,它从屏幕中心开始。
如何使线性轮播从左侧开始?
【问题讨论】:
【参考方案1】:在我的例子中,我在 viewDidLoad 中使用了 [self.vwCoverFlow scrollToItemAtIndex:2 animated:YES];
方法。
【讨论】:
但是这个在第二个索引处滚动的轮播没有显示从最左边开始的第一个项目?【参考方案2】:如果您想要线性滚动,您可以使用 swipeView 类,它与 iCarousel 来自同一开发人员,但仅用于线性滚动。我用过它,它确实支持左对齐。 易于添加和使用,与 iCarousel 相同
这里是代码https://github.com/nicklockwood/SwipeView的链接
【讨论】:
【参考方案3】:将 wrap 属性设置为 YES 并将 placeholderinCarousel 的数量返回为 2
【讨论】:
【参考方案4】:我遇到了同样的问题,并通过以下 hack 来解决 ;)
问题: 我需要让视图只显示 3 个始终左对齐的项目。
分辨率: 我所做的是始终至少制作 3 件商品。如果我有 0、1 或 2 个项目,我总是创建 3 个,但那些不需要显示的项目我将创建为空 UIView。我总是有 2 个占位符,但在某些情况下,一个或两个都是空的。
例如 如果我们要显示 2 个项目,我实际上是创建了三个,但第三个是空的 UIView。我正在创建两个占位符和一个项目。
第一项是索引 0 处的第一个 占位符 第二个项目是项目 第三项是第二个占位符,但 UIView 为空如果我们要显示 1 个项目,我再次创建三个,但第二个和第三个是空的 UIView。与前面的示例相同,我正在创建两个占位符和一个项目。
第一项是索引 0 处的第一个 占位符 第二个项目是 Item 但 UIView 为空 第三项是第二个占位符,但 UIView 为空由于这种逻辑,我总是在重用时清理视图 ([v removeFromSuperview]),以确保它是干净的,如果需要显示新视图,我将添加它 ([view addSubview...)。 Item 和 Placeholder
的逻辑相同如果您需要显示 3 个以上的项目,您可以使用相同的逻辑,但将值 3 更改为其他值。如果我错了,请更新我;)
这是我的代码的一部分,对我有用;)
- (NSUInteger)numberOfItemsInCarousel:(iCarousel *)carousel
return [[self getRecordings] count] > 3? [[self getRecordings] count] - 2: 1;
- (UIView *)carousel:(iCarousel *)carousel viewForItemAtIndex:(NSUInteger)index reusingView:(UIView *)view
if (view == nil)
view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 30)];
else
// If reusing remove content from holder view for fake items
for (UIView *v in view.subviews)
[v removeFromSuperview];
if ([[self getRecordings] count] >= 2)
[view addSubview:[(RecordingItemViewController*)[_recordingItemViewControllers objectAtIndex:index + 1] view]];
return view;
- (NSUInteger)numberOfPlaceholdersInCarousel:(iCarousel *)carousel
return 2;
- (UIView *)carousel:(iCarousel *)carousel placeholderViewAtIndex:(NSUInteger)index reusingView:(UIView *)view
if (view == nil)
view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 30)];
else
// If reusing remove content from holder view for fake items
for (UIView *v in view.subviews)
[v removeFromSuperview];
if (([[self getRecordings] count] > 0 && [[self getRecordings] count] < 3 && index == 0) || [[self getRecordings]count] >= 3)
[view addSubview:[(RecordingItemViewController*)(index == 0? [_recordingItemViewControllers objectAtIndex:0]: [_recordingItemViewControllers lastObject]) view]];
return view;
【讨论】:
【参考方案5】:这对我有用
- (NSUInteger)numberOfItemsInCarousel:(iCarousel *)carousel
[carousel scrollToItemAtIndex:photosArray.count/2 animated:YES];
return [photosArray count];
【讨论】:
【参考方案6】:在您的情况下,我建议使用 2 个占位符。
例如:您有 n 张照片,那么您将有 (n-2) 个项目和 2 个占位符。 - 项目索引从 1 到 (n-2)。 - 占位符的索引为 0 和 (n-1)。 现在我们将有一些这样的代码:
#pragma mark iCarousel DataSource
- (NSUInteger)numberOfItemsInCarousel:(iCarousel *)carousel
//if we have n photos, then number of items is (n-2)
int count = _movieGalleries.count;
return count >= 3 ? count - 2 : count;
- (NSUInteger)numberOfPlaceholdersInCarousel:(iCarousel *)carousel
//2 placeholder
return _movieGalleries.count >= 3 ? 2 : 0;
#pragma mark iCarousel Delegate
- (UIView *)carousel:(iCarousel *)carousel viewForItemAtIndex:(NSUInteger)index reusingView:(UIView *)view
//reuse your view
UIView *yourview = ...
//get your data
//index of item is 1 -> n-2, index of placeholder is 0 and n-1
Item *item = [_listItems objectAtIndex:index + 1];
//config your view
...
return yourView;
- (UIView*)carousel:(iCarousel *)carousel placeholderViewAtIndex:(NSUInteger)index reusingView:(UIView *)view
//index of placeholder is 0 and n-1
//Trick: we use viewForItemAtIndex for getting placeholder view
index = index == 0 ? - 1 : carousel.numberOfItems;
return [self carousel:carousel viewForItemAtIndex:index reusingView:view];
- (void)carousel:(iCarousel *)carousel didSelectItemAtIndex:(NSInteger)index
//in carousel with placeholder, index of selected item is -1, 0, 1, ..., (n-2). which -1 and (n-2) is index of placeholders. So that we need to increase index by 1
NSLog("current index: %i", index + 1);
【讨论】:
【参考方案7】:SWIFT 5:
对我有用的解决方案:将轮播宽度设置为屏幕宽度的两倍,并将轮播限制到屏幕的 XAnchor,然后添加 contentOffset
,即轮播宽度的 0.5 x 大小。在某些containerView: UIView
中而不是直接在viewController
中显示轮播也很重要。这是因为轮播的第一项以轮播的中心为中心。如果您将 carousel 设置为视图大小的两倍并将 contentOffset
设置在左侧(- 0.5 x carousel 大小),则中心将位于视图的左侧。下面是一些示例代码:
设置轮播大小:
carousel.leadingAnchor.constraint(equalTo: containerView.leadingAnchor).isActive = true
carousel.trailingAnchor.constraint(equalTo: containerView.trailingAnchor).isActive = true
carousel.translatesAutoresizingMaskIntoConstraints = false
carousel.heightAnchor.constraint(equalToConstant: 200).isActive = true
carousel.widthAnchor.constraint(equalTo: self.containerView.widthAnchor, multiplier: 2).isActive = true
carousel.centerXAnchor.constraint(equalTo: containerView.centerXAnchor).isActive = true
carousel.topAnchor.constraint(equalTo: containerView.topAnchor).isActive = true
设置轮播内容偏移量:
carousel.contentOffset = CGSize(width: - containerView.frame.size.width, height: 0)
设置属性scrollToItemBoundry
,这样当您向右滚动时,您的轮播项目不会超出您的范围:
carousel.scrollToItemBoundary = true
稍后您将您的containerView
添加到您的viewController.view
:
viewController.view.addSubView(containerView)
containerView.translatesAutoresizingMaskIntoConstraints = false
containerView.centerXAnchor.constraint(equalTo: viewController.view.centerXAnchor).isActive = true
containerView.centerYAnchor.constraint(equalTo: viewController.view.centerYAnchor).isActive = true
【讨论】:
以上是关于iCarousel 线性类型从中心开始的主要内容,如果未能解决你的问题,请参考以下文章