https://github.com/tinyjin/sticker_editor_plus
A flutter package which will help you to create a Sticker widget that can be dragged around the screen and scalable widget.
https://github.com/tinyjin/sticker_editor_plus
dart editor flutter sticker
Last synced: 6 months ago
JSON representation
A flutter package which will help you to create a Sticker widget that can be dragged around the screen and scalable widget.
- Host: GitHub
- URL: https://github.com/tinyjin/sticker_editor_plus
- Owner: tinyjin
- License: mit
- Created: 2024-03-18T05:56:14.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-20T11:43:45.000Z (over 1 year ago)
- Last Synced: 2024-04-21T04:24:54.363Z (over 1 year ago)
- Topics: dart, editor, flutter, sticker
- Language: Dart
- Homepage: https://pub.dev/packages/sticker_editor_plus
- Size: 9.06 MB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Sticker Editor
[](https://pub.dev/packages/sticker_editor_plus)
[](https://opensource.org/licenses/MIT)
A flutter plugin for iOS, Android and Mac for Rotate, Scaling, Moving and Editing Text, Photo, Stickers.
| Sticker Editor | |
| -------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------- |
|  |  |
| Only Text | Only Photo |
| -------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- |
|  |  |
A flutter package Sticker Editor which will help you to create editable and scalable text or sticker widget that can be dragged around the area you given in screen.
## Features 💚
- Manually Control the position of the widget along with drags.
- You can bound the dragarea of your widget using boundHeight and boundWidth parameters
- onTap and onCancel function where user's can use there own function
- You can resizes widget using scaling function
- Highly customizable
- You can use whole sticker view or particular widgets
- Serialize the Texts and Pictures in JSON format
## Installation
First, add `stickereditor` as a [dependency in your pubspec.yaml file](https://flutter.dev/using-packages/).
### MacOs
Fore NetworkImage, macOS needs you to request a specific entitlement in order to access the network. To do that open macos/Runner/DebugProfile.entitlements and add the following key-value pair.
```xml
com.apple.security.network.client
```
## How to use
- Sticker View
```Dart
StickerEditingView(
height: 300,
width: 300,
child: targetWidget,
fonts: fonts,
palletColor: colorPallet,
assetList: stickerList,
texts: texts, // Texts to be shown in the Sticker Editor
pictures: pictures, // Pictures to be shown in the Sticker Editor
viewOnly: false, // If true, the Sticker Editor will be in view only mode
),
```
- Text Editing Box
```Dart
Container(
height: 300,
width: 300,
color: Colors.blue,
child: Stack(
children: [
TextEditingBox(
fonts: fonts,
boundHeight: 200,
boundWidth: 100,
isSelected: true,
palletColor: colorPallet,
newText: TextModel(
name: 'Text EditingBox',
textStyle:
GoogleFonts.pacifico(fontSize: 25, color: Colwhite),
top: top,
isSelected: true,
textAlign: TextAlign.center,
scale: 1,
left: left),
),
],
),
),
```
- Picture Editing Box
```Dart
Container(
height: 300,
width: 300,
color: Colors.blue,
child: Stack(
children: [
StickerEditingBox(
boundHeight: 200,
boundWidth: 200,
pictureModel: PictureModel(
isSelected: false,
left: 50,
top: 50,
scale: 1,
stringUrl: 'https://github.com/tinyjin/sticker_editor_plus/blob/main/example/assets/t-shirt.jpeg?raw=true',
)),
],
),
)
```
Run the example app in the exmaple folder to find out more about how to use it.