EKCollectionLayout 1.0.5

EKCollectionLayout 1.0.5

×

由 Erik Kamalov 维护。

EKCollectionLayout 1.0.5

  • 由
  • Erik Kamalov

集合视图布局

关于

展示多媒体内容最好的方法是选择集合。集合视图是在 App Store 和其他类似电子商务平台中展示和导航产品的首选工具。我们设计了几种具有平滑动画行为和优化代码的集合视图布局，您可以将它们应用到您的应用中。设计与 Dribble 上。

如果您👍项目，不要忘记⭐️我
关注最新更新 Follow me🤙



contributions welcome Swift Version CocoaPods Build Status Carthage compatible License: MIT

需求

  • iOS 12.2+
  • Xcode 11+
  • Swift 5.0+

功能

本仓库中包含2种布局，之后将会添加更多

示例

首先克隆仓库，然后从根目录运行carthage update。示例应用程序是观察EKCollectionLayout运作的最佳方式。只需打开EKCollectionLayout.xcodeproj并运行Example方案。

安装

CocoaPods

EKLayout可以通过CocoaPods获取。要安装，只需将以下行添加到您的Podfile。

pod 'EKCollectionLayout'

Carthage

Carthage是一款分散的依赖管理器，它构建您的依赖项并为您提供了二进制框架。

要使用Carthage将EKCollectionLayout集成到Xcode项目中，请在其Cartfile中指定它。

github "ekamalov/EKCollectionLayout"

运行carthage update以构建框架，并将构建的EKCollectionLayout.framework拖入Xcode项目。

在应用程序目标的“构建阶段”设置标签页上，点击“+”图标并选择“New Run Script Phase”，然后添加框架路径，如Carthage入门步骤4、5和6中所述。

手动

如果你不希望使用上述任何依赖管理器，你可以手动将 EKCollectionLayout 集成到你的项目中。只需将 Sources 文件夹拖入你的 Xcode 项目中即可。

用法

安装库并导入模块 EKCollectionLayout 后，EKLayoutFlow 是从 UICollectionViewFlowLayout 继承的基本类。

let layout = EKLayoutFlow(minimumLineSpacing: 15, scrollDirection: .horizontal, itemSize: CGSize)
let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)

如果你想要使用自定义布局，使用 configurator 属性。你也可以创建自己的 configurators。你可以在 贡献 部分中了解如何创建 configurator。

/// Example
 let layout = EKLayoutFlow(minimumLineSpacing: 15, scrollDirection: .horizontal,
 			  itemSize: .init(width: 325, height: 225))

layout.configurator = EKCarouselLayout(scaleItemSize: .init(width: 325, height: 200))

let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)

轮播

EKCarouselLayout 此布局是一个简单的水平布局，将元素吸附到中心。默认情况下，第一个元素居中，左侧留出空白。

// Example
let layout = EKLayoutFlow(minimumLineSpacing: 15,
			  scrollDirection: .horizontal,
			  itemSize: .init(width: 325, height: 225))

layout.configurator = EKCarouselLayout(scaleItemSize: .init(width: 325, height: 200))
let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)

AppStore

EKAppStoreLayout 这是一个简单的来自 AppStore 的布局。

 let layout = EKLayoutFlow(minimumLineSpacing: 15,
			  scrollDirection: .horizontal,
			  itemSize: .init(width: 325, height: 225))
 layout.configurator = EKAppStoreLayout()
 let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)

贡献

贡献非常欢迎🙌。你可以帮助我改进这个项目。我接受所有的提议。以下我将描述如何创建。我创建了 EKLayoutConfigurator 协议。你可以创建一个类并实现协议方法。在基类 configurator 中有一个配置器的属性。这个属性只接受实现了 EKLayoutConfigurator 协议的类。

@objc public protocol EKLayoutConfigurator {
    /// This method uses it to calculate and return the width and height of the collection view’s content.
    /// - Parameter flow: Layout object
    @objc optional func collectionViewContentSize(flow:EKLayoutFlow) -> CGSize
    /// This method used to prepare items for displaying
    /// - Parameter flow: Layout object
    @objc optional func prepare(layout flow:EKLayoutFlow)
    /// The collection view calls -prepareLayout once at its first layout as the first message to the layout instance.
    /// - Parameter flow: Layout object
    @objc optional func prepareCache(flow:EKLayoutFlow) -> [IndexPath: UICollectionViewLayoutAttributes]
    /// This method uses to control the cell.
    /// - Parameter flow: Layout object
    /// - Parameter attributes: A layout object that manages the layout-related attributes for a given item in a collection view.
    @objc optional func transform(flow:EKLayoutFlow, attributes: UICollectionViewLayoutAttributes)
    /// This method uses it to return the point at which to stop scrolling.
    /// - Parameter flow: Layout object
    /// - Parameter proposedContentOffset: The proposed point (in the collection view’s content view) at which to stop scrolling. This is the value at which scrolling would naturally stop if no adjustments were made. The point reflects the upper-left corner of the visible content.
    /// - Parameter velocity: The current scrolling velocity along both the horizontal and vertical axes. This value is measured in points per second.
    @objc optional func targetContentOffset(flow:EKLayoutFlow, proposedContentOffset: CGPoint, velocity: CGPoint) -> CGPoint
}

为了清晰起见，你可以查看我实现的布局 Carousel 布局。

许可协议

EKCollectionLayout 采用 MIT 许可协议发布。有关详细信息，请参阅 LICENSE.md 文件。

  MIT License

  Copyright (c) 2019 Erik Kamalov <[email protected]>

  Permission is hereby granted, free of charge, to any person obtaining a copy
  of this software and associated documentation files (the "Software"), to deal
  in the Software without restriction, including without limitation the rights
  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  copies of the Software, and to permit persons to whom the Software is
  furnished to do so, subject to the following conditions:

  The above copyright notice and this permission notice shall be included in all
  copies or substantial portions of the Software.

  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  SOFTWARE.