在Custom KeyBoard Extension中添加贴纸 [英] Add Stickers in Custom KeyBoard Extension

问题描述

我希望为iPhone，iPad创建自定义键盘。我已成功将短语和表情符号集成到键盘中，但无法知道如何在键盘中添加贴纸。

I am looking to create a Custom Keyboard for iPhone,iPad. I have successfully integrated Phrases and Emoticons into the Keyboard, But couldn't get any idea how to add stickers in the keyboard.

任何人都知道如何添加？

Anyone knows how to add ?

谢谢。

推荐答案

我最近创建了一个自定义键盘，用于在iPhone上发送贴纸。我注意到这个问题被标记为Objective-C，但我会在Swift中做出回应，因为我就是这样做的。

I recently created a custom keyboard for sending stickers on iPhone. I noticed this question is tagged as Objective-C but I will be responding in Swift since that’s how I did it.

如果我正确理解你的问题，添加贴纸在键盘上可能是指类似于Facebook Messenger或Peach上的贴纸。我个人的灵感来自想要创建类似Kim Kardashian的KIMOJI应用程序的东西。此自定义键盘扩展程序的工作原理是允许用户点击标签，复制它，然后将其粘贴到输入字段中发送。

If I am understanding your question correctly, "add stickers in the keyboard" may refer to stickers similar to those on Facebook Messenger or Peach. My personal inspiration came from wanting to create something similar to Kim Kardashian’s KIMOJI app. This custom keyboard extension works by allowing the user to tap on a sticker, copy it, and then paste it into an input field to send.

首先，我发现这个关于AppCoda的优秀自定义键盘教程：使用iOS 8 App Extension创建自定义键盘（用Swift编写）。本教程将指导您如何在应用程序中创建新的键盘扩展，添加包含按钮（或键）的视图，以及应用适当的约束。但是，我发现创建键的所有细节都不太适用于贴纸键盘。

To begin with, I found this great custom keyboard tutorial on AppCoda: Creating a Custom Keyboard Using iOS 8 App Extension (written in Swift). The tutorial walks you through how to create a new keyboard extension within an app, add a view which holds buttons (or keys), and apply appropriate constraints. However, I found all the details of creating keys less necessary for a sticker keyboard.

按照教程，一旦你用KeyboardViewController和KeyboardView xib创建一个基本键盘，我添加了UIButtons。就我而言，我添加了六个按钮以对应六个贴纸。第一个UIView行和第二个UIView行每个都有三个按钮。我应用了约束，使每个按钮的高度和宽度相等（大约100 x 100）。在Storyboard中，我点击了每个按钮，在属性检查器中，我将按钮image属性设置为我在资产中的相应贴纸图像。另外，为了确定键盘的合适高度，我发现了这个有用的资源： iPhone Development 101 - iPhone& iPad键盘尺寸。

Following the tutorial, once you create a basic keyboard with a KeyboardViewController and KeyboardView xib, I added UIButtons. In my case, I added six buttons to correspond to six stickers. The first UIView row and second UIView row both held three buttons each. I applied constraints so that each button was equal height and width (approximately 100 x 100). In Storyboard, I clicked on each button and in the attributes inspector I set the button "image" property to the corresponding sticker image I had in my assets. Also, to determine an appropriate height for my keyboard, I found this helpful resource: iPhone Development 101 - iPhone & iPad Keyboard Sizes.

注意：为了创建贴纸，您需要某种图像。我画了/设计了自己的。您也可以使用Adobe Illustrator或同等程序设计它们。

Note: In order to create stickers you need images of some sort. I drew / designed my own. You could also design them using Adobe Illustrator or an equivalent program.

为每个按钮设置图像并运行应用程序后，图像可能不会显示。为了解决这个问题，我不得不访问我的贴纸键盘Target> Build Phases> Copy Bundle Resources以确保包含Assets.xcassets。再次运行应用程序，图像出现。

Once you set the images for each button and run the app, the images may not appear. To fix this, I had to visit my sticker keyboard Target > Build Phases > Copy Bundle Resources to ensure Assets.xcassets was included. Running the app again, the images appeared.

接下来，假设您已经创建了与KeyboardView.xib对应的KeyboardViewController，您可以为每个按钮创建相应的@IBAction /视图控制器中的贴纸。我们希望用户将选择的贴纸复制到粘贴板，以便他们可以发送贴纸。要使您的自定义键盘能够访问粘贴板，请进入键盘扩展的Info.plist文件。在信息属性列表> NSExtension> NSExtensionAttributes下，将RequestsOpenAccess属性更改为YES。

Next, assuming you have created a KeyboardViewController that corresponds to your KeyboardView.xib, you can create a corresponding @IBAction for each button/sticker in the view controller. We want the user to copy the sticker selected to Pasteboard so they can send the stickers. To enable your custom keyboard to access Pasteboard, go into the keyboard extension’s Info.plist file. Under Information Property List > NSExtension > NSExtensionAttributes, change the RequestsOpenAccess property to YES.

现在，您创建的IBAction方法可以为Pasteboard分配相应的贴纸图像路径！这通常是我的代码看起来如何：

Now, the IBAction method you created can assign the appropriate sticker image path to the Pasteboard! This is very generally how my code looked:

@IBAction func stickerPressed(sender: UIButton) {
        let image = UIImage(named: "sticker")
        UIPasteboard.generalPasteboard().image = image
}

当您在设备上运行并测试应用程序并进行安装时，请单击键盘上的地球图标以切换到自定义键盘。点击按钮/贴纸，然后点击输入字段进行粘贴。在Facebook Messenger中，选项可能显示为发送照片编辑或取消。在Peach或Messages中，它将以内联方式发送。这取决于应用程序。

When you run and test your app on a device and install it, click the globe icon on the keyboard to switch to your custom keyboard. Tap on a button/sticker, then tap in an input field to paste. In Facebook Messenger, options may appear to "Send Photo" "Edit" or "Cancel." In Peach or Messages, it will send inline. It just depends on the app.

此过程对我有用，我希望它可以帮助其他人！

This process worked for me and I hope it can help someone else out there!

这篇关于在Custom KeyBoard Extension中添加贴纸的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！