How to hide the scroll bar in a SpriteView when Digital Crown is used

Question

Johnno OP

Created Jun ’22

Replies 2

Boosts 0

Views 2.9k

Participants 2

I am updating my Watch games to use SwiftUI and am using a SpriteView to render my SpriteKit SKScene.

However, my games now show the scroll bar at the top right of the Watch screen when I turn the Digital Crown. This didn't happen in the old version.

Is there a way to hide the scroll bar? I see that ScrollView has a showsIndicators option to turn off the scroll bar, but I can't find this for SpriteView.

Does anyone have a workaround to remove the scroll bar?

This is the code I am currently using to show my GameScene.

  @State private var crownPosition = 0.0

  var body: some View {
    
    GeometryReader { reader in
      SpriteView(scene: GameScene(size: reader.size, crownPosition: $crownPosition))
        .focusable()
        .digitalCrownRotation($crownPosition)
    }
  }

Thanks!

Answered by Johnno in 715863022

A friend of mine gave me the solution! To stop the scroll bar appearing when using the digital crown, set isContinuous to true in the .digitalCrowRotation. Here is my latest code which no longer shows the scroll bar:

struct GameScreen: View {

  @EnvironmentObject var screenController: ScreenController
  @State private var crownPosition = 0.0

  var body: some View {

    GeometryReader { reader in
      SpriteView(scene: GameScene(size: reader.size, crownPosition: $crownPosition))
        .focusable()
        .digitalCrownRotation($crownPosition, from: 0, through: 400, by: 4, sensitivity: .medium, isContinuous: true, isHapticFeedbackEnabled: false)
    }
  }
}

I hope this helps others.

Boost

Answer 1

Johnno OP

Jun ’22

Accepted Answer

A friend of mine gave me the solution! To stop the scroll bar appearing when using the digital crown, set isContinuous to true in the .digitalCrowRotation. Here is my latest code which no longer shows the scroll bar:

struct GameScreen: View {

  @EnvironmentObject var screenController: ScreenController
  @State private var crownPosition = 0.0

  var body: some View {

    GeometryReader { reader in
      SpriteView(scene: GameScene(size: reader.size, crownPosition: $crownPosition))
        .focusable()
        .digitalCrownRotation($crownPosition, from: 0, through: 400, by: 4, sensitivity: .medium, isContinuous: true, isHapticFeedbackEnabled: false)
    }
  }
}

I hope this helps others.

0

Answer 2

emmanuel22 OP

Feb ’23

The accepted answer works. However, now with watchOS 9.1 the scroll bar appears for ~1 second after the view is loaded or when focusable(boolValue) is changed to true

0