opscroll_web

Description:

opscroll web

OPscroll_web #



OPScroll
A simple and easy to use library that creates OnePage sites for Flutter Web Developers! Make a beautiful and smooth landing pages with OPScroll with in minutes. Try out our Web Demo App.

Table of contents #

Installing
Usage
Up Coming
Scrolling Options
Scrolling Animations

Fading Scrolling Animation
Circle Scrolling Animation
Drop Scrolling Animation



Installing #
1. Depend on it #
Add this to your package's pubspec.yaml file:
dependencies:
opscroll_web: ^0.0.2
copied to clipboard
2. Install it #
You can install packages from the command line:
with pub:
$ pub get
copied to clipboard
with Flutter:
$ flutter pub get
copied to clipboard
3. Import it #
Now in your Dart code, you can use:
import 'package:opscroll_web/opscroll_web.dart';
copied to clipboard
Usage #
OPScroll is a Stateful Widget that produces OnePage scroll mechanicsm for your
Flutter Web Projects.
Include it in your build method like:
OpscrollWeb({
onePageChildren:[],
pageController:PageController(),
scrollCurve : Curves.easeIn,
scrollSpeed : const Duration(milliseconds: 900),
floatingButtonBackgroundColor :Colors.white,
floatingButtonSplashColor : Colors.white,
isFloatingButtonActive : false,
isTouchScrollingActive : false,
scrollingAnimationOptions: ScrollingAnimationOptions.Default,
scrollDirection = Axis.vertical,
})
copied to clipboard
Scrolling Options #
You can allow to scrolling by tapping.Just give the true value to isTouchScrollingActive
isTouchScrollingActive=true,
copied to clipboard
You can allow to scrolling by Floating Action Button.Just give the true value to isFloatingButtonActive
Also you can change background & splash colors.
isTouchScrollingActive=true, //Optional
floatingButtonBackgroundColor :Colors.white, //Optional
floatingButtonSplashColor : Colors.white, //Optional
copied to clipboard
Scrolling Animations #
There are 4 scrolling options for OPScroll.
enum ScrollingAnimationOptions { Fading, Drop, Circle, Default }
copied to clipboard
You can only choice 1 scrolling animation options.

Fading Scrolling Animation #

OpscrollWeb(
isFloatingButtonActive: true,
isTouchScrollingActive: true,
pageController: pageController,
scrollingAnimationOptions: ScrollingAnimationOptions.Fading,
scrollSpeed: const Duration(milliseconds: 900,
onePageChildren:[]),
copied to clipboard

Circle Scrolling Animation #

OpscrollWeb(
isFloatingButtonActive: true,
isTouchScrollingActive: true,
pageController: pageController,
scrollingAnimationOptions: ScrollingAnimationOptions.Circle,
scrollSpeed: const Duration(milliseconds: 600,
onePageChildren:[]),
copied to clipboard

Drop Scrolling Animation #

OpscrollWeb(
isFloatingButtonActive: true,
isTouchScrollingActive: true,
pageController: pageController,
scrollingAnimationOptions: ScrollingAnimationOptions.Drop,
scrollSpeed: const Duration(milliseconds: 600,
onePageChildren:[]),
copied to clipboard
Up Coming #

[✅] Fade Scroll Effect
[✅] Drop Scroll Effect
[⏳] New Scroll Effects