• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

CSStickyHeaderFlowLayout/CSStickyHeaderFlowLayout: UICollectionView replacement ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

CSStickyHeaderFlowLayout/CSStickyHeaderFlowLayout

开源软件地址:

https://github.com/CSStickyHeaderFlowLayout/CSStickyHeaderFlowLayout

开源编程语言:

Objective-C 78.2%

开源软件介绍:

CSStickyHeaderFlowLayout

Contributors

For anyone who'd like to be a contributor to the repository, please read the Contribution Guideline


Parallax, Sticky Headers, Growing image heading, done right in one UICollectionViewLayout.

Installation

Version Platform

Cocoapods

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

pod "CSStickyHeaderFlowLayout"

Carthage

CSStickyHeaderFlowLayout is also available with Carthage. Add github "CSStickyHeaderFlowLayout/CSStickyHeaderFlowLayout" to your Cartfile

Alternatively, you can just drag the files from CSStickyHeaderFlowLayout / Classes into your own project.

Usage (Swift/Code)

Documentation is coming soon. For now please open CSStickyHeaderFlowLayout.xcworkspace > SwiftDemo target.

Usage (CocoaPods/Objective-C/Storyboard)

To run the example project; clone the repo, and run pod install from the Project directory first.

1. Setting up the Sticky Section Header

Configure your collection view to use CSStickyHeaderFlowLayout. Here's an example on how you to do it in Storyboard.

Now all your section headers will get the sticky effect like table view. You can disable it with one line of code.

@property (nonatomic) BOOL disableStickyHeaders;

2. Setting up the Collection View Header

We'll be using supplementary views for our parallax header. Here's an example on how use a nib file for that purpose:

Register that nib file to your collection view controller in code:

#import "CSStickyHeaderFlowLayout.h"

- (void)viewDidLoad {

    [super viewDidLoad];

    // Locate your layout
    CSStickyHeaderFlowLayout *layout = (id)self.collectionViewLayout;
    if ([layout isKindOfClass:[CSStickyHeaderFlowLayout class]]) {
        layout.parallaxHeaderReferenceSize = CGSizeMake(320, 200);
    }

    // Locate the nib and register it to your collection view
    UINib *headerNib = [UINib nibWithNibName:@"CSGrowHeader" bundle:nil];
    [self.collectionView registerNib:headerNib
          forSupplementaryViewOfKind:CSStickyHeaderParallaxHeader
                 withReuseIdentifier:@"header"];

}

Implement -[UICollectionViewDataSource collectionView:viewForSupplementaryElementOfKind:atIndexPath:]

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {

    // Check the kind if it's CSStickyHeaderParallaxHeader
    if ([kind isEqualToString:CSStickyHeaderParallaxHeader]) {

        UICollectionReusableView *cell = [collectionView dequeueReusableSupplementaryViewOfKind:kind
                                                                            withReuseIdentifier:@"header"
                                                                                   forIndexPath:indexPath];

        return cell;

    } else if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        // Your code to configure your section header...
    } else {
        // other custom supplementary views
    }
    return nil;
}

That's it. You'll be able to get the header you wanted using the best practice.

Configuring other effects are really just the way how you setup the header cell, by combining different settings in the minimal exposed properties in CSStickyHeaderFlowLayout.h

@property (nonatomic) CGSize parallaxHeaderReferenceSize;
@property (nonatomic) CGSize parallaxHeaderMinimumReferenceSize;
@property (nonatomic) BOOL disableStickyHeaders;

Run the project examples and it'll shows you exactly how you achieve different effects.

Updates

  • 0.2.12: Add Swift 5 Demo

  • 0.2.11: Add support for carthage.

  • 0.2.10: Fixed issue because attributes were not copied and datasource might have been niled

  • 0.2.9: Remove Supplementry Header Layout Attribute to prevent crash when returning nil and while is CGSizeZero

  • 0.2.8: Fixed a visual issue when animating contentInsets #85 and crash when dragging cells #69

  • 0.2.7: Fixed scroll indicator covered by cell

  • 0.2.6: Fixing that section header being covered by cell after perform batch update

  • 0.2.5: Fixing a crash when quickly popping back to a view controller using the parallax header

  • 0.2.4: Possibly fix for a crash when parallaxHeaderReferenceSize is changed

  • 0.2.3: Enabled iPhone 6 screen sizes, reverted a patch and fixed a visual bug and content tapping bug.

  • 0.2.2: Fix 1px header and zIndex problem, thanks @m1entus and @Xyand

  • 0.2.1: Fix crash on reloadData in collection view when header is offscreen, thanks @jessesquires

  • 0.2: Added custom UICollectionViewLayoutAttributes to support more advanced example (Spotify App)

  • 0.1.1: Minor fixes for default number of sections, thanks @miwillhite

  • 0.1: Initial Release

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Requirements

  • Xcode 5
  • iOS 7 (I haven't really test on iOS 6 but it should work if you're using iOS 6 compatible Storyboard)

Author

James Tang, [email protected]

License

CSStickyHeaderFlowLayout is available under the MIT license. See the LICENSE file for more info.




鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap