Sheets don’t inherit the surroundings – Ole Begemann

Not like different views, modal sheets in SwiftUI do not inherit the surroundings from their father or mother.

The surroundings is SwiftUI’s solution to go information implicitly to youngster views. Amongst different issues, the surroundings incorporates app- or system-wide preferences, such because the consumer’s locale or the present coloration scheme. Primarily, you possibly can consider the surroundings as a big, heterogeneous dictionary that will get handed implicitly to each view.

Many built-in SwiftUI views take the surroundings under consideration once they draw themselves. We are able to make the most of this to override a setting for all youngster views with a single line of code. Contemplate this instance:

VStack(spacing: 8) {
  Textual content("Line 1")
  HStack {
    Textual content("Line 2")
    VStack {
      Textual content("Line 2a")
      Textual content("Line 2b")
    }
  }.font(.title)
  Textual content("Line 3")
}

The .font(.title) modifier on the HStack mutates the corresponding worth within the present surroundings, which then will get handed to the stack’s youngster views. And since Textual content grabs its font from the surroundings, all textual content views on this part of the view tree are rendered with a bigger font measurement. Be aware that the modified surroundings additionally applies to oblique kids of the HStack.

The next instance creates a root view whose locale and dynamic kind measurement have been overridden within the surroundings. The view shows a formatted date and the present dynamic kind measurement setting. Right here’s the code for the basis view^:

struct RootView: View {
  var physique: some View {
    RootViewContent()
      .surroundings(.sizeCategory, .accessibilityMedium)
      .surroundings(.locale, Locale(identifier: "ja_JP"))
  }
}

struct RootViewContent: View {
  @State var isPresentingSheet = false
  @Surroundings(.sizeCategory) var sizeCategory

  var physique: some View {
    VStack(spacing: 16) {
      Textual content("Root View").font(.title)
      Textual content("(Date(), formatter: dateFormatter)")
      Textual content("Dimension class: (String(describing: sizeCategory))")
      Button("Open Sheet") {
        self.isPresentingSheet = true
      }
    }
    .sheet(isPresented: self.$isPresentingSheet) {
      ChildView()
    }
  }
}

Tapping the button within the root view units a state variable that triggers the presentation of a modal sheet, utilizing the .sheet modifier:

    // …
    .sheet(isPresented: self.$isPresentingSheet) {
      ChildView()
    }
    // …

The view that will get introduced shows the identical information as the basis view, with out modifying the surroundings in any method:

struct ChildView: View {
  @Surroundings(.sizeCategory) var sizeCategory

  var physique: some View {
    VStack(spacing: 16) {
      Textual content("Youngster View").font(.title)
      Textual content("(Date(), formatter: dateFormatter)")
      Textual content("Dimension class: (String(describing: sizeCategory))")
    }
  }
}

I’d anticipate that the introduced view inherits the surroundings from the presenting view (some modifications however because the presentation mode can be saved within the surroundings), however that’s clearly not the case; whereas the basis view accurately makes use of the Japanese locale and a really giant dynamic kind setting, the kid view goes again to the system locale and textual content measurement:

I’m undecided if that is intentional or a bug. (Replace: It’s a bug.) I suppose when you see sheets as unbiased entities that shouldn’t be affected by their presenting view, it is sensible for some surroundings values to not get propagated. Examples of this type would possibly embrace:

For different settings, equivalent to locale and dynamic kind measurement, not propagating appears the incorrect option to me. It seems to be like there is no such thing as a single choice that works for every little thing, although. And making this a configurable conduct that each EnvironmentKey can determine for itself may be complicated.

If you wish to propagate an surroundings worth to a sheet, you have to accomplish that manually. In our instance, the code would seem like this:

    // …
    .sheet(isPresented: self.$isPresentingSheet) {
      ChildView()
        .surroundings(.sizeCategory, self.sizeCategory)      
        .surroundings(.locale, self.locale)
    }
    // …

(This assumes that you just additionally added a property @Surroundings(.locale) var locale to the basis view as a way to entry the present locale contained in the surroundings.)