preface

WWDC, June 22, 2020 New features for iOS14 – widgets are officially available on iOS, and WidgetKit is officially available to developers.

It is because I have some understanding of Android widgets that I want to try iOS widget development, and found that there is no relevant article, so I write down my experience in learning WigetKit. The following are my experiences on the way of learning, and THERE may be some problems, I hope you can correct them.

At the same time, I have put the open source code written on the learning road – iWiget. After reading this article, I think it is useful to point a Star!

Project address: github.com/Littleor/iW…

Links from previous installments:

(iOS14)WidgetKit Development Practice 1- Getting to know iOS widgets

[iOS14]WidgetKit Development Practice 2- Develop a simple widget

Widget user configuration

We don’t need to write the widget user configuration interface ourselves. WidgetKit already does this for us. All we need to do is add a SiriIntent to get the data we need, and Then WidgetKit will automatically generate the corresponding configuration interface. To configure the Widget’s data, users simply hold down the Widget and click Edit Widget.

1. Add the corresponding SiriIntent

In the upper left navigation, select File->New->File and go to Siri Intent Definition File and add it to WidgetExtension.

2. Configure the Siri Intent Definition File

The configuration here depends on the data you need for the Widget

When opening Siri Intent Definition File, the new File should be empty, and the Intent should be added to the Editor in the navigation bar

This is what it should look like when it’s added

Then configure the Intent

Note that the configuration is not Response!

Target = ‘Widget’ Extensive!

Xcode12-beta is currently buggy, you need to restart Xcode to display configuration items!

Xcode12-beta is currently buggy, you need to restart Xcode to display configuration items!

Xcode12-beta is currently buggy, you need to restart Xcode to display configuration items!

You need to change the type to View and then change the Title to your own name. In the Parameter you want the user to type in, use content as an example.

3. Modify the Widget configuration

Open the Swift file and replace the Widget content with an Intent

public var body: some WidgetConfiguration {
        IntentConfiguration(kind: kind, intent: ConfigurationIntent.self, provider: Provider(), placeholder: PlaceholderView()) { entry in
            WidgetDemoEntryView(entry: entry)
        }
        .configurationDisplayName("My Widget")
        .description("This is an example widget.")}Copy the code

Change the Provider type to IntentTimelineProvider:

So here’s the code that Xcode automatically generates and there’s a lot of unnecessary code that basically changes to IntentTimelineProvider

struct Provider: IntentTimelineProvider {
    public func snapshot(for configuration: ConfigurationIntent, with context: Context, completion: @escaping (SimpleEntry) -> ()) {
        let entry = SimpleEntry(date: Date(), configuration: configuration)
        completion(entry)
    }
    
    public func timeline(for configuration: ConfigurationIntent, with context: Context, completion: @escaping (Timeline<Entry>) -> ()) {
        var entries: [SimpleEntry] = []
        
        // Generate a timeline consisting of five entries an hour apart, starting from the current date.
        let currentDate = Date()
        for hourOffset in 0 ..< 5 {
            let entryDate = Calendar.current.date(byAdding: .hour, value: hourOffset, to: currentDate)!
            let entry = SimpleEntry(date: entryDate, configuration: configuration)
            entries.append(entry)
        }
        
        let timeline = Timeline(entries: entries, policy: .atEnd)
        completion(timeline)
    }
}
Copy the code

Display the content in the view:

struct DemoWidgetEntryView : View {
    var entry: Provider.Entry

    var body: some View {
        Text(entry.content == nil ? "PlaceHolder": entry.content!) }}Copy the code

4. Run the test to the real machine

conclusion

Widgetkit for iOS is very user-friendly for user configuration development. You only need to use Xcode to provide visual tools to add parameters to create a configuration interface, convenient and unified UI.

Much easier and faster than using a specified Fragment for Andorid.

Widgetkit is packaged directly into the parameters of the Intent and can be added to use in Entry.

Afterword.

This time, I have covered the process of adding the user configuration interface to the Widget, and the click-to-click interaction of the Widget.

See GitHub for the full code

WidgetKit will continue to be developed in the future, and iWiget will continue to be improved. If this article is useful to you, click on the Star!

Project address: github.com/Littleor/iW…