• Stars
    star
    184
  • Rank 209,187 (Top 5 %)
  • Language
    Objective-C
  • License
    MIT License
  • Created over 10 years ago
  • Updated over 6 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

ARCollectionViewMasonryLayout

Build Status

ARCollectionViewMasonryLayout is a UICollectionViewLayout subclass for creating flow-like layouts with dynamic widths or heights.

Screenshot

Usage

Create an instance of a ARCollectionViewMasonryLayout.

ARCollectionViewMasonryLayout *layout = [[ARCollectionViewMasonryLayout alloc] initWithDirection:ARCollectionViewMasonryLayoutDirectionVertical];

Create a collection view. Its delegate must conform to the ARCollectionViewMasonryLayoutDelegate protocol in order to retrieve the variable dimensions of the cells.

@interface ARCollectionViewController : UICollectionViewController

@end
@interface ARCollectionViewController () <ARCollectionViewMasonryLayoutDelegate>

@end

@implementation ARCollectionViewController

#pragma mark - UIViewController Lifecycle and Callbacks

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"Cell"];
}

#pragma mark - UICollectionViewDataSource Methods

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return 10;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath];
    CGFloat colorSeed = (indexPath.row * 3 % 255)/255.0f; // random-ish color
    cell.backgroundColor = [UIColor colorWithRed:colorSeed green:colorSeed blue:colorSeed alpha:1];
    return cell;
}

#pragma mark - ARCollectionViewMasonryLayoutDelegate Methods

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(ARCollectionViewMasonryLayout *)collectionViewLayout variableDimensionForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return (CGFloat)(indexPath.row * 10 % 30) + 40; // random-ish varying size
}

@end

Headers and Footers

The masonry layout supports a fixed height header and footer that scroll along with the contents of the view. These can be added by implementing the standard UICollectionViewDelegateFlowLayout delegate methods on the UIViewController.

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    // return a header and/or footer view, must be a UICollectionReusableView
    // kind is one of UICollectionElementKindSectionHeader or UICollectionElementKindSectionFooter
    UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:kind forIndexPath:indexPath];
    view.backgroundColor = [UIColor whiteColor];
    return view;
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section
{
    return CGSizeMake(0, 20); // header size
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section
{
    return CGSizeMake(0, 20); // header size
}

Sticky Headers

The layout supports having a custom sticky header ( similar to the ones in a UITableView. ) It behaves simiar to how Headers and footers work. However it needs the layout delegate to support collectionView:layout:referenceSizeForStickyHeaderInSection:.

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    [..]
    } if ([kind isEqualToString:ARCollectionElementKindSectionStickyHeader]) {
        UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:kind forIndexPath:indexPath];
        view.backgroundColor = [UIColor purpleColor];
        return view;

    }
    [..]
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(ARCollectionViewMasonryLayout *)collectionViewLayout referenceSizeForStickyHeaderInSection:(NSInteger)section
{
    return self.stickyHeaderSize;
}

It also provides a callback incase you want to make transitions when the header is sticky or not:

- (void)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout stickyHeaderHasChangedStickyness:(BOOL)isAttachedToLeadingEdge
{
    NSLog(@"Attached: %@", @(isAttachedToLeadingEdge));
}

Demo Project

This repository contains a demo project showing the use of the collection view layout. The view controller creates a number of ARModel instances which represent a color and dimension of a cell. These values are assigned from a collection of colors in viewDidLoad. When the collection view asks for a cell, the cell's background colour is set to the corresponding model's color. The layout queries the collection view's delegate for dimension information, and the corresponding model's dimension is returned.

License

Licensed under MIT.

Credits

Originally created by Orta for Artsy.

More Repositories

1

C-41

C-41 is an application to help people develop film at home by providing a series of "recipes" for photographers to use.
Objective-C
2,059
star
2

xcode-hardware-performance

Results from running Xcode on a non-trivial open source project using various Macs
1,134
star
3

FunctionalReactivePixels

A demonstration of how to use FRP with ReactiveCocoa in an iOS context using the 500px API.
Objective-C
702
star
4

AFTabledCollectionView

How to display a UICollectionView within a UITableViewCell
Objective-C
549
star
5

UICollectionView-NSFetchedResultsController

How to use UICollectionView with NSFetchedResultsController
439
star
6

Collection-View-in-a-Table-View-Cell

Sample code for my tutorial
Swift
393
star
7

Nimble-Snapshots

Nimble matchers for FBSnapshotTestCase.
Swift
317
star
8

danger-ruby-swiftlint

A Danger plugin for SwiftLint.
Ruby
203
star
9

UICollectionViewFlowLayoutExample

UICollectionViewFlowLayout Example
Objective-C
198
star
10

danger-swiftlint

Automated Swift linting on pull requests
Swift
149
star
11

ASHSpringyCollectionView

Objective-C
140
star
12

second_curtain

Upload failing iOS snapshot tests cases to S3
Objective-C
130
star
13

blog

This is my website, a static site generated with Gatsby.
MDX
112
star
14

UICollectionViewExample

Objective-C
100
star
15

LongPlay

Long Play
Objective-C
93
star
16

AFImageDownloader

Downloads JPEG images asynchronously and decompresses them on a background thread.
Objective-C
88
star
17

Forgeries

Helper methods for testing iOS code
Objective-C
83
star
18

yourfirstswiftapp

Swift
66
star
19

FunctionalReactiveAwesome

Sample Code for AltConf 2015 talk on FRP 🎉
Swift
57
star
20

