🦅

Photo Editing Extension のビューを SwiftUI だけで作れるようにする

2023/05/29に公開

Swift

Xcode

photos

tech

概要

Photo Editing Extension を File > New > Target... から作成すると、MainInterface.storyboard が作成されますが、SwiftUI だけで作りたいなーと思っていて、そのやり方を発見したので備忘録として書きます。

手順

参考: https://stackoverflow.com/a/57601530/18698351

Photo Editing Extension のターゲットの作成
作成の詳しい手順は他でも紹介されていると思うので、省きます
作成した Photo Editing Extension の Info.plist の NSExtensionMainStoryboard を NSExtensionPrincipalClass に書き換える
NSExtensionPrincipalClass の value を$(PRODUCT_MODULE_NAME).PhotoEditingViewController に書き換える
適当な SwiftUIView ファイルを作成
PhotoEditingViewController の viewDidLoad に以下を追記

PhotoEditingViewController

class PhotoEditingViewController: UIViewController, PHContentEditingController {
    (中略)
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // Do any additional setup after loading the view.
        
	// 先ほどの手順で作成した SwiftUIView を初期化
        let contentView: ContentView = .init()
        
        let contentViewHostingController: UIHostingController<ContentView> = .init(rootView: contentView)
        
        self.addChild(contentViewHostingController)
        self.view.addSubview(contentViewHostingController.view)
        
        contentViewHostingController.didMove(toParent: self)
        
        contentViewHostingController.view.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            contentViewHostingController.view.heightAnchor.constraint(equalTo: self.view.heightAnchor),
            contentViewHostingController.view.leftAnchor.constraint(equalTo: self.view.leftAnchor),
            contentViewHostingController.view.rightAnchor.constraint(equalTo: self.view.rightAnchor),
            contentViewHostingController.view.centerYAnchor.constraint(equalTo: self.view.centerYAnchor),
        ])
    }
    (中略)

MainInterface.storyboard を削除

以上で、Storyboard ファイルなしで Photo Editing Extension が起動するようになります

テンプレートを作ってみた

さすがに同じ工程を踏むのはめんどいので、/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/Library/Xcode/Templates/Project Templates/iOS/Application Extension/Photo Editing Extension.xctemplate を元にテンプレートを作りました。

リポジトリを Download ZIP して、その中にある iOS フォルダをまるごと、 ~/Library/Developer/Xcode/Templates (無ければ作成) にコピーしてください。

概要

手順

テンプレートを作ってみた

Discussion