giphy_selector 1.4.0 copy "giphy_selector: ^1.4.0" to clipboard
giphy_selector: ^1.4.0 copied to clipboard

A Flutter plugin enabling the selection of a GIPHY GIF, Sticker or Emoji

Giphy Selector #

pub package

Overview #

Inspired by giphy_get

This package allow to get gifs, sticker or emojis from GIPHY in pure dart code using Giphy SDK design guidelines.

Getting Started #

Important! you must register your app at Giphy Develepers and get your APIKEY

Localizations #

Currently english, french and spanish is supported.

void runApp() {
  return MaterialApp(
    title: ' Demo',
    localizationsDelegates: [
      // Default Delegates 
      GlobalMaterialLocalizations.delegate,
      GlobalWidgetsLocalizations.delegate,
      // Add this line 
      GiphyGetUILocalizations.delegate
    ],
    supportedLocales: [

      //Your supported languages
      Locale('en', ''),
      Locale('es', ''),
      Locale('fr', ''),
    ],
    home: MyHomePage(title: ' Demo'),
  );
}

Get only Gif #

This is for get gif without wrapper and tap to more

import 'package:giphy_selector/giphy_selector.dart';

GiphyGif gif = await GiphySelector.getGif(
  context: context, //Required
  apiKey: "your api key HERE", //Required.
  lang: GiphyLanguage.english, //Optional - Language for query.
  randomID: "abcd", // Optional - An ID/proxy for a specific user.
  modalOptions: ModalOptions( // Option - Show Giphy selector in a modal
    Offset.zero,
    Alignment.topLeft
  ),
  tabColor:Colors.teal, // Optional- default accent color.
);

Options #

Value Type Description Default
lang String Use ISO 639-1 language code or use GiphyLanguage constants GiphyLanguage.english
randomID String An ID/proxy for a specific user. null
searchText String Input search hint, we recommend use flutter_18n package for translation "Search GIPHY"
modalOptions ModalOptions When not null, is used to position the Giphy selector in a modal null
tabColor Color Color for tabs and loading progress, Theme.of(context).accentColor

Get Random ID #

Futurew<void> doSomeThing() async {
  GiphyClient giphyClient = GiphyClient(apiKey: 'YOUR API KEY');
  String randomId = await giphyClient.getRandomId();
}

Widgets #

Optional but this widget is required if you get more gif's of user or view on Giphy following Giphy Design guidelines

giphy

GiphyGifWidget #

Parameters

Value Type Description Default
gif required GiphyGif GiphyGif object from stream or JSON
giphyGetWrapper required GiphyGetWrapper selector instance used to find more by author null
showGiphyLabel bool show or hide Powered by GIPHYlabel at bottom true
borderRadius BorderRadius add border radius to image null
imageAlignment Alignment this widget is a Stack with Image and tap buttons this property adjust alignment Alignment.center

GiphyGetWrapper #

Parameters

Value Type Description Default
giphy_api_key required String Your Giphy API KEY null
builder function return Stream<GiphyGif> and Instance of GiphyGetWrapper null

Available methods #

void getGif(String queryText, BuildContext context);
void build(BuildContext context) {
  return GiphyGetWrapper(
      giphy_api_key: 'REPLACE_WITH YOUR_API_KEY',
      // Builder with Stream<GiphyGif> and Instance of GiphyGetWrapper
      builder: (stream, giphyGetWrapper) =>
          StreamBuilder<GiphyGif>(
              stream: stream,
              builder: (context, snapshot) {
                return Scaffold(
                  body: snapshot.hasData
                      ? SizedBox(
                    // GiphyGifWidget with tap to more
                    child: GiphyGifWidget(
                      imageAlignment: Alignment.center,
                      gif: snapshot.data,
                      giphyGetWrapper: giphyGetWrapper,
                      borderRadius: BorderRadius.circular(30),
                      showGiphyLabel: true,
                    ),
                  )
                      : Text("No GIF"),
                  floatingActionButton: FloatingActionButton(
                    onPressed: () async {
                      //Open Giphy Sheet
                      giphyGetWrapper.getGif('', context);
                    },
                    tooltip: 'Open Sticker',
                    child: Icon(Icons.insert_emoticon),
                  ),
                );
              }
          )
  );
}

Using the example #

First export your giphy api key

export GIPHY_API_KEY=YOUR_GIPHY_API_KEY 

and then run.

Contrib #

Feel free to make any PR's