smooth_compass_plus

Description:

smooth compass plus

Smooth Compass Plus #
Updated Version of the original Smooth Compass with latest Flutter SDK version, It's a Customizable flutter package to find direction using device motion sensors with ability to detect Qiblah.









SmoothCompassWidget with default Widget
SmoothCompassWidget with custom Widget



Features #

Extensive, yet easy to use
Preconfigured UI with customizable styling
Custom builder
Locale support
Smooth Rotation
Values in degrees

Usage #
Make sure to check out examples
Installation #
Add the following line to pubspec.yaml:
dependencies:
smooth_compass_plus: latest-version
copied to clipboard
Upgrade Kotlin version to latest version:
ext.kotlin_version: latest-version
copied to clipboard
Basic setup #
The complete example is available here.
SmoothCompassWidget requires you to provide compassBuilder which returns:

degrees is the directional value.
turns is the value for compass rotation.
compassAsset the (default) widget for compass.

SmoothCompassWidget Optional Arguments Height, Width, Duration and compassAsset:

compassAsset is the customizable widget for compass. if not provider default will shown.

Default Widget:
SmoothCompassWidget(
rotationSpeed: 200,
height: 300,
width: 300,
// compassAsset:CustomWidget(), you custom compass widget here
compassBuilder: (context,AsyncSnapshot<CompassModel>? compassData,Widget compassAsset){
return compassAsset;
},
),
copied to clipboard
Custom Widget:
SmoothCompassWidget(
rotationSpeed: 200,
height: 300,
width: 300,
compassAsset:Container(
height:200,
width:200,
decoration:BoxDecoration(
shape:BoxShape.circle,
image:DecorationImage(
image:AssetImage("path for compass image"),
fit:BoxFit.cover
)
),
),
compassBuilder: (context,AsyncSnapshot<CompassModel>? compassData,Widget compassAsset){
return compassAsset;
},
),
copied to clipboard
Custom Widget with Qiblah:
SmoothCompassWidget(
rotationSpeed: 200,
height: 300,
isQiblahCompass: true,
width: 300,
compassBuilder: (context,AsyncSnapshot<CompassModel>? compassData,Widget compassAsset){
return AnimatedRotation(
turns: compassData?.data?.turns??0/360,
duration: const Duration(milliseconds: 400),
child: SizedBox(
height: 200,
width: 200,
child: Stack(
children: [
//put your compass here
Positioned(
top: 0,
left: 0,
right: 0,
bottom: 0,
child: Image.asset("Your Compass Asset Here",
fit: BoxFit.fill),
),

//put your qiblah needle here
Positioned(
top: 20,
left: 0,
right: 0,
bottom: 20,
child: AnimatedRotation(
turns: (compassData?.data?.qiblahOffset??0)/360,
duration: const Duration(milliseconds: 400),
child: Image.asset("Your needle asset here",
fit: BoxFit.fitHeight),
),
)
],
),
),
);
},
),
copied to clipboard
Support
for any queries or issue contact at:

[email protected]