AEAccordion
  • October 14, 2023

UITableViewController with accordion effect (expand / collapse cells)

Simple and lightweight solution for making accordion effect in table view controller. Show detailed content on demand.

Index


Features


  • Create accordion effect in table view controller with less effort
  • Animate expansion / collapsing of cells as you want (optional)
  • Automatic scroll on cell expansion to make entire cell visible (optional)

Usage


  • Subclass AccordionTableViewCell and override setExpanded:animated:.

import AEAccordion

final class ReadmeTableViewCell: AccordionTableViewCell {

static let reuseIdentifier = “ReadmeTableViewCell”

@IBOutlet weak var headerView: HeaderView!
@IBOutlet weak var detailView: DetailView!

// MARK: Override

override func setExpanded(_ expanded: Bool, animated: Bool) {
super.setExpanded(expanded, animated: animated)

if animated {
UIView.transition(with: detailView, duration: 0.3, animations: {
self.detailView.isHidden = !expanded
}, completion: nil)
} else {
detailView.isHidden = !expanded
}
}

}

  • Subclass AccordionTableViewController and configure cell height based on expandedIndexPaths.

import AEAccordion

final class ReadmeTableViewController: AccordionTableViewController {

override func viewDidLoad() {
super.viewDidLoad()
expandFirstCell()
}

func expandFirstCell() {
let firstCellIndexPath = IndexPath(row: 0, section: 0)
expandedIndexPaths.append(firstCellIndexPath)
}

// MARK: UITableViewDelegate

override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return expandedIndexPaths.contains(indexPath) ? 200.0 : 50.0
}

}

For more details check out Sources and Example.

Installation


Swift Package Manager:

.Package(url: “https://github.com/tadija/AEAccordion.git”, majorVersion: 2)

Carthage:

github “tadija/AEAccordion”

CocoaPods:

pod ‘AEAccordion’

GitHub


View Github

#animation #autolayout #cocoa #cocoapod #cocoapods #cocoatouch #collection #collectionkit #collectionview #collectionviewcell #collectionviewlayout #customlayout #dynamic #expandabletableview #flowlayout #hashtag #hashtags #ibinspectable #instagram #instagramanimation #ios #iosanimation #iosdevelopment #iossdk #iosswift #iosthirdparty #lightboxalgorithm #lightviewcontroller #objectivec #swift #swiftanimation #swiftcollection #swiftimage #swiftlibrary #swiftpackagemanager #swiftui #swiftuicomponents #table #tableview #tableviewcell #taglistview #tags #tagsview #uicollectionview #uicollectionviewanimation #uicollectionviewcell #uicollectionviewflowlayout #uicollectionviewlayout #uitableview #uitableviewcell #uitableviewcocoapods #uitableviewcontroller #xcode
YOU MIGHT ALSO LIKE...
Popup View

Floaters Toasts Popups Sheets

Drops 💧

A µFramework for showing alerts like the one used when copying from pasteboard or connecting Apple pencil.

MarqueeText

A SwiftUI Marquee or "scrolling text" effect found in Apple native apps. For when one line isn't enough, but two ...

TextBuilder

Introduction Text composition in SwiftUI can often be cumbersome, especially when there's logic affecting its format and content. TextBuilder leverages the ...

TextView

Download File -> Swift Packages -> Add Package Dependency... Select your project Enter https://github.com/kenmueller/TextView for the package repository URL Select Branch: master Click Finish ...