Hello! I'm developing a Watch app, that's required to receive images from iPhone occasionally. Since the user will need their hands free, they have to inspect those images on Watch, which is why I added a rudimentary image viewer, allowing users to zoom in on images and pan around.
As soon as the user pans or zooms, toolbar and title will disappear.
This happens in simulator and on my colleague's Watch (A2376), but not on mine (A2356)! Tested both on watchOS 9.6.2 and 10.0.1.
Here's a code excerpt:
// View is presented on a sheet
TabView(selection: $viewing) {
ForEach(images) { reference in
reference.img
.resizable()
.aspectRatio(contentMode: .fit)
.scaleEffect(scale)
.offset(offset + draggingOffset)
.frame(width: screenSize.width, height: screenSize.height-1)
.clipped()
.id(reference.id)
.gesture(panGesture, including: .gesture)
.gesture(tapZoomGesture)
.navigationTitle(viewerTitle)
// .toolbar(content: {
// ToolbarItem(placement: .cancellationAction) {
// viewerToolbar
// }
// })
.focusable()
.digitalCrownRotation(detent: $scale,
from: 0.5,
through: scaleMax,
by: 0.1,
sensitivity: .low,
isContinuous: false,
isHapticFeedbackEnabled: false,
onIdle: { offset = stickyEdgeOffset })
}
}
The solution was lifting out navigationTitle and toolbar. I got lucky guessing.. can't imagine it's supposed to work like this.
someView
.sheet(isPresented: $isShowingViewer, content: {
imageViewer
.navigationTitle("Image viewer")
.toolbar(content: {
ToolbarItem(placement: .confirmationAction, content: {
imageViewerToolbar
})
})
})