-
Build for the iPadOS pointer
Help people who use iPad with a Magic Keyboard, mouse, trackpad or other input device get the most out of your app. We'll show you how to add customizations to the pointer on iPad using pointer interaction APIs, create pointer effects for your buttons and custom views, and change the pointer shape in specific areas of your app to highlight them.
To learn more about pointer interactions on iPad and to get the most out of this session, we recommend also watching “Design for the iPadOS pointer” and “Handle trackpad and mouse input.”Recursos
Videos relacionados
WWDC23
WWDC21
WWDC20
-
Buscar este video…
-
-
6:04 - UIButton Pointer Effects
// Enable the button's built-in pointer interaction. myButton.isPointerInteractionEnabled = true // Customize the default interaction effect. myButton.pointerStyleProvider = { button, proposedEffect, proposedShape -> UIPointerStyle? in // In this example, we'll switch to using the .lift effect by creating a new // UIPointerEffect with the .lift type using the proposedEffect's preview. return UIPointerStyle(effect: .lift(proposedEffect.preview), shape: proposedShape) } -
7:05 - Pointer Content Effect
// Create a UIPointerStyle that applies the .highlight effect. // Outset the view's frame so the pointer shape has some generous padding around the view's contents. // Note that this frame must be in the provided UITargetedPreview's container's coordinate space. // In the majority of cases (where the preview doesn't have a custom container), this is just the view's superview. let rect = myView.frame.insetBy(dx: -8.0, dy: -4.0) let preview = UITargetedPreview(view: myView) return UIPointerStyle(effect: .highlight(preview), shape: .roundedRect(rect)) -
8:02 - Pointer Shape Customization
// Create a UIPointerStyle that changes the pointer into a vertical beam. let beamLength = myFont.lineHeight return UIPointerStyle(shape: .verticalBeam(length: beamLength), constrainedAxes: .vertical) -
21:31 - UIPointerInteraction Region Entrance Animation
func pointerInteraction(_ interaction: UIPointerInteraction, willEnter region: UIPointerRegion, animator: UIPointerInteractionAnimating) { // Fade out separator when entering region. animator.addAnimations { self.separatorView.alpha = 0.0 } } -
21:51 - UIPointerInteraction Region Exit Animation
func pointerInteraction(_ interaction: UIPointerInteraction, willExit region: UIPointerRegion, animator: UIPointerInteractionAnimating) { // Fade separator back in when exiting region. animator.addAnimations { self.separatorView.alpha = 1.0 } }
-