How to detect dynamic-island size and changes in SwiftUI & UIKit

Question

How can we detect the size and changes of the iPhone 14 pro dynamic-island?

Since the safe area provides a safe rectangle inside the rounded screen and top or bottom insets, but nothing about an object inside the rectangle.

The all we know about safe area:

enter image description here

I'm thinking a better question would be: would we need to adjust our layouts to adjust for island changes for cases where we don't want our content to be visibly blocked by the island? And I'm just assuming that the answer is that no we shouldn't worry about it; the island is *supposed* to block below content and as such we don't need to really do anything. Unless someone disagrees then please chime in. — Jonny, Sep 17 '22 at 07:15

score 1 · Answer 1 · answered Sep 22 '22 at 07:42

You can simply try to get the safe area top insets and use the dynamic height as you want.

In my scenario, requirement was to change status bar background colour. So I did something like this:

    let window = UIApplication.shared.windows.first
    let topPadding = window?.safeAreaInsets.top
    let statusBar = UIView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: topPadding ?? 0.0))
    statusBar.backgroundColor = UIColor(named: "AppPrimaryColor")
    UIApplication.shared.windows.filter {$0.isKeyWindow}.first?.addSubview(statusBar)

Dynamic island is fun to play with. screen shot

Mr.SwiftOak · Answer 2 · 2022-12-06T08:45:07.323

First of all for most developers it is sufficient to use safeArea as we did before, because dynamic island does not cover it (if not in expanded state). There are currently 3 states of fynamic island:

Compact. In the Dynamic Island, the system uses the compact presentation when there’s only one Live Activity that’s currently active.
Minimal. When multiple Live Activities are active, the system uses the minimal presentation to display two of them in the Dynamic Island. One Live Activity appears attached to the Dynamic Island while the other appears detached.

Expanded. When people touch and hold a Live Activity in a compact or minimal presentation, the system displays the content in an expanded presentation.

You can check each state if you use dynamic island yourself as part WidgetKit. Create a new widget extension if your app doesn’t already include one. Live Activities use WidgetKit functionality and SwiftUI for their user interface. For creating new Activities, please refer to Apple official documentation for Displaying live data with Live Activities. If you are not intending to use Activities, but want to somehow be aware of dynamic island available sizes, Apple provides as with Dynamic island size sheet included in Live Activities documentation :

Here is an attachment of how safeArea looks implemented with dynamic island:

How to detect dynamic-island size and changes in SwiftUI & UIKit

The all we know about safe area:

2 Answers2