Flutter Tilt

Easily apply tilt parallax hover effects on Flutter!

Table of Contents

• Features
• TODO
• Install
• Versions Compatibility
• Add Package
• Usage
• License

Features

• Tilt effect
• Light effect
• Shadow effect
• Parallax effect
• Supports mouse and touch events
• Smooth animation
• Many custom parameters

TODO

• Sensors
• Tilt controller

Install

Versions Compatibility

	3.0.x	3.3.x	3.10.x
0.0.1+	✅	✅	✅

Add Package

Run this command with Flutter:

$ flutter pub add flutter_tilt

or add flutter_tilt to pubspec.yaml dependencies manually:

dependencies:
  flutter_tilt: ^latest_version

Usage

Example: flutter_tilt/example

Simple usage: Tilt

Tilt widget will have default tilt, shadow, and light effects.

import 'package:flutter_tilt/flutter_tilt.dart';

...

Tilt(
  child: Container(
    width: 150.0,
    height: 300.0,
    color: Colors.grey,
  ),
),
...

Tilt widget parameters

Parameter	Type	Default	Description
child (required)	Widget	-	Create a widget that its child widget can be tilted.
childInner	List	[]	As with Stack, you can use the Stack layout to create widgets that are above the child, e.g., parallax effects.
disable	bool	false	Disable all effects.
fps	int	60	Gesture triggered frames.
borderRadius	BorderRadiusGeometry?	null	If non-null, the corners of this box are rounded by this BorderRadius.
clipBehavior	Clip	Clip.antiAlias	Flutter clipBehavior.
tiltConfig	TiltConfig	TiltConfig()	Tilt effect config.
lightConfig	LightConfig Visit Website