Using environmentObject in watchOS

Question

I am trying to use environmentObject in a watchOS6 app to bind my data model to my view.

I have created a simple, stand-alone Watch app in Xcode 11.

I created a new DataModel class

import Combine
import Foundation
import SwiftUI

final class DataModel: BindableObject {

    let didChange = PassthroughSubject<DataModel,Never>()

    var aString: String = "" {
        didSet {
            didChange.send(self)
        }
    }

}

In my ContentView struct I bind this class using @EnvironmentObject -

struct ContentView : View {

    @EnvironmentObject private var dataModel: DataModel

    var body: some View {
        Text($dataModel.aString.value)
    }
}

Finally, I attempt to inject an instance of the DataModel into the environment in the HostingController class -

class HostingController : WKHostingController<ContentView> {
    override var body: ContentView {
        return ContentView().environmentObject(DataModel())
    }
}

But, I get an error:

Cannot convert return expression of type '_ModifiedContent<ContentView, _EnvironmentKeyWritingModifier<DataModel?>>' to return type 'ContentView'

The error is because the WKHostingController is a generic that needs a concrete type - WKHostingController<ContentView> in this case.

A similar approach works perfectly with UIHostingController in an iOS app because UIHostingController isn't a generic class.

Is there some other way to inject the environment to a watchOS view?

Does this answer your question? [How to inject .environmentObject() in watchOS6](https://stackoverflow.com/questions/57559200/how-to-inject-environmentobject-in-watchos6) — Curiosity, Oct 27 '20 at 07:07

Matteo Pacini · Accepted Answer · 2019-06-12T06:53:12.777

54

You can use type erasure, AnyView in the case of SwiftUI View.

I would refactor WKHostingController to return AnyView.

This seems to compile fine on my end.

class HostingController : WKHostingController<AnyView> {
    override var body: AnyView {
        return AnyView(ContentView().environmentObject(DataModel()))
    }
}

edited Jun 12 '19 at 06:53

answered Jun 12 '19 at 06:28

Matteo Pacini

21,796
7
67
74

1

Thanks. I had tried `AnyView` but I hadn't used `AnyView(ContentView())` – Paulw11 Jun 12 '19 at 06:31
This doesn't work for me, I get the following error: "Property 'body' with type 'AnyView' cannot override a property with type 'ContentView'" – Brett Jul 28 '19 at 08:16
1

Just got back to this after a few months, fresh eyes helps. I still had ContentView in the Generic protocol declaration, changed to AnyView and works. – Brett Oct 10 '19 at 02:18
How do you get a child ContentView to access this in the latest WatchOS app templates? I have this working on my main ContentView, but when I route to a view with `NavigationLink` I can't figure out how that ContentView would have access to the same `@EnvironmentObject` – Brad Martin Jun 11 '20 at 13:49
1

This is bad answer as `AnyView` is performance heavy. Long story short, put your data model inside content view. [Here's better solution](https://stackoverflow.com/a/57560836/1162044.) – Boris Y. Aug 22 '20 at 22:31

score 2 · Answer 2 · answered Sep 14 '19 at 22:36

For anyone like Brett (in the comments) who was getting

"Property 'body' with type 'AnyView' cannot override a property with type 'ContentView'"

I got the same error because I hadn't replaced the return value and wrapped the ContentView being returned.

ie. this is what my first attempt looked like.. notice the WKHostingController<ContentView> that should be WKHostingController<AnyView>

class HostingController : WKHostingController<ContentView> {
    override var body: AnyView {
        return AnyView(ContentView().environmentObject(DataModel()))
    }
}

I had done that bit though, but I hadn't replaced ContentView in WKHostingController with AnyView, that worked for me. Thanks for reply. — Brett, Oct 10 '19 at 02:19

score 0 · Answer 3 · answered Apr 08 '20 at 20:45

Adding to Matteo's awesome answer,

If you want to use delegate then use like this:

class HostingController : WKHostingController<AnyView> {
    override var body: AnyView {
        var contentView = ContentView()
        contentView.environmentObject(DataModel())
        contentView.delegate = self
        let contentWrapperView = AnyView(contentView)
        return contentWrapperView
    }
}

Using environmentObject in watchOS

3 Answers3

Linked