SwiftUI AccessibilityHidden Still Selectable

Question

Working on all things accessibility related and found that .accessibilityHidden(true) doesn't seem to work correctly. Even though VO doesn't read anything, it still shows the white box as you swipe around the page. The only way I've solved this is to put a VStack around the entire thing and then it seems to be fine, however it truncates the welcomeBodyText in simulator but not on a real device, which is worrying because I need to ensure that this works across all devices.

As the HeaderNav just shows the logo and company name, there is no reason to have it selectable, nor read out on every single page, so I wanted to completely hide it from VO and immediately jump to reading the welcomeHeaderText followed by the welcomeBodyText.

HeaderNav.swift

import SwiftUI

struct HeaderNav: View {
    var body: some View {
        VStack {
            Spacer()
                .frame(minHeight: 26, idealHeight: 26, maxHeight: 26)
                .fixedSize()
            HStack(spacing: 16) {
                Spacer()
                Image(decorative: "LogoHeader")
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 70)

                Text(LocalizationStrings.companyName)
                    .fontWeight(.light)
                    .foregroundColor(Color("WhiteText"))
                    .font(.system(size: 34))
                    .tracking(0.8)
                Spacer()
            } // End HStack
            .accessibilityElement(children: .ignore)
            .accessibilityLabel(LocalizationStrings.companyName)
        } // End VStack
    }
}

WelcomeTextView.swift

import SwiftUI

struct WelcomeTextView: View {
    var body: some View {
        Section {

            VStack { // This is what needed to be added to make it work but causes issues in the simulator
                HeaderNav()
                    .accessibilityHidden(true)

                VStack(spacing: 10) {
                    Group {
                        HeaderText(text: LocalizationStrings.welcomeHeaderText)
                        BodyText(text: LocalizationStrings.welcomeBodyText)
                    } // End Group (Page Description)
                    .pageDescr()

                } // End VStack
            } // End VStack to make it work
            .accessibilityElement(children: .combine)
        } // End Section
        .listRowBackground(Color("mainbkg"))
        .listRowSeparator(.hidden)
    }
}

Answer 1

pageDescr is a View Modifier that looks like:

struct PageDescr: ViewModifier {
    func body(content: Content) -> some View {
        VStack(alignment: .leading, spacing: 20) {
            content
        }
        .padding(EdgeInsets(top: 5, leading: 32.0, bottom: 25, trailing: 32.0))
    }
}

It was the top padding that was causing the issue, so I used a fixed size spacer in the HeaderNav above the closing } of the VStack instead and set the top padding to 0. Now it works.

Like this:

Spacer()
    .frame(minHeight: 32, idealHeight: 32, maxHeight: 32)
    .fixedSize()