FLUTTER ECOSYSTEM

kfiross/chat_pickers

kfiross/chat_pickers open-source repository details.

chat_pickers project cover
Stars
5
Forks
10
Last push (UTC)
Jun 25, 2021
Project status
Active
Kfir Matityahu GitHub avatar
GITHUB User

Kfir Matityahu ↗

LanguagesDartHTMLSwiftKotlinObjective-C

Packages published by this repository

Dependencies used

Dependency list 9 items

Original README

English project snapshot. Visit GitHub for the latest content.

Expand / collapse project README

chat_pickers

A Flutter package that provides a Keyboard widget for using Emojis and gifs.

Heavily based on the awesome(!) packages:

giphy_picker
emoji_picker

Preview

General usage:

https://raw.githubusercontent.com/kfiross/chat_pickers/master/gifs/general.gif

Searching for an emoji:

https://raw.githubusercontent.com/kfiross/chat_pickers/master/gifs/search_emoji.gif

adding emojis as part of text messssage:

https://raw.githubusercontent.com/kfiross/chat_pickers/master/gifs/add_emoji_in_text.gif

Getting Started

For using the GIFs page you have to use GIPHY API key You need to register an app at the Giphy Developers Portal in order to retrieve an API key.

To use the keyboard define the widget ChatPickers: The minimum required is:

var picker = ChatPickers(
  chatController: _chatController,
  emojiPickerConfig: EmojiPickerConfig(
    //optional configure  (as below)
  ),
  giphyPickerConfig: GiphyPickerConfig(
      apiKey: "some API Key",
      // other optional configure (as below)
      
);

Usage

If you want to have your own config, follow the below:

EmojiPickerConfig

configuration to customize the look& behaviour of the emoji page

EmojiPickerConfig(
    columns: <int>,     // default is 7
    bgBarColor: <Color>,    // top/bottom bar color
    bgColor:<Color>,
    indicatorColor: <Color>,
);
GiphyPickerConfig

configuration to customize the look & behaviour of the gif page

GiphyPickerConfig(
    apiKey: <Your Giphy API key>,
    lang : "EN",
    onError: (error) => print(error),
    onSelected: (gif) => sendGif(gif),
    showPreviewPage: true/false,
    searchText: "Search GIPHY"
   
);