iMessage貼紙應用網格貼紙尺寸

Question

我已經創建了iOS iMessage貼紙應用程序，根據蘋果文檔，我應該能夠以三種不同尺寸之一顯示貼紙。

但是，無論我製作貼紙圖像的尺寸是多少（300x300像素，408像素x 408像素，618像素x 618像素），它們只會顯示爲中間網格選項，每行三個貼紙。有誰知道如何解決這個問題，也許我缺少一些簡單的東西。 有關此主題的文檔很少，因爲它相當新穎。謝謝您的幫助。

Sticker Sizing Chart

鏈接到文檔：https://developer.apple.com/ios/human-interface-guidelines/extensions/messaging/

Answer 1

在300×300導入的圖像，408x408，或618x618時作爲初始消息發送或拖到現有隻會影響貼紙出現在談話（大小消息氣泡更改圖像的尺寸不會影響網格佈局中的方向

要更改StickerBrowserView中的網格佈局，您可以使用以下兩種方法之一：

• 的InterfaceBuilder

單擊StickerPack文件夾，以便它被突出顯示（或選擇從你的揹包任何貼紙），然後你可以改變從下拉菜單中的屬性檢查器中的「貼紙大小」選項您的首選演示風格的右側：小（2列），中（3列）或大（4列）。就這樣！這將改變每個貼紙在佈局中以這種方式顯示。無論您將圖片導入的尺寸是多少，您的應用都會按比例縮小/選擇正確尺寸，以便在所選佈局中使用。

• 編程

首先，建立一個新的項目作爲「消息應用程序」，則創建一個新文件的子類MSStickerBrowserViewController，創建數組存儲貼紙，負載/創建貼紙（將每個存儲到貼圖數組中），並確保實現MSStickerBrowserViewController所需的2個數據源方法。爲此，您可以將圖像拖入擴展目錄。

SubclassFile.Swift

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] 
    } 
} 

在你MessagesViewController，從你的子類創建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去年公佈的貼紙！這是我開始學習製作貼紙的地方，然後點擊文檔！