SwipeCellKit 사용 (Swift5)
18446 단어 Swift5
먼저
SwipeCellKit을 사용할 때의 설명 기사가 됩니다.
기사 열람의 대상자는, tableview의 cell를 커스터마이즈 하고 싶은 사람입니다.
나 자신, 셀을 스와이프했을 때에 이미지와 문장을 표시하고 싶어서 사용했습니다.
보충 설명으로서 Apple의 공식에서도 swipecellkit 같은 기능이 제공되고 있습니다만,
이미지와 문장을 표시했을 때, 표시 위치가 어긋나서 나의 기대대로가 되지 않았습니다. . .
공식적인 기능이라고 기대대로 되지 않는다고 하는 사람도 대상으로 한 기사가 되고 있습니다.
완성 화면

SwipeCellKit의 공식으로 한 번 커스터마이징 성능을 확인하는 것이 좋습니다.
SwipeCellKit 공식 사이트
개발 환경

SwipeCellKit의 공식으로 한 번 커스터마이징 성능을 확인하는 것이 좋습니다.
SwipeCellKit 공식 사이트
개발 환경
이용까지의 흐름
1. tableview 준비
tableview와 tableviewcell을 viewcontroller에 붙입니다.
셀의 설정란의 Identifier는 「cell」로 설정합니다.
적당히 UILabel도 설치합니다.

그런 다음 UITableViewCell 파일을 만듭니다.

파일을 만든 후 StoryBoard에서 셀에 클래스를 설정합니다.

마지막으로 tableview와 tableviewcell을 프로그램과 연결합니다.
ViewController

TableViewCell

tableview의 준비는 종료입니다.
2. cocoapod에서 SwipeCellKit 다운로드
터미널에서 프로젝트 계층 구조로 이동하고 pod init 명령으로 podfile을 만듭니다.

podfile에 사용하고 싶은 OSS를 기입합니다.
이번은 SwipeCellKit이므로 "pod 'SwipeCellKit'"라고 기입합니다.

작성이 완료되면 pod install 명령으로 SwipeCellKit을 다운로드합니다.

마지막으로 프로젝트 폴더를 열고 확장자가 xcworkspace인 폴더를 엽니다.

이것으로 cocoapod에서 SwipeCellKit 다운로드가 종료됩니다.
3. SwipeCellKit import
다음으로 다음과 같이 프로그램을 작성합니다.
프로그램 안에 코멘트를 써서 내용을 읽고 이해할 수 있다고 생각합니다.
ViewController.swift
import UIKit
import SwipeCellKit
//SwipeTableViewCellDelegateを追加。
class ViewController: UIViewController,UITableViewDelegate,UITableViewDataSource,SwipeTableViewCellDelegate {
@IBOutlet weak var tableView: UITableView!
//cellのlabelに表示する値の配列
var array = [111,222,333,444,555,666,777,888,999]
override func viewDidLoad() {
super.viewDidLoad()
tableView.delegate = self
tableView.dataSource = self
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return array.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! TableViewCell
//cell.delegateはswipecellkitを使う際に必須の処理。
cell.delegate = self
cell.titleLabel?.text = String(array[indexPath.row])
return cell
}
//swipecellkit swipetableviewdelegateのメソッド
//スワイプした際に表示される文字や画像を設定。またタップした際の処理も設定
func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath, for orientation: SwipeActionsOrientation) -> [SwipeAction]? {
//右スワイプをした際の処理。今回は何も処理を行わない。
guard orientation == .right else { return nil }
//左スワイプした際の処理。
let deleteAction = SwipeAction(style: .destructive, title: "削除") { action, indexPath in
//cellの状態を解除する処理。必須の処理。
action.fulfill(with: .reset)
/*********************************/
let alert: UIAlertController = UIAlertController(title: "Cellを削除", message: "削除してもよろしいでしょうか?", preferredStyle: UIAlertController.Style.alert)
let defaultAction: UIAlertAction = UIAlertAction(title: "OK", style: UIAlertAction.Style.default, handler:{
(action: UIAlertAction!) -> Void in
print("OK")
self.array.remove(at: indexPath.row)
tableView.deleteRows(at: [indexPath], with: .fade)
})
let cancelAction: UIAlertAction = UIAlertAction(title: "キャンセル", style: UIAlertAction.Style.cancel, handler:{
(action: UIAlertAction!) -> Void in
print("Cancel")
})
alert.addAction(cancelAction)
alert.addAction(defaultAction)
self.present(alert, animated: true, completion: nil)
/*********************************/
}
//スワイプした際に表示される画像の設定。
deleteAction.image = UIImage(named: "delete")
return [deleteAction]
}
//スワイプ時の表示形式の設定。SwipeCellKitの公式サイトを見ると一発でわかる。
func tableView(_ tableView: UITableView, editActionsOptionsForRowAt indexPath: IndexPath, for orientation: SwipeActionsOrientation) -> SwipeOptions {
var options = SwipeOptions()
options.expansionStyle = .destructive
options.transitionStyle = .border
return options
}
}
TableViewCell.swift
import UIKit
import SwipeCellKit
//UITableViewCellからSwipeTableViewCellにする
class TableViewCell: SwipeTableViewCell {
@IBOutlet weak var titleLabel: UILabel!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for the selected state
}
}
이미지에는 항상 신세를 지고 있는 icons8 의 사이트에서 취득한 이미지를 사용했습니다.
icons8을 사용할 때는 이용 약관을 보고 사용하십시오.
4. 동작 확인
실제로 빌드하고 이용해 보면, 맨 위의 완성 화면과 같은 것이 되어 있다고 생각합니다.
인용
icons8
SwipeCellKit
Reference
이 문제에 관하여(SwipeCellKit 사용 (Swift5)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/unicoonn1/items/74d73964698ef7f3785c
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(SwipeCellKit 사용 (Swift5)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/unicoonn1/items/74d73964698ef7f3785c텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)