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
 

Videos

Abrir menú Cerrar menú
  • Colecciones
  • Todos los videos
  • Información

Más videos

  • Información
  • Resumen
  • Código
  • Descubre PaperKit

    Crea una aplicación basada en lienzos con PaperKit. Explora las nuevas API del modelo de datos que te permiten acceder, crear y modificar elementos de marcado. Obtén información sobre cómo agregar controles y anotaciones personalizados, y descubre las mejores prácticas para integrar estas funcionalidades en tu app con el fin de crear un lienzo creativo completo.

    Capítulos

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

    Recursos

    • PaperKit
      • Video HD
      • Video SD

    Videos relacionados

    WWDC26

    • Crea imágenes de alta calidad con Image Playground
    • Lee entre los trazos con PencilKit

    WWDC25

    • Conoce PaperKit
  • Buscar este video…
    • 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

  • Videos
  • WWDC26
  • Descubre 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