Adding Events to the Calendar in SwiftUI (Calendar Series Part II)

We’ve learned (read-events-from-the-calendar-in-swiftui/ ) how to read calendar events. In this post, we’ll learn how to add an event to the calendar.

We’ll follow these steps:

1. Add the logic to the events manager.
2. Create a new view in the app to create an event with a title for the current date.

Let’s start by adding a new function, addEvent, in the EventStoreManager:

func addEvent(date: Date, title: String) {
        let event = EKEvent(eventStore: self.eventStore)
        event.calendar = eventStore.defaultCalendarForNewEvents
        event.title = title
        event.startDate = date
        event.endDate =  Calendar.current.date(byAdding: .hour, value: 1, to: date)
        
        do {
            try self.eventStore.save(event, span: .thisEvent, commit: true)
        } catch {
            print("Saving error \(error)")
        }
    }

(please get the code of the EventStoreManager from the previous post).

In this tutorial, we’ll create an event on a specified date. To simplify, we set the endDate by adding one hour to the startDate and set the title. However, pay special attention to the save function. We pass .thisEvent, which means it’s a single occurrence event and not recurring. The commit parameter is set to true, meaning the event is immediately saved, and we do not need to call the commit function later.

Now, let’s take a look at the ContentView:

struct ContentView: View {
    @State var eventsManager = EventStoreManager()
    @State var isPresented = false
    
    var body: some View {
        NavigationStack {
            VStack {
                List(eventsManager.events, id:\.self) { event in
                    Text(event.title)
                }
            }
            .padding()
            .toolbar(content: {
                ToolbarItem(placement: .confirmationAction) {
                    Button("+") {
                        isPresented = true
                    }.font(.largeTitle)
                }
            })
            .sheet(isPresented: $isPresented, content: {
                EventView()
            })
        }.onAppear {
            Task {
                await loadEvents()
            }
        }.onChange(of: isPresented) {
            if !isPresented {
                Task {
                    await loadEvents()
                }
            }
        }
    }
    
    func loadEvents() async {
        do {
            try await eventsManager.setEventDate(date: Date())
        } catch {
            print("Error")
        }
    }
}

Starting from the end, we see a loadEvent function that sets the date for which we want to load the events. This function is triggered when the view first appears and every time the sheet is closed.

The sheet contains the view to create the new event:

struct EventView: View {
    @State var title = ""
    @State var eventsManager = EventStoreManager()
    @Environment(\.dismiss) private var dismiss
    
    var body: some View {
        VStack {
            TextField("Event title", text: $title)
            Button("Save") {
                eventsManager.addEvent(date: Date(), title: title)
                dismiss()
            }
        }.padding()
    }
}

This view contains only a text field to add the event’s title and a button to call the addEvent function and close the sheet. If you have never used a sheet in SwiftUI, please take a look here https://nicoladefilippo.com/swiftui-sheets-demystified-episode-i/ .

The code can be improved with other best practices, but the purpose of this post is solely to demonstrate how to add an event to the calendar.

The code.

To subscribe to my newsletter [https://nicoladefilippo.com/#mailinglist]

Note: English is not my native language, so I apologize for any errors. I use AI solely to generate the banner of the post; the content is human-generated.