View in English

  • Apple Developer
    • Get Started

    Explore Get Started

    • Overview
    • Learn
    • Apple Developer Program

    Stay Updated

    • Latest News
    • Hello Developer
    • Platforms

    Explore Platforms

    • Apple Platforms
    • iOS
    • iPadOS
    • macOS
    • tvOS
    • visionOS
    • watchOS
    • App Store

    Featured

    • Design
    • Distribution
    • Games
    • Accessories
    • Web
    • Home
    • CarPlay
    • Technologies

    Explore Technologies

    • Overview
    • Xcode
    • Swift
    • SwiftUI

    Featured

    • Accessibility
    • App Intents
    • Apple Intelligence
    • Games
    • Machine Learning & AI
    • Security
    • Xcode Cloud
    • Community

    Explore Community

    • Overview
    • Meet with Apple events
    • Community-driven events
    • Developer Forums
    • Open Source

    Featured

    • WWDC
    • Swift Student Challenge
    • Developer Stories
    • App Store Awards
    • Apple Design Awards
    • Apple Developer Centers
    • Documentation

    Explore Documentation

    • Documentation Library
    • Technology Overviews
    • Sample Code
    • Human Interface Guidelines
    • Videos

    Release Notes

    • Featured Updates
    • iOS
    • iPadOS
    • macOS
    • watchOS
    • visionOS
    • tvOS
    • Xcode
    • Downloads

    Explore Downloads

    • All Downloads
    • Operating Systems
    • Applications
    • Design Resources

    Featured

    • Xcode
    • TestFlight
    • Fonts
    • SF Symbols
    • Icon Composer
    • Support

    Explore Support

    • Overview
    • Help Guides
    • Developer Forums
    • Feedback Assistant
    • Contact Us

    Featured

    • Account Help
    • App Review Guidelines
    • App Store Connect Help
    • Upcoming Requirements
    • Agreements and Guidelines
    • System Status
  • Quick Links

    • Events
    • News
    • Forums
    • Sample Code
    • Videos
 

Vidéos

Ouvrir le menu Fermer le menu
  • Collections
  • Toutes les vidéos
  • À propos

