You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在CalendarKit中为TimelinePagerView添加EventView?

解决TimelinePagerView无法显示EventView的问题

核心问题与修复步骤:

  • 必须设置数据源代理:TimelinePagerView需要通过数据源获取事件数据,原代码未设置dataSource,导致eventsForDate方法从未被调用。
  • 修正事件返回逻辑:原代码会累积所有日期的事件,导致返回的事件与当前显示日期不匹配,应直接返回当前指定日期的事件。

修复后的完整代码:

import UIKit
import CalendarKit

class ViewController: UIViewController, EventDataSource {
    
    @IBOutlet weak var timelinePagerView: TimelinePagerView!
    
    let eventData = ["event1", "event2", "event3", "event4"]
    
    var timelineStyle = TimelineStyle()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 关键:绑定数据源代理
        timelinePagerView.dataSource = self
        
        timelineStyle.eventGap = 1
        timelinePagerView.updateStyle(timelineStyle)
        timelinePagerView.autoScrollToFirstEvent = true
        timelinePagerView.reloadData()
    }
    
    func eventsForDate(_ date: Date) -> [CalendarKit.EventDescriptor] {
        // 直接返回当前日期对应的事件
        return generateEventsForDate(date)
    }
    
    private func generateEventsForDate(_ date: Date) -> [EventDescriptor] {
        let workingDate1 = Calendar.current.date(byAdding: .hour, value: 9, to: date)!
        let workingDate2 = Calendar.current.date(byAdding: .hour, value: 11, to: date)!
        let workingDate3 = Calendar.current.date(byAdding: .hour, value: 13, to: date)!
        let workingDate4 = Calendar.current.date(byAdding: .hour, value: 17, to: date)!
        var events = [Event]()
        
        for i in 0...3 {
            let event = Event()
            
            switch i {
            case 0:
                event.dateInterval = DateInterval(start: workingDate1, duration: 120 * 60)
            case 1:
                event.dateInterval = DateInterval(start: workingDate2, duration: 60 * 60)
            case 2:
                event.dateInterval = DateInterval(start: workingDate3, duration: 240 * 60)
            case 3:
                event.dateInterval = DateInterval(start: workingDate4, duration: 60 * 60)
            default:
                break
            }
            
            event.text = eventData[i]
            event.color = [0,1,3].contains(i) ? .red : .blue
            event.isAllDay = false
            event.lineBreakMode = .byTruncatingTail
            event.userInfo = String(i)
            
            events.append(event)
        }
        return events
    }
}

额外说明:

  • 移除了冗余的全局事件缓存变量,eventsForDate会在每次切换日期时被调用,直接返回对应日期的事件即可。
  • 简化了颜色判断逻辑,让代码更简洁易读。
  • 确保事件的dateInterval起始时间与传入的date绑定,保证事件显示在正确的日期时间轴上。

内容的提问来源于stack exchange,提问作者Kawboy442

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.14 01:53:19