parallax_bg

Create beautiful & interactive parallax backgrounds for your apps and games.

pub package

Example Image

You can find another working example in SlideIT Mobile Game

Usage

Add following command in your pubspec.yaml & install package

parallax_bg:1.0.4

Import in your dart page

import 'package:parallax_bg/parallax_bg.dart';

Add following to create background wrapper

    ParallaxBackground(
      backgroundImage: "assets/images/galaxy.jpg",
      parallaxType: _parallaxType,
      foregroundChilds: [
        ParallaxItem(
            child: Image.asset("assets/images/planet.png"),
            offset: _planetOffset),
        ParallaxItem(
            child: Image.asset("assets/images/meteor.png"),
            offset: _meteorOffset),
      ],
      // fallback: true,
    );

Change/Add/Remove ParallaxItem for foreground items

    ParallaxItem(
    child: Image.asset("assets/images/meteor.png"),
    offset: _meteorOffset),

ParallaxBackground

PROPERTYTYPEREQUIREDDETAILS
backgroundImagestringyesImage path from asset folder
foregroundChildsListyesWidgets to create foreground layers
childWidgetnoChild widget to draw over all parallax widgets
reversebooleannoMove foreground items in reverse direction. Default false
fallbackbooleannoIf true render the items normally when there are no sensors available. If false, it will show a error message in visible area. Default false

ParallaxItem

PROPERTYTYPEREQUIREDDETAILS
childWidgetyesChild widget to draw over background as parallax item
offsetbooleannoOffset values to calculate distance to move items when moving device. Need separate value for each item. Default 5

LICENSE

MIT LICENSE

Libraries

parallax_bg