NSFetchedResultsController-MVVM

NSFetchedResultsController using MVVM
Objective-C
55
star
21

Swift-RAC-Macros

(Temporary) Replacements for the RAC and RACObserve macros in Swift
Swift
54
star
22

UIView-BooleanAnimations

Perform changes to UI with or without animations, depending on a variable.
Objective-C
47
star
23

danger-rubocop

Danger plugin for Rubocop
Ruby
43
star
24

peerlab.community

Worldwide directory of peer labs, instructions on starting your own.
HTML
43
star
25

DOOM-CPU-Monitor

CPU monitor that displays how much load your CPU is under via the dying face from the video game DOOM.
Objective-C
42
star
26

Newtonian-UICollectionView

Objective-C
40
star
27

pragma-2015-rx-workshop

Materials for my Pragma 2015 workshop on reactive programming
Swift
37
star
28

Your-First-iOS-App

Sample code for "Your First iOS App", the book
Objective-C
35
star
29

Angular

Making an Othello/Reversi clone
Objective-C
34
star
30

NSSpain2014

Annotated playground for my presentation at NSSpain 2014
Swift
32
star
31

MBLTDev

Sample code for MBLTDev
Swift
31
star
32

Bleach

iOS 9 app extension to block ads
27
star
33

Swift-Course

A small demo of Swift for newcomers
Swift
26
star
34

AFActivityIndicatorView

A ground-up, home-made implementation of UIActivityIndicatorView
Objective-C
24
star
35

PXSaver

Super hacky screen saver for OS X I wrote in a few hours while drinking
Objective-C
23
star
36

FunctionalReactiveDemo

A small demonstration of how to use ReactiveCocoa in iOS applications
Objective-C
23
star
37

ReactiveMoya

Swift
22
star
38

UIAlertController-Example

A demonstration of how to use Apple's hot new UIAlertController class
Swift
20
star
39

500px-API-Test

500px recently opened their API to the public. I want to try it out.
19
star
40

Haste

NSTimer Extension for Swift
Swift
18
star
41

twelease

🗣 A small Express server for automatically tweeting about new git tags
TypeScript
18
star
42

cocoapods-superdeintegrate

💣
Ruby
16
star
43

WhiskeyList

Objective-C
15
star
44

cocoapods-chillax-swift

CocoaPods plugin for disabling compiler optimizations for specific pods
Ruby
13
star
45

RACAlertAction

UIAlertAction subclass with support for ReactiveCocoa
Objective-C
13
star
46

hasValue

Reimplementing hasValue in Swift.
Ruby
11
star
47

UIView-ShinkTo

Shrinks any UIView instance to a point in a view similar to the iOS Mail app
Objective-C
11
star
48

FoundationOperators

Operators overloading for the Foundation (so we can finally just nsnumber + nsnumber)
Swift
10
star
49

canadian-measurements

Since moving to Europe, I get asked a lot about Canada's adoption of the metric system. Here it is.
9
star
50

production-swift-code

Sample code for my upcoming book
8
star
51

stylesheet

My custom user stylesheet for making the web less shitty.
CSS
7
star
52

EuroTrip-2015

We'll be in Europe for most of May. This repo is used to organize our travel plans.
7
star
53

cornell-rx-materials

Swift
6
star
54

category-theory-exercises

Swift
6
star
55

buggy

A Slackbot that makes it easy to organize bug bashes
Ruby
6
star
56

UIApplication-Keychain-Access

This is a library to abstract access to the keychain on iOS devices.
5
star
57

graphql-depth-limit

Limit the complexity of your GraphQL queries based on depth.
JavaScript
5
star
58

trumpsoundboard

HTML
4
star
59

Simple-OAuth

Simple Objective-C OAuth
Objective-C
4
star
60

FunctionalDemo

A short demo of functional programming on iOS using RXCollections
Objective-C
4
star
61

tsnyc-tslint-rules

Materials for my October 30th talk at TypeScript NYC
TypeScript
3
star
62

task-list-checker

JavaScript
3
star
63

pride.watch

I'm going to make a gallery of Apple Watch watch faces that are pride flags ¯\_(ツ)_/¯
HTML
3
star
64

peril-settings

Settings for my personal Peril server
TypeScript
2
star
65

static-keys-test

Objective-C
2
star
66

screensaver

JavaScript
2
star
67

FITC-SCREENS

Demo repo for FITC SCREENS
2
star
68

test-repo

test repo for twelease
2
star
69

500px-Behind-The-Scenes

Source Materials for the 500px Behind The Scenes FITC Screens Presentation
2
star
70

ashfurrow

This is the readme repo for my GitHub profile.
2
star
71

ScienceDog

A simple Haskell web app written using the Happstack-lite web framework
1
star
72

mastodon-technology

Ruby
1
star
73

hfm-exercises

My solutions to the Haskell-for-Mac Exercises
Haskell
1
star
74

TumblrSharing

Simple sharing to Tumblr's v2 OAuth API
Objective-C
1
star
75

colourschemes

Some Xcode 4+ colour schemes I like
1
star
76

minsk

Code from Mobile Developer & Business Day
Swift
1
star
77

tslint-playground

A playground repo for me to experiment with writing custom TSLint rules
TypeScript
1
star
78

AnyoneCanLearn

Core beliefs, resources, and planning for the organization.
1
star
79

empty-podspec

Repo for an empty, modifiable podspec. Pay this repo no attention.
Ruby
1
star
80

ios-13-uiimage-crash

Objective-C
1
star