mirror of
https://github.com/material-components/material-components-ios.git
synced 2026-02-20 08:27:32 +08:00
eed028eacb
* [Docs] Marks component files as API documentation roots. Used by the site generator to determine where to build API docs. I marked everything built by the previous version. * [Docs] Adds a prefix to all Material guidelines links. * [Docs] Adds API doc links to some components.
98 lines
2.7 KiB
Markdown
98 lines
2.7 KiB
Markdown
<!--docs:
|
|
title: "Collection Layout Attributes"
|
|
layout: detail
|
|
section: components
|
|
excerpt: "Allows passing layout attributes to the cells and supplementary views."
|
|
iconId: list
|
|
path: /catalog/collections/collection-layout-attributes/
|
|
api_doc_root: true
|
|
-->
|
|
|
|
# Collection Layout Attributes
|
|
|
|
Allows passing layout attributes to the cells and supplementary views.
|
|
|
|
## Design & API Documentation
|
|
|
|
<ul class="icon-list">
|
|
<li class="icon-list-item icon-list-item--link"><a href="https://material.io/components/ios/catalog/collections/collection-layout-attributes/api-docs/Classes/MDCCollectionViewLayoutAttributes.html">API: MDCCollectionViewLayoutAttributes</a></li>
|
|
</ul>
|
|
|
|
- - -
|
|
|
|
## Installation
|
|
|
|
### Requirements
|
|
|
|
- Xcode 7.0 or higher.
|
|
- iOS SDK version 7.0 or higher.
|
|
|
|
### Installation with CocoaPods
|
|
|
|
To add this component to your Xcode project using CocoaPods, add the following to your `Podfile`:
|
|
|
|
```
|
|
pod 'MaterialComponents/CollectionLayoutAttributes'
|
|
```
|
|
<!--{: .code-renderer.code-renderer--install }-->
|
|
|
|
Then, run the following command:
|
|
|
|
``` bash
|
|
pod install
|
|
```
|
|
|
|
- - -
|
|
|
|
## Usage
|
|
|
|
### Importing
|
|
|
|
Before using Collection Layout Attributes, you'll need to import it:
|
|
|
|
<!--<div class="material-code-render" markdown="1">-->
|
|
#### Swift
|
|
``` swift
|
|
import MaterialComponents.MaterialCollectionLayoutAttributes
|
|
```
|
|
|
|
#### Objective-C
|
|
``` objc
|
|
#import "MaterialCollectionLayoutAttributes.h"
|
|
```
|
|
<!--</div>-->
|
|
|
|
The `MDCCollectionViewLayoutAttributes` class allows passing properties to a cell from a collection
|
|
view layout. Override the `-applyLayoutAttributes` method of any `UICollectionReusableView` or
|
|
`UICollectionViewCell` subclasses, then apply any of the properties of the attributes class.
|
|
|
|
<!--<div class="material-code-render" markdown="1">-->
|
|
#### Swift
|
|
``` swift
|
|
override func apply(_ layoutAttributes: UICollectionViewLayoutAttributes) {
|
|
super.apply(layoutAttributes)
|
|
if let attr = layoutAttributes as? MDCCollectionViewLayoutAttributes {
|
|
if (attr.representedElementCategory == .cell) {
|
|
|
|
// Example to set a background image to the cell background view.
|
|
self.backgroundView = UIImageView(image: attr.backgroundImage)
|
|
}
|
|
}
|
|
}
|
|
```
|
|
#### Objective-C
|
|
``` objc
|
|
- (void)applyLayoutAttributes:(UICollectionViewLayoutAttributes *)layoutAttributes {
|
|
[super applyLayoutAttributes:layoutAttributes];
|
|
if ([layoutAttributes isKindOfClass:[MDCCollectionViewLayoutAttributes class]]) {
|
|
MDCCollectionViewLayoutAttributes *attr = (MDCCollectionViewLayoutAttributes *)layoutAttributes;
|
|
if (attr.representedElementCategory == UICollectionElementCategoryCell) {
|
|
|
|
// Example to set a background image to the cell background view.
|
|
self.backgroundView = [[UIImageView alloc] initWithImage:attr.backgroundImage];
|
|
}
|
|
}
|
|
}
|
|
```
|
|
<!--</div>-->
|