Screen Corner Radius Border

It would be much clearer if you showed what you mean.

If I understand however, my guess is that you should design some kind of animation, with the final image being the reduced view…

In any case, take care of guidelines:

5.2.5ASR & NR Apple Products: Don’t create an app that appears confusingly similar to an existing Apple product, interface (e.g. Finder), app (such as the App Store, iTunes Store, or Messages)

Apple doesn't publish information on the corner radius of devices. Some older 3rd party frameworks and pods attempted to provide values based on device, but these are best looking guesses, as again, the information is not published. If you need help implementing a similar animated view, please reply with some sort of image or video to confirm we are thinking of the same thing and I can answer questions around implementing a view with a border / stroke extending around the view. There are several ways to achieve this.

Rico
WWDR - DTS - Software Engineer

Here's a super simple example:

struct ContentView: View {
    var body: some View {
        ZStack {
            Text("Hello World")
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .overlay {
            Rectangle()
                .stroke(Color.blue, lineWidth: 16)
                .ignoresSafeArea(edges: [.bottom])
        }

    }
}

which results in:

The desire was to have an even stroke go along with the lower radius of the device, where now the corners are cut off.

I'm not even wanting it animated, just a border. Think the screen sharing border on most video conferencing apps. The Freeform app has something similar when using certain features in SharePlay, but it has a bottom toolbar so that solves the lower radius issue.