JTAppleCalendar 以编程方式,单元格不显示
JTAppleCalendar programmatically, cells not showing
我正在尝试在没有故事板的情况下以编程方式实现 JTAppleCalendar,为单元格使用 xib 文件。我已经设置了委托和数据源,并实现了所需的功能,但单元格没有显示。我可以看到集合视图已设置并在 Viewcontroller 中可见(link 2 中图像中的蓝色方块),并且调用了 configureCalendar() 和 cellForItemAt(),但仍然没有数据已显示。
我错过了什么?
var calendarView: JTAppleCalendarView!
override func viewDidLoad() {
super.viewDidLoad()
calendarView = JTAppleCalendarView(frame: CGRect(x: 0, y: 0, width: 300, height: 300))
calendarView.register(CalendarCellView.self, forCellWithReuseIdentifier: "cell")
calendarView.ibCalendarDelegate = self
calendarView.ibCalendarDataSource = self
self.view.addSubview(calendarView)
self.view.bringSubview(toFront: calendarView)
self.calendarView.backgroundColor = UIColor.blue
}
extension TestViewController: JTAppleCalendarViewDataSource {
func configureCalendar(_ calendar: JTAppleCalendarView) -> ConfigurationParameters {
let formatter = DateFormatter()
formatter.dateFormat = "yyyy MM dd"
let startDate = formatter.date(from: "2016 02 01")! // You can use date generated from a formatter
let endDate = Date() // You can also use dates created from this function
let parameters = ConfigurationParameters(startDate: startDate,
endDate: endDate,
numberOfRows: 6, // Only 1, 2, 3, & 6 are allowed
calendar: Calendar.current,
generateInDates: .forAllMonths,
generateOutDates: .tillEndOfGrid,
firstDayOfWeek: .sunday)
return parameters
}
func calendar(_ calendar: JTAppleCalendarView, willDisplay cell: JTAppleCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath) {
}
}
extension TestViewController: JTAppleCalendarViewDelegate {
func calendar(_ calendar: JTAppleCalendarView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath) -> JTAppleCell {
let cell = calendar.dequeueReusableJTAppleCell(withReuseIdentifier: "cell", for: indexPath) as! CalendarCellView
cell.dayLabel?.text = cellState.text
print(cellState.text)
return cell
}
}
class CalendarCellView: JTAppleCell {
@IBOutlet var dayLabel: UILabel!
@IBOutlet var taskImage: UIImageView!
override func awakeFromNib() {
dayLabel.textColor = UIColor.red
self.backgroundColor = UIColor.blue
}
}
screenschot of xib cell
screenshot of how the collectionview currently looks
布局
JTAppleCalendarView
的超级class是UICollectionView
,它使用UICollectionViewFlowLayout
来布局项目。JTAppleCalendarView
提供CellSize
来配置项目大小,您也可以使用 UICollectionViewFlowLayout
来配置 Min Spacing
。
使用自定义单元格
我猜你使用 xib 来自定义 Cell,所以你必须使用 register(_ nib: UINib?, forCellWithReuseIdentifier identifier: String)
来注册 Cell.Finally,不要忘记为 dayLabel 添加约束。
例子
calendarView 的单元格大小为 40,宽度为 280(7 列),高度为 240(六行),单元格和行的最小间距为 0。
这是一种通过可能对您有用的代码实现 JTAppleCalendar 的可能方法:
注意:这只是启动的起点,运行进一步的定制取决于您
JTAppleCalendar 版本:8.0.3
在viewDidLoad中:
let cal = JTACMonthView(frame: CGRect.zero)
cal.backgroundColor = .white
cal.cellSize = 20
cal.calendarDelegate = self
cal.calendarDataSource = self
cal.register(DateCell.self, forCellWithReuseIdentifier: "calenderCellID")
view.addSubview(cal)
cal.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([cal.centerXAnchor.constraint(equalTo: view.centerXAnchor),
cal.topAnchor.constraint(equalTo: view.topAnchor),
cal.widthAnchor.constraint(equalToConstant: 200),
cal.heightAnchor.constraint(equalToConstant: 200)])
自定义单元格:
class DateCell: JTACDayCell {
var dateLabel : UILabel = {
let dateLabel = UILabel()
dateLabel.text = "sample"
return dateLabel
}()
override init(frame: CGRect) {
super.init(frame: frame)
addSubview(dateLabel)
dateLabel.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([dateLabel.centerXAnchor.constraint(equalTo: centerXAnchor),
dateLabel.centerYAnchor.constraint(equalTo: centerYAnchor),
dateLabel.heightAnchor.constraint(equalToConstant: 15)])
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
最后是数据源和委托方法:
func calendar(_ calendar: JTACMonthView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath) -> JTACDayCell {
let cell = calendar.dequeueReusableCell(withReuseIdentifier: calenderCellID, for: indexPath) as! DateCell
cell.dateLabel.text = cellState.text
return cell
}
func configureCalendar(_ calendar: JTACMonthView) -> ConfigurationParameters {
let formatter = DateFormatter()
formatter.dateFormat = "yyyy MM dd"
let startDate = formatter.date(from: "2016 02 01")!
let endDate = Date()
let parameters = ConfigurationParameters(startDate: startDate,
endDate: endDate,
numberOfRows: 6, // Only 1, 2, 3, & 6 are allowed
calendar: Calendar.current,
generateInDates: .forAllMonths,
generateOutDates: .tillEndOfGrid,
firstDayOfWeek: .sunday)
return parameters
}
func calendar(_ calendar: JTACMonthView, willDisplay cell: JTACDayCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath) {
let cell = cell as! DateCell
cell.dateLabel.text = cellState.text
}
注:根据this:
These 2 functions should contain the same code, therefore it is wise
to have a shared function to reduce code duplication. The only
difference between these two functions should be the first line of
code (the dequeuing code).
规定的功能是:
func calendar(_ calendar: JTACMonthView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath)
func calendar(_ calendar: JTACMonthView, willDisplay cell: JTACDayCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath)
我正在尝试在没有故事板的情况下以编程方式实现 JTAppleCalendar,为单元格使用 xib 文件。我已经设置了委托和数据源,并实现了所需的功能,但单元格没有显示。我可以看到集合视图已设置并在 Viewcontroller 中可见(link 2 中图像中的蓝色方块),并且调用了 configureCalendar() 和 cellForItemAt(),但仍然没有数据已显示。
我错过了什么?
var calendarView: JTAppleCalendarView!
override func viewDidLoad() {
super.viewDidLoad()
calendarView = JTAppleCalendarView(frame: CGRect(x: 0, y: 0, width: 300, height: 300))
calendarView.register(CalendarCellView.self, forCellWithReuseIdentifier: "cell")
calendarView.ibCalendarDelegate = self
calendarView.ibCalendarDataSource = self
self.view.addSubview(calendarView)
self.view.bringSubview(toFront: calendarView)
self.calendarView.backgroundColor = UIColor.blue
}
extension TestViewController: JTAppleCalendarViewDataSource {
func configureCalendar(_ calendar: JTAppleCalendarView) -> ConfigurationParameters {
let formatter = DateFormatter()
formatter.dateFormat = "yyyy MM dd"
let startDate = formatter.date(from: "2016 02 01")! // You can use date generated from a formatter
let endDate = Date() // You can also use dates created from this function
let parameters = ConfigurationParameters(startDate: startDate,
endDate: endDate,
numberOfRows: 6, // Only 1, 2, 3, & 6 are allowed
calendar: Calendar.current,
generateInDates: .forAllMonths,
generateOutDates: .tillEndOfGrid,
firstDayOfWeek: .sunday)
return parameters
}
func calendar(_ calendar: JTAppleCalendarView, willDisplay cell: JTAppleCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath) {
}
}
extension TestViewController: JTAppleCalendarViewDelegate {
func calendar(_ calendar: JTAppleCalendarView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath) -> JTAppleCell {
let cell = calendar.dequeueReusableJTAppleCell(withReuseIdentifier: "cell", for: indexPath) as! CalendarCellView
cell.dayLabel?.text = cellState.text
print(cellState.text)
return cell
}
}
class CalendarCellView: JTAppleCell {
@IBOutlet var dayLabel: UILabel!
@IBOutlet var taskImage: UIImageView!
override func awakeFromNib() {
dayLabel.textColor = UIColor.red
self.backgroundColor = UIColor.blue
}
}
screenschot of xib cell
screenshot of how the collectionview currently looks
布局
JTAppleCalendarView
的超级class是UICollectionView
,它使用UICollectionViewFlowLayout
来布局项目。JTAppleCalendarView
提供CellSize
来配置项目大小,您也可以使用 UICollectionViewFlowLayout
来配置 Min Spacing
。
使用自定义单元格
我猜你使用 xib 来自定义 Cell,所以你必须使用 register(_ nib: UINib?, forCellWithReuseIdentifier identifier: String)
来注册 Cell.Finally,不要忘记为 dayLabel 添加约束。
例子
calendarView 的单元格大小为 40,宽度为 280(7 列),高度为 240(六行),单元格和行的最小间距为 0。
这是一种通过可能对您有用的代码实现 JTAppleCalendar 的可能方法:
注意:这只是启动的起点,运行进一步的定制取决于您
JTAppleCalendar 版本:8.0.3
在viewDidLoad中:
let cal = JTACMonthView(frame: CGRect.zero)
cal.backgroundColor = .white
cal.cellSize = 20
cal.calendarDelegate = self
cal.calendarDataSource = self
cal.register(DateCell.self, forCellWithReuseIdentifier: "calenderCellID")
view.addSubview(cal)
cal.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([cal.centerXAnchor.constraint(equalTo: view.centerXAnchor),
cal.topAnchor.constraint(equalTo: view.topAnchor),
cal.widthAnchor.constraint(equalToConstant: 200),
cal.heightAnchor.constraint(equalToConstant: 200)])
自定义单元格:
class DateCell: JTACDayCell {
var dateLabel : UILabel = {
let dateLabel = UILabel()
dateLabel.text = "sample"
return dateLabel
}()
override init(frame: CGRect) {
super.init(frame: frame)
addSubview(dateLabel)
dateLabel.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([dateLabel.centerXAnchor.constraint(equalTo: centerXAnchor),
dateLabel.centerYAnchor.constraint(equalTo: centerYAnchor),
dateLabel.heightAnchor.constraint(equalToConstant: 15)])
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
最后是数据源和委托方法:
func calendar(_ calendar: JTACMonthView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath) -> JTACDayCell {
let cell = calendar.dequeueReusableCell(withReuseIdentifier: calenderCellID, for: indexPath) as! DateCell
cell.dateLabel.text = cellState.text
return cell
}
func configureCalendar(_ calendar: JTACMonthView) -> ConfigurationParameters {
let formatter = DateFormatter()
formatter.dateFormat = "yyyy MM dd"
let startDate = formatter.date(from: "2016 02 01")!
let endDate = Date()
let parameters = ConfigurationParameters(startDate: startDate,
endDate: endDate,
numberOfRows: 6, // Only 1, 2, 3, & 6 are allowed
calendar: Calendar.current,
generateInDates: .forAllMonths,
generateOutDates: .tillEndOfGrid,
firstDayOfWeek: .sunday)
return parameters
}
func calendar(_ calendar: JTACMonthView, willDisplay cell: JTACDayCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath) {
let cell = cell as! DateCell
cell.dateLabel.text = cellState.text
}
注:根据this:
These 2 functions should contain the same code, therefore it is wise to have a shared function to reduce code duplication. The only difference between these two functions should be the first line of code (the dequeuing code).
规定的功能是:
func calendar(_ calendar: JTACMonthView, cellForItemAt date: Date, cellState: CellState, indexPath: IndexPath)
func calendar(_ calendar: JTACMonthView, willDisplay cell: JTACDayCell, forItemAt date: Date, cellState: CellState, indexPath: IndexPath)