SOLVED: How to make a NavigationLink label rectangular on watchOS?

Forums > SwiftUI

@Riverboat_Gambler

Sep '23

I'm trying to create a 2 x 2 layout of NavigationLinks on watchOS 9.

I get everything working fine using HStacks within a VStack.

My problem is how to make the NavigationLinks appear as rectangles?

I've tried various things but they always appear as capsules.

Here's the code for one link:

NavigationLink {

                AuxiliaryStorageView(request: rqs2)
            }
            label: {

                Image(systemName: "externaldrive.connected.to.line.below")
                     .resizable()
                     .scaledToFit()

            }

Any assistance in making this appear as a rectangle rather than a capsule would be very much appreciated.

Many thanks.

@Hectorcrdna

Sep '23

Hi, You could try adding .buttonBorderShape(.roundedRectangle(radius: 0)) to the Label.

NavigationLink {
    AuxiliaryStorageView(request: rqs2)
} label: {
    Image(systemName: "externaldrive.connected.to.line.below")
     .resizable()
     .scaledToFit()
}
.buttonBorderShape(.roundedRectangle(radius: 0))

@Riverboat_Gambler

Sep '23

Thank you!

I now have my 2 x 2 rectangles ... most appreciated!

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.