MCEmojiPicker

About

It is a customizable library implementing macOS style emoji picker popover.

If you are interested in how I developed it and what difficulties I encountered in the process, you can read an article on Medium, Habr about it. And if you like the project, don't forget to put star ★.

Limitations

• Does not support two part emojis. For example:
  • Supported: 🤝🏻 🤝🏿
  • Not supported: 🫱🏿‍🫲🏻 🫱🏼‍🫲🏿

If you know how to fix it - welcome to the discussion.

Apps Using

If you use a MCEmojiPicker, add your application via Pull Request. Fore more information you can see contribution guide.

Navigation

• Requirements
• Installation
  • CocoaPods
  • Swift Package Manager
  • Manually
• Quick Start
• Usage
  • Selected emoji category tint color
  • Arrow direction
  • Horizontal inset
  • Is dismiss after choosing
  • Custom height
  • Feedback generator style
• SwiftUI
• Localization
• TODO

Requirements

• Swift 4.2 & 5.0
• Ready for use on iOS 12.0+
• SwiftUI is supported from iOS 13.0

Installation

CocoaPods

CocoaPods is a dependency manager for Cocoa projects. For usage and installation instructions, visit their website. To integrate MCEmojiPicker into your Xcode project using CocoaPods, specify it in your Podfile:

pod 'MCEmojiPicker'

Swift Package Manager

The Swift Package Manager is a tool for managing the distribution of Swift code. It’s integrated with the Swift build system to automate the process of downloading, compiling, and linking dependencies.

To integrate MCEmojiPicker into your Xcode project using Xcode 11, specify it in Project > Swift Packages:

https://github.com/izyumkin/MCEmojiPicker

Manually

If you prefer not to use any of the aforementioned dependency managers, you can integrate MCEmojiPicker into your project manually. Put Source/MCEmojiPicker folder in your Xcode project. Make sure to enable Copy items if needed and Create groups.

Quick Start

Create UIButton and add selector as action:

@objc private func selectEmojiAction(_ sender: UIButton) {
    let viewController = MCEmojiPickerViewController()
    viewController.delegate = self
    viewController.sourceView = sender
    present(viewController, animated: true)
}

And then recieve emoji in the delegate method:

extension ViewController: MCEmojiPickerDelegate {
    func didGetEmoji(emoji: String) {
        emojiButton.setTitle(emoji, for: .normal)
    }
}

Usage

sourceView is the view containing the anchor rectangle for the popover. You can create any UIView instance and set it in this property.

Selected emoji category tint color

Color for the selected emoji category. The default value of this property is .systemBlue.

viewController.selectedEmojiCategoryTintColor = .systemRed

Arrow direction

The direction of the arrow for EmojiPicker. The default value of this property is .up.

viewController.arrowDirection = .up

Horizontal inset

Inset from the sourceView border. The default value of this property is 0.

viewController.horizontalInset = 0

Is dismiss after choosing

Defines whether to dismiss emoji picker or not after choosing. The default value of this property is true.

viewController.isDismissAfterChoosing = true

Custom height

Custom height for EmojiPicker. The default value of this property is nil.

viewController.customHeight = 300

Feedback generator style

Feedback generator style. To turn off, set nil to this parameter. The default value of this property is .light.

viewController.feedBackGeneratorStyle = .soft

SwiftUI

Use like system popover. All settings are available in the method initializer.

Button(selectedEmoji) {
    isPresented.toggle()
}.emojiPicker(
    isPresented: $isPresented,
    selectedEmoji: $selectedEmoji
)

or interact directly with the SwiftUI wrapper for the MCEmojiPickerViewController:

MCEmojiPickerRepresentableController(
    isPresented: $isPresented,
    selectedEmoji: $selectedEmoji,
    arrowDirection: .up,
    customHeight: 380.0,
    horizontalInset: .zero,
    isDismissAfterChoosing: true,
    selectedEmojiCategoryTintColor: .systemBlue,
    feedBackGeneratorStyle: .light
)

Localization

🌍 This library supports all existing localizations

TODO

• The main functionality for choosing emojis
• Dark mode
• Segmented control for jumping an emoji section
• Automatic adjustment of the relevant set of emoji for the iOS version
• Select skin tones from popup
• Frequently used
• Search bar and search results