simple_parallax

Creator: coderz1093

Last updated:

0 purchases

simple_parallax Image
simple_parallax Images

Languages

Categories

Add to Cart

Description:

simple parallax

SimpleParallax Plugin for Flutter #







This parallax Flutter plugin that adds elegant parallax effects to your widgets using two different modes: a container mode and a widget mode. This plugin helps create dynamic and visually appealing user interfaces with scrolling effects.
Features #

Smooth parallax scrolling for background images.
Configurable scroll speed for the parallax effect.
Simple integration with your existing Flutter projects.
Uses provider for state management ensuring efficient updates.

Installation #
Add simple_parallax to your pubspec.yaml file:
dependencies:
flutter:
sdk: flutter
simple_parallax: ^0.1.0
copied to clipboard
Replace ^0.1.0 with the latest version from pub.dev.
Usage #
The simple_parallax plugin provides two main widgets to create parallax effects:
Container Mode (SimpleParallaxContainer) #
The container mode is used to add a parallax effect to a child widget with a background image.
Exemple
import 'package:flutter/material.dart';
import 'package:simple_parallax/simple_parallax.dart';

void main() => runApp(const MyApp());

/// App demo
class MyApp extends StatelessWidget {
/// App demo constructor
const MyApp({super.key});

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: SizedBox(
//height: 300,
//width: 600,
child: SimpleParallaxContainer(
//height: 300,
imagePath: 'assets/images/background.webp',
speed: 0.3,
autoSpeed: true,
decal: 1.0,
child: Column(
children: List<Widget>.generate(
20,
(int index) => Container(
height: 100,
margin: const EdgeInsets.symmetric(vertical: 10),
color: Colors.white.withOpacity(0.8),
child: Center(child: Text('Item $index')),
),
),
),
),
),
),
),
);
}
}
copied to clipboard
Widget Mode (SimpleParallaxWidget) #
The widget mode allows you to apply a parallax effect to multiple child widgets within a list.
Exemple
import 'package:flutter/material.dart';
import 'package:simple_parallax/simple_parallax.dart';

void main() => runApp(const MyApp());

/// App demo
class MyApp extends StatelessWidget {
/// App demo constructor
const MyApp({super.key});

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: SimpleParallaxWidget(
children: <Widget>[
Container(
color: Colors.red,
padding: const EdgeInsets.symmetric(vertical: 200, horizontal: 0),
child: const SizedBox(
height: 50,
),
),
const SimpleParallaxItem(
imagePath: 'assets/images/background.webp',
height: 300,
child: Center(
child: Text('TEST 1'),
),
),
Container(
color: Colors.greenAccent,
child: const SizedBox(
height: 250,
),
),
const SimpleParallaxItem(
imagePath: 'assets/images/background.webp',
height: 300,
child: Center(
child: Text('TEST 2'),
),
),
Container(height: 500, color: Colors.blueGrey),
],
),
),
);
}
}
copied to clipboard
API #
SimpleParallaxContainer #

imagePath (required): Path to the background image.
child (required): The child widget to be displayed over the background image.
speed (optional): Parallax effect speed. Default value is 0.3.
autoSpeed (optional): Automatically calculates the speed based on the child widget's size.
decal (optional): Offset for the background image. Default value is 1.0.
height (optional): Height of the container. If not specified, uses the height of the screen.

SimpleParallaxWidget #

children (required): List of child widgets with parallax effect.

SimpleParallaxItem #

imagePath (required): Path to the background image.
child (optional): Child widget to be displayed over the background image.
speed (optional): Parallax effect speed. Default value is 0.3.
decal (optional): Offset for the background image. Default value is 1.5.
width (optional): Width of the item.
height (optional): Height of the item.

Contributing #
Contributions are welcome! To contribute to this plugin, please follow these steps:

Fork the GitHub repository.
Create a branch for your feature or fix.
Submit a pull request with a description of your changes.

License #
This plugin is licensed under the MIT License. See the LICENSE file for more details.

License:

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Files In This Product:

Customer Reviews

There are no reviews.