iMessage 스티커 응용 프로그램 격자 스티커 크기 조정

Question

iOS iMessage 스티커 응용 프로그램을 만들었으며 사과 설명서에 따라 3 가지 크기 중 하나로 스티커를 표시 할 수 있어야합니다.

그러나 어떤 크기의 스티커 이미지 (300px x 300px, 408px x 408px, 618px x 618px)에도 상관없이 행당 3 개의 스티커가있는 가운데 그리드 옵션으로 만 표시됩니다. 누구든지이 문제를 해결하는 방법을 알고 있습니까, 아마도 나는 간단한 것을 놓치고 있습니다. 이 주제에 관한 문서는 비교적 새롭기 때문에 부족합니다. 도와 주셔서 감사합니다. 문서에

Sticker Sizing Chart

링크 : https://developer.apple.com/ios/human-interface-guidelines/extensions/messaging/

Answer 1

기존에 초기 메시지로 보내거나 끌 경우에만 스티커가 대화 (에 나타나는 크기에 영향을 미칠 것이다, 최대 300x300에서 408x408 또는 618x618을 이미지를 가져 오기 .. 메시지 거품 이미지의 크기를 변경하면

가 StickerBrowserView에서 그리드 레이아웃을 변경하려면이 그리드 레이아웃의 방향에의 영향을받지 않습니다 당신은 그것을 할 수있는 두 가지 방법 중 하나를

,691,363 StickerPack 폴더에210

• 인터페이스 빌더

클릭이 강조 (또는 팩의 모든 스티커를 선택) 한 다음에 속성 관리자의 드롭 다운 메뉴에서 "스티커 크기"옵션을 변경할 수 있습니다되도록 (2 열), 중간 (3 열) 또는 큰 (4 열) 중에서 원하는 프리젠 테이션 스타일의 오른쪽을 선택합니다. 그게 다야! 이렇게하면 모든 스티커가 레이아웃에이 방식으로 표시됩니다. 어떤 크기의 이미지를 가져 오든 앱은 선택한 레이아웃에서 사용할 수 있도록 올바른 크기로 스케일 업합니다.

• 프로그래밍
는

는 "메시지 응용 프로그램"을 선택한 후 스티커를 저장하는 배열을 생성, MSStickerBrowserViewController을 하위 클래스 새 파일을 만들 때 새 프로젝트를 설정,로드/먼저 만들

스티커 (각 스티커 배열에 저장하는 동안) 및 MSStickerBrowserViewController의 2 가지 필수 데이터 소스 메서드를 구현해야합니다. 이를 위해 이미지를 Extensions 디렉토리로 드래그하면됩니다.

SubclassFile.Swift

당신의 MessagesViewController에서

import UIKit 
import Messages 

class MyBrowserVC: MSStickerBrowserViewController { 

    //create stickers array 
    var stickers = [MSSticker]() 

    //load assets into stickers array 
    func loadStickers() { 
     createSticker(asset: "boycott", localizedDescription: "boycottSticker") 
     createSticker(asset: "alluminaughty", localizedDescription: "alluminaughtySticker") 
     createSticker(asset: "beer", localizedDescription: "beerSticker") 
    } 

    //func to create sticker 
    func createSticker(asset: String, localizedDescription: String) { 

     //create url from assets in main bundle 
     guard let stickerPath = Bundle.main.path(forResource: asset, ofType: "png") else { 
      print("Couldn't create sticker path for", asset) 
      return 
     } 
     let stickerURL = URL(fileURLWithPath: stickerPath) 
     let sticker: MSSticker 

     //create sticker from path(and localized description) and add to array 
     do { 
      try sticker = MSSticker(contentsOfFileURL: stickerURL, 
           localizedDescription: localizedDescription) 
      stickers.append(sticker) 
     } catch { 
      print(error) 
      return 
     } 
    } 

    //datasource methods 
    override func numberOfStickers(in stickerBrowserView: MSStickerBrowserView) -> Int { 
     return stickers.count 
    } 
    override func stickerBrowserView(_ stickerBrowserView: MSStickerBrowserView, 
              stickerAt index: Int) -> MSSticker { 
     return stickers[index] 
    } 
} 

, 서브 클래스에서 BrowserVC의 인스턴스를 생성 (새 프로젝트를 시작할 때 자동으로이 있어야한다), 설정 스티커 크기, browserVC 프레임, 전면에있는 하위 뷰를 추가, 브라우저보기에 스티커를로드하십시오.

MessageViewController.swift

import UIKit 
import Messages 

class MessagesViewController: MSMessagesAppViewController { 

    //create BrowserVC instance of Subclass 
    var browserVC: MyBrowserVC! 

    override func viewDidLoad() { 
     super.viewDidLoad() 

    //the next line of code is where you can adjust the "grid layout" 
    //your options are: .small(2 columns), .regular(3 columns), or .large(4 columns) 

     //instantiate browserVC with sticker size and set frame 
     browserVC = MyBrowserVC(stickerSize: .regular) 
     browserVC.view.frame = self.view.frame 

     //send browserVC to front 
     self.addChildViewController(browserVC) 
     browserVC.didMove(toParentViewController: self) 
     self.view.addSubview(browserVC.view) 

     //load stickers onto the browser view 
     browserVC.loadStickers() 
     browserVC.stickerBrowserView.reloadData() 
    } 
} 

더 나은 정보를 위해, 스티커에 WWDC video 발표 작년에 체크 아웃! 이것이 내가 스티커를 만드는 것을 배우기 시작한 곳이며, 그 다음에 문서를 올려 놓으십시오!