How to Build a Widget in Swift with WidgetKit

I teach you the basic concepts you'll need to know when building a Widget in Swift. We discuss the Widget timeline, snapshot and how they work. As well as design principles of a great widget. This video will get you up and running into the world of building awesome Widgets.

This is a free preview of my WidgetKit course. This is only the first section that covers a basic widget. We get much more advanced in the full course with network calls, core data, configurations, lock screen widgets, live activities and dynamic island.

Use code PREVIEW to get 15% off the complete course at

.swift file to copy and paste MonthConfig from (as seen in video):

WWDC 2020 - Design Great Widgets:

Human Interface Guidelines - Widget Section:

Twitter:

Book and learning recommendations that help out the channel if you decide to purchase (Affiliate Links):

Paul Hudson's Hacking With Swift:

Donny Wals - Combine:

Mark Moeyken’s SwiftUI Books:

Ray Wenderlich Books:

Links to my iOS Dev Setup & iOS Dev Book Recommendations

Timestamps:
0:00 - What you will learn
2:15 - What you need to know about Widgets
5:11 - How to design great Widgets
9:30 - Setting up our Xcode project
12:12 - WidgetKit code explanation
20:23 - Monthly Widget UI design & basic functionality
36:00 - Dynamically change UI for each month
49:07 - How to build on this

#swift #softwaredeveloper #iosdeveloper

[Lrriedley]

I bought the full course and if your goal is to learn to build widgets, live activities and more, it is a must buy! Fantastic content!

[naeemdful]

Thank you Sean Allen for this easy and clear and simple view for Widget

[Elvis-is-king-ls]

Clear and consice explanation. Should definitely have watched this before coding my first line!

[apbrandom]

Great tutorial! Thank you very much, especially for copying and pasting it🔥

[dre]

Oh man! This preview is enticing me to get the course! I'm trying to hold off until I finish a project, But wanted you to know that this preview was a great idea!
Thanks for giving us this handy knowledge Sean! So glad you're back at it with the videos!

[nykse]

I made a counter app where the user can track anything they want to quit, such as smoking. What I want is, when the user starts the tracking process, they can see the progress on the home screen with a home widget. I can calculate the date difference, and there is no problem with that. However, I want to calculate the date difference every hour and refresh the home widget every hour. How can I do that?

[elemento_artz]

Great vid! although dates are tricky and probably overcomplicates things while learning Widgets. Simply Data, that's all we want for now 😅

[martinpihooja]

0:42:25 There are two possibilities to change the file name. 
First and fastest, slow double click the file name and change it. 
Second option, look at the right, Inspectors view -> Identity and Type -> Name.
Great tutorial and nice explanations.

[robinandthedog]

haha I got you typing capitals, just type vstack and it will complete to VStack, great tutorial by the way, I've build many widgets already, but still struggle to get a perfect adaptive design, the widgets differ so much in size over iPhone/iPad models, even using geometry reader...

[FloWritesCode]

Great overview, Sean! I find your MonthConfig approach very interesting, personally I think I would have tried to solve that with an enum.

[ammarahmad]

Your reaction about how -3 works on code made me laugh, but it's still a good video about WidgetKit, thanks.

[garylow-sypc]

0:47:52 You went to September because -3 means to go back 3 months from December, as 0 represents December last year. Since 12 - 3 = 9, the calculation gave you a date in September last year

[mikeshafer]

I just tried to follow your example but right in the beginning with the gradient, it doesn't fill the entire widget but just a square. How do I get this to fill the whole widget in iOS 17.2? I just signed up for the course, perhaps it covers that part. I definitely want to learn how to get dynamic data from a JSON endpoint.

[PavanKumar-ivx]

@seanallen . Please make one video about the interactive widget

[AlanJoseph-qn]

Amazing! I was having a hard time getting the initial colors you paste. the ones that were blocks in 'Color(*)'. Is there an easy way to get the desired colors other than the Xcode color library?

Thanks again!!

[sebasy]

If i have an api in my app folder.. how i can call the data? Is there any video to learn? Thank you, u are the best!

[ulludots]

I love the video but I met a problem where your code does not exist. I am using Xcode 12.4 so please help me

[gn]

How can i add custom button "action" on Widget ? 🧐

[_Astr_]

I have Xcode 12.5. Do I need Xcode 13+ for this course?

[ilouran]

do you know how to prevent opening app from widget ? I just wanna use backgorund callback, pls tell me if you have any idea