giphy_selector 1.2.2 giphy_selector: ^1.2.2 copied to clipboard
A Flutter plugin enabling the selection of a GIPHY GIF, Sticker or Emoji
Giphy Selector #
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
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 GIPHY label 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