Plus de vidéos

  • À propos
  • Résumé
  • Code
  • Découvrez PaperKit

    Créez une application basée sur le canevas avec PaperKit. Explorez les nouvelles API de modèle de données qui vous permettent d'accéder, de créer et de modifier des éléments de balisage. Apprenez à ajouter des commandes personnalisées et des annotations, et découvrez les bonnes pratiques pour intégrer ces fonctionnalités à votre app afin d'en faire un canevas créatif complet.

    Chapitres

    • 0:00 - Introduction
    • 1:22 - Data model
    • 3:41 - Elements
    • 5:17 - Adornments
    • 7:11 - Next steps

    Ressources

    • PaperKit
      • Vidéo HD
      • Vidéo SD

    Vidéos connexes

    WWDC26

    • Analysez les traits avec PencilKit
    • Créez des images de haute qualité avec Image Playground

    WWDC25

    • Découvrez PaperKit
  • Rechercher dans cette vidéo…
    • 1:36 - Creating markup subelements

      import PaperKit
      
      func generateMarkup(pageSize: CGSize, panelFrames: [CGRect], configuration: ShapeConfiguration) -> PaperMarkup {
          var markup = PaperMarkup(bounds: CGRect(origin: .zero, size: pageSize))
          var subelements: MarkupOrderedSet = markup.subelements
          for panelFrame: CGRect in panelFrames {
              let shape = ShapeMarkup(frame: panelFrame, configuration: configuration)
              subelements.append(shape)
          }
          markup.subelements = subelements
          return markup
      }
    • 3:03 - Making template elements read-only

      import PaperKit
      
      func generateMarkup(pageSize: CGSize, panelFrames: [CGRect], configuration: ShapeConfiguration) -> PaperMarkup {
          var markup = PaperMarkup(bounds: CGRect(origin: .zero, size: pageSize))
          var subelements: MarkupOrderedSet = markup.subelements
          for panelFrame: CGRect in panelFrames {
              var shape = ShapeMarkup(frame: panelFrame, configuration: configuration)
              shape.allowedInteractions = .readOnly
              subelements.append(shape)
          }
          markup.subelements = subelements
          return markup
      }
    • 4:22 - Apply style to template elements

      import PaperKit
      
      func updatePanelColor(_ selectedColor: CGColor) {
          guard var markup: PaperMarkup = paperMarkupViewController.markup else { return }
          var subelements: MarkupOrderedSet = markup.subelements
          for element in subelements {
              guard var shape = element as? ShapeMarkup else { continue }
              shape.strokeColor = selectedColor
              shape.fillColor = selectedColor.copy(alpha: 0.15)
              subelements.updateOrAppend(shape)
          }
          markup.subelements = subelements
          markup.backgroundColor = selectedColor.copy(alpha: 0.15)
          paperMarkupViewController.markup = markup
      }
    • 5:53 - Add adornments to each panel

      import PaperKit
      
      func addPanelAdornments(for page: Page) {
          var adornments: [MarkupAdornment] = []
          for (panelIndex, panel) in page.panels.enumerated() {
              let adornmentID = UUID()
              adornmentPanelMapping[adornmentID] = panelIndex
              let center = CGPoint(x: panel.midX, y: panel.midY)
              let adornment = MarkupAdornment(
                  id: adornmentID,
                  anchor: .canvas(location: center),
                  imageConfiguration: .systemImage("photo.badge.plus"),
                  dragRegion: .fixed,
                  scalesWithZoom: false
              )
              adornments.append(adornment)
          }
          paperMarkupViewController.adornments = adornments
      }
    • 6:08 - Handle adornment taps

      import ImagePlayground
      import PaperKit
      
      func paperMarkupViewController(_ paperMarkupViewController: PaperMarkupViewController, didTapAdornmentWithID id: UUID) {
          guard let panelIndex = adornmentPanelMapping[id] else { return }
          activeImageGenerationPanelIndex = panelIndex
      
          let imagePlaygroundViewController = ImagePlaygroundViewController()
          imagePlaygroundViewController.delegate = self
          present(imagePlaygroundViewController, animated: true)
      }
    • 6:20 - Place the generated image

      import ImagePlayground
      import PaperKit
      
      func imageViewController(_ imageViewController: ImagePlaygroundViewController, didCreateImageAt imageURL: URL) {
          guard let panelFrame = activeGenerationPanelFrame,
                let paperMarkupViewController = pageViewController.paperViewController,
                var markup = paperMarkupViewController.markup,
                let image = UIImage(contentsOfFile: imageURL.path) else { return }
      
          let imageMarkup = ImageMarkup(frame: panelFrame, image: image)
          markup.subelements.append(imageMarkup)
          paperMarkupViewController.markup = markup
      }
    • 0:00 - Introduction
    • Meet PaperKit, the canvas behind Notes, Preview, and Freeform, now open to your apps in iOS, macOS, and visionOS 27 — covering the data model, elements, and adornments.

    • 1:22 - Data model
    • PaperMarkup's new subelements property exposes every canvas element as a readable, writable ordered set, and allowedInteractions gives fine-grained control over what each element permits.

    • 3:41 - Elements
    • Each element has a concrete type — shapes, images, links, loupes, and pencil strokes — with its own properties, and PaperKit builds on PencilKit so Apple Pencil strokes become markup elements.

    • 5:17 - Adornments
    • Markup adornments are visual overlays anchored to canvas coordinates — ideal for buttons, annotations, and collaboration UI — that track zoom and scroll and stay separate from persisted markup.

    • 7:11 - Next steps
    • Building a fully interactive canvas experience with PaperKit — using the data model to read and modify canvas contents, and adding adornments for interactive overlays tailored to your app.

Developer Footer

  • Vidéos
  • WWDC26
  • Découvrez PaperKit
  • Open Menu Close Menu
    • iOS
    • iPadOS
    • macOS
    • tvOS
    • visionOS
    • watchOS
    • App Store
    Open Menu Close Menu
    • Swift
    • SwiftUI
    • Swift Playground
    • TestFlight
    • Xcode
    • Xcode Cloud
    • Icon Composer
    • SF Symbols
    Open Menu Close Menu
    • Accessibility
    • Accessories
    • Apple Intelligence
    • Audio & Video
    • Augmented Reality
    • Business
    • Design
    • Distribution
    • Education
    • Games
    • Health & Fitness
    • In-App Purchase
    • Localization
    • Maps & Location
    • Machine Learning & AI
    • Security
    • Safari & Web
    Open Menu Close Menu
    • Documentation
    • Downloads
    • Sample Code
    • Videos
    Open Menu Close Menu
    • Help Guides & Articles
    • Contact Us
    • Forums
    • Feedback & Bug Reporting
    • System Status
    Open Menu Close Menu
    • Apple Developer
    • App Store Connect
    • Certificates, IDs, & Profiles
    • Feedback Assistant
    Open Menu Close Menu
    • Apple Developer Program
    • Apple Developer Enterprise Program
    • App Store Small Business Program
    • MFi Program
    • Mini Apps Partner Program
    • News Partner Program
    • Video Partner Program
    • Security Bounty Program
    • Security Research Device Program
    Open Menu Close Menu
    • Meet with Apple
    • Apple Developer Centers
    • App Store Awards
    • Apple Design Awards
    • Apple Developer Academies
    • WWDC
    Read the latest news.
    Get the Apple Developer app.
    Copyright © 2026 Apple Inc. All rights reserved.
    Terms of Use Privacy Policy Agreements and Guidelines