IOS Uicollectionview Getting Started 01 introduction

When the first generation of ipad is released, the album Program is quite eye-catching, and it displays photos in a unique way with a variety of layouts, allowing a flat form view:

It can also be viewed hierarchically by Category:

You can also use gestures to toggle between different layouts in an awesome way. We can do this using the GridView and some other layouts, but it's too much trouble, starting with iOS6, we can use Uicollectionview to implement it, and we can easily add custom layouts and custom transformations to the program.

Uicollectionviewcontroller parsing

Let's take a sample diagram to see how Uicollectionviewcontroller is composed:

The Uicollectionviewcontroller consists of the following components:

• Uicollectionview: The main view that is used to display content, similar to UITableView. Uicollection does not need to be as large as its viewcontroller, as shown, there are some voids above the Uicollectionview used to display a text field for the lookup.
• Uicollectionviewcell: Similar to UITableView's UITableViewCell. These cells are added to the content as Uicollectionview. The cell can be created programmatically or through IB.
• Supplementary views: If we have some additional information that we want to show to Uicollectionview but this information does not belong to Uicollectionviewcell, we need to use supplementary view. such as headers and footer.
• Decoration View: If we want to make uicollectionview look better, we can use some decorative View, similar to the background map and logo map.
• Uicollectionviewlayout:uicollectionview don't know how to display cell,uicollectionviewlayout on the screen is the job. It uses a series of proxy methods to place a single cell into the Uicollectionview. Layout can be changed dynamically, in the process of change, we can add animation effect.
• Uicollectionviewflowlayout: By inheriting uicollectionviewlayout, we can create a custom layout. But Apple offers the Igetter basic "flow-based" layout. It arranges elements in a grid-like manner at the size of an element. We can use this layout class to make some interesting visual effects.

Create Flicker Search Sample Project

Throughout the tutorial, we will create an application called Flicker Search, which is a cool way to browse photos and search and download photos in flicker via the search bar:

Create a single view application and select device for ipad:

Add a picture to assets, you can download it here: Uicollectionview sample program Picture Resource

IOS Uicollectionview Getting Started 01 introduction