Freedome Editor Comics
Dome features run over
freedome_client— see doc/migration-to-freedome_client.md.
Flutter library for creating and editing interactive comics with animation, sound and multi-language support.
Russian version: README.ru.md.
Description
Freedome Editor Comics is a Flutter library ported from the C# legacy_comics_editor. It provides everything needed to build interactive comics with:
- Multi-layer structure - layers made of images
- Animation - transformations (translate, rotate, scale, alpha)
- Sound - audio files with time stamps
- Multiple languages - several languages (EN, RU, HI)
- Export / import - projects saved and loaded as .comics / .puzzle
Data format
Comics
class Comics {
int width; // Comics width
int height; // Comics height
List<Layer> layers; // Layers
List<Sound> sounds; // Sounds
}
Layer
class Layer {
bool preview; // Preview mode
List<Image> images; // Images for the different languages
List<Animation> animations; // Layer animations
}
Image
class Image {
String file; // Path to the image file
String popup; // Path to the popup image
int width; // Image width
int height; // Image height
bool isTiles; // Whether the image is split into tiles
}
Animation types
TranslateAnim (translation)
class TranslateAnim extends Animation {
int x; // Offset along X
int y; // Offset along Y
}
RotateAnim (rotation)
class RotateAnim extends PivotAnimation {
double angle; // Rotation angle in degrees
double pivotX; // Pivot X (0.0-1.0)
double pivotY; // Pivot Y (0.0-1.0)
}
ScaleAnim (scaling)
class ScaleAnim extends PivotAnimation {
double scaleX; // Scale along X
double scaleY; // Scale along Y
double pivotX; // Scaling pivot X (0.0-1.0)
double pivotY; // Scaling pivot Y (0.0-1.0)
}
AlphaAnim (opacity)
class AlphaAnim extends Animation {
double alpha; // Opacity (0.0-1.0)
}
SoundAnim (sound)
class SoundAnim extends Animation {
// Special animation that plays a sound
}
Sound
class Sound {
String file; // Path to the audio file
List<Animation> animations; // Sound animations
}
Animation base class
abstract class Animation {
int start; // Start time
int end; // End time
AnimationType type; // Animation type
// Interpolation between animations
Animation interpolate(Animation current, double scroll);
// Interpolation factor
double factor(double scroll);
}
Supported languages
- EN - English
- RU - Russian
- HI - Hindi
File formats
Input
- Images: JPG, PNG
- Audio: MP3
- Projects: .comics, .puzzle
Output
- Projects: .comics (regular comics), .puzzle (puzzles)
Usage examples
Creating a new comics
import 'package:freedome_editor_comics/freedome_editor_comics.dart';
// Create a new comics
final comics = Comics(
width: 1080,
height: 2160,
layers: [],
sounds: [],
);
// Add a layer
final layer = Layer.create(
imagePath: '/path/to/image.jpg',
scroll: 0.0,
isPuzzle: false,
);
comics.layers.add(layer);
// Add a sound
final sound = Sound.create(
audioPath: '/path/to/audio.mp3',
scroll: 0.0,
);
comics.sounds.add(sound);
Working with animations
// Add a translation
final translateAnim = TranslateAnim(
start: 0,
end: 1000,
x: 100,
y: 50,
);
layer.animations.add(translateAnim);
// Add a rotation
final rotateAnim = RotateAnim(
start: 500,
end: 1500,
angle: 45.0,
pivotX: 0.5,
pivotY: 0.5,
);
layer.animations.add(rotateAnim);
Saving and loading
// Save a comics
await comics.save('/path/to/comics.comics');
// Load a comics
final loadedComics = await Comics.load('/path/to/comics.comics');
Playing an animation
// Current animation state
final currentState = layer.getAnimationState(scroll: 500.0);
// Apply the transformations
canvas.translate(currentState.translateX, currentState.translateY);
canvas.rotate(currentState.rotation);
canvas.scale(currentState.scaleX, currentState.scaleY);
canvas.setAlpha(currentState.alpha);
Architecture
The library follows the MVVM pattern:
- Models - data models (Comics, Layer, Image, Sound, Animation)
- ViewModels - presentation logic (ComicsViewModel, LayerViewModel)
- Utils - utilities (FileManager, ZipUtils, ImageMagick)
Dependencies
path_provider- file system accessarchive- ZIP archivesimage- image processingaudioplayers- sound playback
Installation
dependencies:
freedome_editor_comics: ^1.0.0
Licence
NativeMindNONC (see LICENSE).
Support
Questions and proposals: issues in the project repository https://gitlab.com/FreeDome108/freedome_dart or support@freedome.nativemind.net.
Licence: NativeMindNONC. Commercial use → NativeMind sales (https://nativemind.net)
Libraries
- codec/comics_file_codec
- freedome_editor_comics
- Comics editor 1.2.0: models, view models and widgets;
.comicsfiles through the contract reader of freedome_client (ComicsFileCodec), additiveComics.publishToDome. - freedome_editor_comics_method_channel
- freedome_editor_comics_platform_interface
- freedome_editor_comics_plugin
- models/alpha_animation
- models/animation_serializer
- models/animation_types
- models/comics
- models/cultures
- models/image
- models/layer
- models/pivot_animation
- models/rotate_animation
- models/scale_animation
- models/sound
- models/sound_animation
- models/translate_animation
- utils/file_manager
- utils/image_processor
- utils/zip_utils
- viewmodels/comics_view_model
- viewmodels/layer_view_model
- viewmodels/sound_view_model
- widgets/animation_timeline
- widgets/comics_canvas