Interact with item inside widgets iOS14

Question

I am trying to create a medium Widget like in YouTube Music, but I am don't understand how to create an interaction with the particular item in a Widget. How my app should understand when user press on first or second item and then how I am must handle this action inside app. My app use Swift not SwiftUI, only for a Widget I use SwiftUI. In past I didn't have experience with a SwityUI.

My code for Widget:

struct WidgetTestEntryView : View {
    var entry: Provider.Entry

    var body: some View {
        
        VStack {
            HStack(spacing: 100){
                Text("Favourite").foregroundColor(.white).font(.system(size: 16, weight: .bold, design: .default))
                Image("Label").resizable().frame(width: 80, height: 15, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                
            }.frame(maxWidth: .infinity, maxHeight: 50, alignment: .center).background(Color.black).offset(y: -9)
            
            
            HStack {
                Spacer()
                Button(action: {}) {
                    Image("").resizable().frame(width: 70, height: 70)
                        .cornerRadius(10)
                        .background(Color(red: 0.218, green: 0.215, blue: 0.25))
                }.cornerRadius(10).onTapGesture {
                    let a = ViewController()
                    a.data.text = "Tap"
                }

                Button(action: {}) {
                    Image("").resizable().frame(width: 70, height: 70)
                        .cornerRadius(10)
                        .background(Color(red: 0.218, green: 0.215, blue: 0.25))
                }.cornerRadius(10).onTapGesture {
                    let a = ViewController()
                    a.data.text = "Tap"
                }

                Button(action: {}) {
                    Image("").resizable().frame(width: 70, height: 70)
                        .cornerRadius(10)
                        .background(Color(red: 0.218, green: 0.215, blue: 0.25))
                }.cornerRadius(10).onTapGesture {
                    let a = ViewController()
                    a.data.text = "Tap"
                }

                Button(action: {}) {
                    Image("").resizable().frame(width: 70, height: 70)
                        .cornerRadius(10)
                        .background(Color(red: 0.218, green: 0.215, blue: 0.25))
                }.cornerRadius(10).onTapGesture {
                    let a = ViewController()
                    a.data.text = "Tap"
                }

                Spacer().frame(width: 10, height: 10, alignment: .center)
            }.background(Color(red: 0.118, green: 0.118, blue: 0.15)).offset(y: -9)
            
            
        }.frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center).background(Color(red: 0.118, green: 0.118, blue: 0.15))
    }
}

You can't interact with widgets apart from redirecting to the main app (which means you can't use buttons with actions etc). However, you can pass actions as deep links - see: [Perform a deeplink from SwiftUI widget on tap](https://stackoverflow.com/q/64230355/8697793) and [Detect app launch from WidgetKit widget extension](https://stackoverflow.com/q/63697132/8697793). — pawello2222, Feb 17 '21 at 15:14

score 3 · Accepted Answer · answered Feb 24 '21 at 08:52

You can do this using Link in SwiftUI.

Link(destination: url, label: {
  // add your UI components in this block on which you want to perform click action.
}

url: Provide a unique string to identify widget action in the main app.

Now In the main app, use below method in AppDelegate.swift file:

func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
}

In this method, you can identify the URL that comes from the WidgetKit action.

Interact with item inside widgets iOS14

1 Answers1