Editor 연동

    Editor 연동


    기사 요약

    코드 설치

    CocoaPods

    Podfile에 아래 코드를 추가하세요.

    source 'https://github.com/CocoaPods/Specs.git'
    
        # Match the Version with the Project's Minimum Supported Version
        # Shoplive iOS SDK requires iOS 11.0 or later.
        platform :ios, '11.0'
        use_frameworks!
    
        # Set the Project Target for Shoplive iOS SDK Installation
        target 'ShortformProj' do
            pod 'ShopliveShortformEditorSDK', '1.6.2'
          	pod 'ShopliveSDKCommon', '1.6.2'
        end

    Swift Package Manager

    Package Dependencies 에 다음 내용을 추가하세요.

    dependencies: [
        .package(url: "https://github.com/shoplive/shortform-ios", .exact(from: "1.6.2")),
        .package(url: "https://github.com/shoplive/common-ios", .exact(from: "1.6.2"))
    ]

    설치가 실패한다면 캐시를 지웁니다.

    터미널에서 다음 커맨드를 실행하여, 캐시를 삭제해주세요.

    rm -rf ~/Library/Caches/org.swift.swiftpm
    rm -rf ~/Library/org.swift.swiftpm

    ShopLiveShortformEditorSDK는 FFMpeg Library에 의존성을 가지고 있습니다.

    터미널에서 다음 커맨드를 실행하여, 캐시를 삭제해주세요.

    아래의 FFMpeg SPM 혹은 원하시는 버전의 FFMpeg Library를 추가해주세요

    dependencies: [
        .package(url: "https://github.com/tylerjonesio/ffmpeg-kit-spm/", .branch(from: "main"))
    ]

    AccessKey 적용


    import ShopliveSDKCommon
    @main
    class AppDelegate: UIResponder, UIApplicationDelegate {
        func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
            // Override point for customization after application launch.
          ShopLiveCommon.setAccessKey(accessKey: "YOUR_ACCESSKEY") //required
          return true
        }
    }

    Access Key

    Access key와 secret key는 샵라이브 담당자를 통해 확인할 수 있습니다.


    ShopLiveEditor 적용

    ShopLiveMediaPicker

    해당 클라스로 Editor의 기능을 사용할 경우, ShopLive에서 자체 제작한 AlbumPicker를 사용할 수 있습니다.


    import ShopliveSDKCommon
    import ShopLiveShortformEditorSDK 
    
    class ViewController : UIViewController {
     
        func startMediaPicker() {
            ShopLiveMediaPicker.shared
                .setDelegate(self)
                .setPermissionHandler(nil)
                .build(type:.video) { [weak self] mediaPicker in 
                    self.present(mediaPicker,aniated : true)
                }
    
        }
    }
    extension ViewController : ShopLiveMediaPickerDelegate { 
        func onShopLiveMediaPickerError(error : ShopLiveCommonError) {
    
        }
        
        func onShopLiveMediaPickerDidPickVideo(absoluteUrl: URL, relativeUrl: URL) {
            
        }
        
        func onShopLiveMediaPickerDidPickImage(imageUrl: URL) {
            print("Picker Image Selected image: \(imageUrl)")
            let image = UIImage(contentsOfFile: imageUrl.path)
            coverPickerImageResultPopUp.setResultImage(image: image)
            coverPickerImageResultPopUp.alpha = 1
            ShopLiveMediaPicker.shared.close()
        }
    
        func onShopLiveMediaPickerCancelled() { 
    
        }
    }


    ShopLiveVideoEditor

    해당 클라스로 Editor의 기능을 사용할 경우, ShopLive에서 자체 제작한 VideoEditor를 사용할 수 있습니다.


    import ShopliveSDKCommon
    import ShopLiveShortformEditorSDK 
    
    class ViewController : UIViewController {
     
        func startVideoEditor() {
            let cropOption = ShopliveVideoEditorAspectRatio(width: OptionSettingModel.editorWidth,
                                                            height: OptionSettingModel.editorheight,
                                                            isFixed: OptionSettingModel.editorIsFixed)
    
            let trimOption = ShopliveVideoEditorTrimOption(minVideoDuration: 3,
                                                           maxVideoDuration: 90)
            
            let videoOutPutOption = ShopLiveShortformEditorVideoOuputOption(videoOutputQuality: .max,
                                                                            videoOutputResoltuion: ._1080)
            
            
            let visibleContents = ShopLiveShortFormEditorVisibleContent(isDescriptionVisible: OptionSettingModel.editorShowDescription,
                                                                        isTagsVisible: OptionSettingModel.editorShowTags,
                                                                        editOptions: [.volume])
            
            
            ShopliveVideoEditor.shared
                .setPermissionHandler(nil)
                .setConfiguration(.init(videoCropOption: cropOption,
                                        videoOutputOption: videoOutPutOption,
                                        videoTrimOption: trimOption,
                                        visibleContents: visibleContents))
                .setDelegate(self)
                .build(data: .init(videoUrl: localUrl,isCreatedShortform: true), completion: { [weak self] editorViewController in
                    self.present(editorViewController,animated : true)
                })
        }
    }
    extension ViewController : ShopLiveVideoEditorDelegate { 
        func onShopLiveVideoEditorError(error : ShopLiveCommonError) {
    
        }
        
        func onShopLiveVideoEditorVideoConvertSuccess(videoPath : String) {
            
        }
        
        func onShopLiveVideoEditorUploadSuccess(shortsId : String) {
            ShopLiveMediaPicker.shared.close()
        }
    
        func onShopLiveVideoEditorCancelled() { 
    
        }
    }

    ShopLiveCoverPicker

    해당 클라스로 Editor의 기능을 사용할 경우, ShopLive에서 자체 제작한 CoverPicker를 사용할 수 있습니다.
    CoverPicker는 생성한 숏폼의 커버 사진을 바꿀수 있습니다.


    import ShopliveSDKCommon
    import ShopLiveShortformEditorSDK 
    
    class ViewController : UIViewController {
    
        func startCoverPicker() {
            let cropOption = ShopLiveShortFormEditorAspectRatio(width: 9,
                                                            height: 16,
                                                            isFixed: true)
            
            let visibleActionButton = ShopLiveCoverPickerVisibleActionButton(editOptions: [.crop])
            
            ShopLiveCoverPicker.shared
                .setConfiguration(.init(cropOption: cropOption,
                                        visibleActionButton: visibleActionButton))
                .setDelegate(vc)
                .build(data: .init(videoUrl: videoUrl), completion: { [weak self] coverPicker in
                    self.present(coverPicker, animated : true)
                })
        }
    }
    extension ViewController : ShopLiveCoverPickerDelegate { 
        func onShopLiveCoverPickerError(error : ShopLiveCommonError) {
    
        }
        
        func onShopLiveCoverPickerCoverImageSuccess(image : UIImage?) {
            
        }
        
        func onShopLiveCoverPickerUploadSuccess(shortsId : String) {
            ShopLiveMediaPicker.shared.close()
        }
    
        func onShopLiveCoverPickerCancelled() { 
    
        }
    }


    What's Next