hyperzlib
/
flutter_slider_drawer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Code Refactor

Browse Source 
- Gesture error fixed :  Right-to-Left
master
NikhilVadoliya 2 years ago
parent 65efb5dfc8
commit fc3278cf2c
9 changed files with 167 additions and 165 deletions
Show Stats Download Patch File Download Diff File

5
CHANGELOG.md
Unescape Escape View File

@ -1,3 +1,8 @@
## [2.1.2] - Release
* replace `sliderShadow` to `sliderBoxShadow`
* Slider RightToLeft : Gesture area issue fixed
* Fixed issue : #21 and #23
## [2.1.1] - Release
* Provide custom appBar feature
* Slider LeftToRight and RightToLeft issue fixed

4
example/lib/helper/colours.dart
Unescape Escape View File

@ -3,7 +3,7 @@ import 'dart:ui';
class Colours {
Colours._();
static Color blue() => const Color(0xff5e6ceb);
static Color blue = const Color(0xff5e6ceb);
static Color blueDark() => const Color(0xff4D5DFB);
static Color blueDark = const Color(0xff4D5DFB);
}

121
example/lib/main.dart
Unescape Escape View File

@ -2,16 +2,19 @@ import 'package:flutter/material.dart';
import 'package:flutter_slider_drawer/flutter_slider_drawer.dart';
void main() {
runApp(MyApp());
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
_MyAppState createState() => _MyAppState();
MyAppState createState() => MyAppState();
}
class _MyAppState extends State<MyApp> {
GlobalKey<SliderDrawerState> _key = GlobalKey<SliderDrawerState>();
class MyAppState extends State<MyApp> {
final GlobalKey<SliderDrawerState> _sliderDrawerKey =
GlobalKey<SliderDrawerState>();
late String title;
@override
@ -23,6 +26,7 @@ class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(fontFamily: 'BalsamiqSans'),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: SliderDrawer(
@ -31,11 +35,11 @@ class _MyAppState extends State<MyApp> {
title: Text(title,
style: const TextStyle(
fontSize: 22, fontWeight: FontWeight.w700))),
key: _key,
key: _sliderDrawerKey,
sliderOpenSize: 179,
slider: _SliderView(
onItemClick: (title) {
_key.currentState!.closeSlider();
_sliderDrawerKey.currentState!.closeSlider();
setState(() {
this.title = title;
});
@ -57,10 +61,9 @@ class _SliderView extends StatelessWidget {
return Container(
color: Colors.white,
padding: const EdgeInsets.only(top: 30),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
child: ListView(
children: <Widget>[
SizedBox(
const SizedBox(
height: 30,
),
CircleAvatar(
@ -68,41 +71,39 @@ class _SliderView extends StatelessWidget {
backgroundColor: Colors.grey,
child: CircleAvatar(
radius: 60,
backgroundImage: AssetImage('assets/images/user_profile.jpg'),
backgroundImage: Image.network(
'https://nikhilvadoliya.github.io/assets/images/nikhil_1.webp')
.image,
),
),
SizedBox(
const SizedBox(
height: 20,
),
Text(
const Text(
'Nick',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 30,
fontFamily: 'BalsamiqSans'),
),
SizedBox(
),
const SizedBox(
height: 20,
),
_SliderMenuItem(
title: 'Home', iconData: Icons.home, onTap: onItemClick),
_SliderMenuItem(
title: 'Add Post',
iconData: Icons.add_circle,
onTap: onItemClick),
_SliderMenuItem(
title: 'Notification',
iconData: Icons.notifications_active,
onTap: onItemClick),
_SliderMenuItem(
title: 'Likes', iconData: Icons.favorite, onTap: onItemClick),
_SliderMenuItem(
title: 'Setting', iconData: Icons.settings, onTap: onItemClick),
_SliderMenuItem(
title: 'LogOut',
iconData: Icons.arrow_back_ios,
onTap: onItemClick),
...[
Menu(Icons.home, 'Home'),
Menu(Icons.add_circle, 'Add Post'),
Menu(Icons.notifications_active, 'Notification'),
Menu(Icons.favorite, 'Likes'),
Menu(Icons.settings, 'Setting'),
Menu(Icons.arrow_back_ios, 'LogOut')
]
.map((menu) => _SliderMenuItem(
title: menu.title,
iconData: menu.iconData,
onTap: onItemClick))
.toList(),
],
),
);
@ -125,7 +126,7 @@ class _SliderMenuItem extends StatelessWidget {
Widget build(BuildContext context) {
return ListTile(
title: Text(title,
style: TextStyle(
style: const TextStyle(
color: Colors.black, fontFamily: 'BalsamiqSans_Regular')),
leading: Icon(iconData, color: Colors.black),
onTap: () => onTap?.call(title));
@ -135,32 +136,33 @@ class _SliderMenuItem extends StatelessWidget {
class _AuthorList extends StatelessWidget {
@override
Widget build(BuildContext context) {
List<Data> dataList = [];
dataList.add(Data(Colors.amber, 'Amelia Brown',
List<Quotes> quotesList = [];
quotesList.add(Quotes(Colors.amber, 'Amelia Brown',
'Life would be a great deal easier if dead things had the decency to remain dead.'));
dataList.add(Data(Colors.orange, 'Olivia Smith',
quotesList.add(Quotes(Colors.orange, 'Olivia Smith',
'That proves you are unusual," returned the Scarecrow'));
dataList.add(Data(Colors.deepOrange, 'Sophia Jones',
quotesList.add(Quotes(Colors.deepOrange, 'Sophia Jones',
'Her name badge read: Hello! My name is DIE, DEMIGOD SCUM!'));
dataList.add(Data(Colors.red, 'Isabella Johnson',
quotesList.add(Quotes(Colors.red, 'Isabella Johnson',
'I am about as intimidating as a butterfly.'));
dataList.add(Data(Colors.purple, 'Emily Taylor',
quotesList.add(Quotes(Colors.purple, 'Emily Taylor',
'Never ask an elf for help; they might decide your better off dead, eh?'));
dataList.add(Data(Colors.green, 'Maya Thomas', 'Act first, explain later'));
quotesList
.add(Quotes(Colors.green, 'Maya Thomas', 'Act first, explain later'));
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: ListView.separated(
scrollDirection: Axis.vertical,
// physics: BouncingScrollPhysics(),
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
itemBuilder: (builder, index) {
return LimitedBox(
maxHeight: 150,
child: Container(
decoration: new BoxDecoration(
color: dataList[index].color,
borderRadius: new BorderRadius.all(
const Radius.circular(10.0),
decoration: BoxDecoration(
color: quotesList[index].color,
borderRadius: const BorderRadius.all(
Radius.circular(10.0),
)),
child: Column(
mainAxisSize: MainAxisSize.min,
@ -169,8 +171,8 @@ class _AuthorList extends StatelessWidget {
Padding(
padding: const EdgeInsets.all(12),
child: Text(
dataList[index].name,
style: TextStyle(
quotesList[index].author,
style: const TextStyle(
fontFamily: 'BalsamiqSans_Blod',
fontSize: 30,
color: Colors.white),
@ -179,8 +181,8 @@ class _AuthorList extends StatelessWidget {
Padding(
padding: const EdgeInsets.all(10),
child: Text(
dataList[index].detail,
style: TextStyle(
quotesList[index].quote,
style: const TextStyle(
fontFamily: 'BalsamiqSans_Regular',
fontSize: 15,
color: Colors.white),
@ -192,26 +194,27 @@ class _AuthorList extends StatelessWidget {
);
},
separatorBuilder: (builder, index) {
return Divider(
return const Divider(
height: 10,
thickness: 0,
);
},
itemCount: dataList.length),
itemCount: quotesList.length),
);
}
}
class Data {
MaterialColor color;
String name;
String detail;
class Quotes {
final MaterialColor color;
final String author;
final String quote;
Data(this.color, this.name, this.detail);
Quotes(this.color, this.author, this.quote);
}
class ColoursHelper {
static Color blue() => Color(0xff5e6ceb);
class Menu {
final IconData iconData;
final String title;
static Color blueDark() => Color(0xff4D5DFB);
Menu(this.iconData, this.title);
}

20
lib/src/helper/slider_shadow.dart
Unescape Escape View File

@ -1,18 +1,18 @@
import 'package:flutter/widgets.dart';
class SliderShadow {
final Color shadowColor;
class SliderBoxShadow {
final Color color;
///[double] you can change blurRadius of shadow by this parameter [shadowBlurRadius]
///[double] you can change blurRadius of shadow by this parameter [blurRadius]
///
final double shadowBlurRadius;
final double blurRadius;
///[double] you can change spreadRadius of shadow by this parameter [shadowSpreadRadius]
///[double] you can change spreadRadius of shadow by this parameter [spreadRadius]
///
final double shadowSpreadRadius;
final double spreadRadius;
SliderShadow(
{this.shadowColor = const Color(0xFF9E9E9E),
this.shadowBlurRadius = 25.0,
this.shadowSpreadRadius = 5.0});
SliderBoxShadow(
{this.color = const Color(0xFF9E9E9E),
this.blurRadius = 25.0,
this.spreadRadius = 5.0});
}

1
lib/src/helper/utils.dart
Unescape Escape View File

@ -6,6 +6,7 @@ class Utils {
///
/// This method get Offset base on [sliderOpen] type
///
Utils._();
static Offset getOffsetValues(SlideDirection direction, double value) {
switch (direction) {

121
lib/src/slider.dart
Unescape Escape View File

@ -3,6 +3,7 @@ import 'package:flutter_slider_drawer/src/app_bar.dart';
import 'package:flutter_slider_drawer/src/helper/slider_app_bar.dart';
import 'package:flutter_slider_drawer/src/helper/slider_shadow.dart';
import 'package:flutter_slider_drawer/src/helper/utils.dart';
import 'package:flutter_slider_drawer/src/slider_shadow.dart';
import 'package:flutter_slider_drawer/src/slider_bar.dart';
import 'package:flutter_slider_drawer/src/slider_direction.dart';
@ -74,8 +75,8 @@ class SliderDrawer extends StatefulWidget {
///
final Color splashColor;
///[SliderShadow] you can enable shadow of [child] Widget by this parameter
final SliderShadow? sliderShadow;
///[SliderBoxShadow] you can enable shadow of [child] Widget by this parameter
final SliderBoxShadow? sliderBoxShadow;
///[slideDirection] you can change slide direction by this parameter [slideDirection]
///There are three type of [SlideDirection]
@ -101,7 +102,7 @@ class SliderDrawer extends StatefulWidget {
this.splashColor = const Color(0xffffff),
this.sliderCloseSize = 0,
this.slideDirection = SlideDirection.LEFT_TO_RIGHT,
this.sliderShadow,
this.sliderBoxShadow,
this.appBar = const SliderAppBar(),
this.isCupertino = false})
: super(key: key);
@ -117,27 +118,27 @@ class SliderDrawerState extends State<SliderDrawer>
static const double BLUR_SHADOW = 20.0;
double _percent = 0.0;
AnimationController? _animationDrawerController;
late AnimationController _animationDrawerController;
late Animation _animation;
bool _isDragging = false;
/// check whether drawer is open
bool get isDrawerOpen => _animationDrawerController!.isCompleted;
bool get isDrawerOpen => _animationDrawerController.isCompleted;
/// it's provide [animationController] for handle and lister drawer animation
AnimationController? get animationController => _animationDrawerController;
AnimationController get animationController => _animationDrawerController;
/// Toggle drawer
void toggle() => _animationDrawerController!.isCompleted
? _animationDrawerController!.reverse()
: _animationDrawerController!.forward();
void toggle() => _animationDrawerController.isCompleted
? _animationDrawerController.reverse()
: _animationDrawerController.forward();
/// Open slider
void openSlider() => _animationDrawerController!.forward();
void openSlider() => _animationDrawerController.forward();
/// Close slider
void closeSlider() => _animationDrawerController!.reverse();
void closeSlider() => _animationDrawerController.reverse();
Color _appBarColor = Color(0xffffffff);
@override
@ -151,7 +152,7 @@ class SliderDrawerState extends State<SliderDrawer>
_animation =
Tween<double>(begin: widget.sliderCloseSize, end: widget.sliderOpenSize)
.animate(CurvedAnimation(
parent: _animationDrawerController!,
parent: _animationDrawerController,
curve: Curves.decelerate,
reverseCurve: Curves.decelerate));
if (widget.appBar is SliderAppBar) {
@ -162,29 +163,29 @@ class SliderDrawerState extends State<SliderDrawer>
@override
Widget build(BuildContext context) {
return LayoutBuilder(builder: (context, constrain) {
return Container(
child: Stack(children: <Widget>[
/// Menu
return SizedBox(
child: Stack(children: [
///Menu
SliderBar(
slideDirection: widget.slideDirection,
sliderMenu: widget.slider,
sliderMenuOpenSize: widget.sliderOpenSize,
),
/// Displaying the shadow
if (widget.sliderShadow != null) ...[
_Shadow(
/// Shadow
if (widget.sliderBoxShadow != null) ...[
SliderShadow(
animationDrawerController: _animationDrawerController,
slideDirection: widget.slideDirection,
sliderOpenSize: widget.sliderOpenSize,
animation: _animation,
sliderShadow: widget.sliderShadow!,
sliderBoxShadow: widget.sliderBoxShadow!,
),
],
//Child
AnimatedBuilder(
animation: _animationDrawerController!,
animation: _animationDrawerController,
builder: (_, child) {
return Transform.translate(
offset: Utils.getOffsetValues(
@ -193,7 +194,6 @@ class SliderDrawerState extends State<SliderDrawer>
);
},
child: GestureDetector(
behavior: HitTestBehavior.deferToChild,
onHorizontalDragStart: _onHorizontalDragStart,
onHorizontalDragEnd: _onHorizontalDragEnd,
onHorizontalDragUpdate: (detail) =>
@ -209,7 +209,7 @@ class SliderDrawerState extends State<SliderDrawer>
isCupertino: widget.isCupertino,
slideDirection: widget.slideDirection,
onTap: () => toggle(),
animationController: _animationDrawerController!,
animationController: _animationDrawerController,
splashColor: widget.splashColor,
sliderAppBar: widget.appBar as SliderAppBar,
),
@ -228,18 +228,19 @@ class SliderDrawerState extends State<SliderDrawer>
@override
void dispose() {
super.dispose();
_animationDrawerController!.dispose();
_animationDrawerController.dispose();
}
void _onHorizontalDragStart(DragStartDetails detail) {
if (!widget.isDraggable) return;
//Check use start dragging from left edge / right edge then enable dragging
final rightSideWidthGesture =
MediaQuery.of(context).size.width - WIDTH_GESTURE;
if ((widget.slideDirection == SlideDirection.LEFT_TO_RIGHT &&
detail.localPosition.dx <= WIDTH_GESTURE) ||
(widget.slideDirection == SlideDirection.RIGHT_TO_LEFT &&
detail.localPosition.dx >=
WIDTH_GESTURE) /*&&
rightSideWidthGesture) /*&&
detail.localPosition.dy <= widget.appBarHeight*/
) {
this.setState(() {
@ -270,9 +271,10 @@ class SliderDrawerState extends State<SliderDrawer>
BoxConstraints constraints,
) {
if (!widget.isDraggable) return;
// open drawer for left/right type drawer
if (_isDragging && widget.slideDirection == SlideDirection.LEFT_TO_RIGHT ||
widget.slideDirection == SlideDirection.RIGHT_TO_LEFT) {
// Open Drawer : Slider Open -> Left/Right
if (_isDragging &&
(widget.slideDirection == SlideDirection.LEFT_TO_RIGHT ||
widget.slideDirection == SlideDirection.RIGHT_TO_LEFT)) {
var globalPosition = detail.globalPosition.dx;
globalPosition = globalPosition < 0 ? 0 : globalPosition;
double position = globalPosition / constraints.maxWidth;
@ -281,7 +283,7 @@ class SliderDrawerState extends State<SliderDrawer>
: (1 - position);
move(realPosition);
}
// open drawer for top/bottom type drawer
// Open Drawer : Slider Open -> Top/Bottom
/*if (dragging && widget.slideDirection == SlideDirection.TOP_TO_BOTTOM) {
var globalPosition = detail.globalPosition.dx;
globalPosition = globalPosition < 0 ? 0 : globalPosition;
@ -292,7 +294,7 @@ class SliderDrawerState extends State<SliderDrawer>
move(realPosition);
}*/
// close drawer for left/right type drawer
// Close Drawer : Slider Open -> Left/Right
if (isDrawerOpen &&
(widget.slideDirection == SlideDirection.LEFT_TO_RIGHT ||
widget.slideDirection == SlideDirection.RIGHT_TO_LEFT) &&
@ -303,63 +305,8 @@ class SliderDrawerState extends State<SliderDrawer>
move(double percent) {
_percent = percent;
_animationDrawerController!.value = percent;
}
openOrClose() {
if (_percent > 0.3) {
openSlider();
} else {
closeSlider();
}
_animationDrawerController.value = percent;
}
}
class _Shadow extends StatelessWidget {
const _Shadow({
Key? key,
required AnimationController? animationDrawerController,
required this.animation,
required this.sliderShadow,
required this.slideDirection,
required this.sliderOpenSize,
}) : _animationDrawerController = animationDrawerController,
super(key: key);
final AnimationController? _animationDrawerController;
final Animation animation;
final SliderShadow sliderShadow;
final SlideDirection slideDirection;
final double sliderOpenSize;
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _animationDrawerController!,
builder: (_, child) {
return Transform.translate(
offset: Utils.getOffsetValueForShadow(
slideDirection, animation.value, sliderOpenSize),
child: child,
);
},
child: Container(
width: double.infinity,
height: double.infinity,
decoration: BoxDecoration(shape: BoxShape.rectangle, boxShadow: [
BoxShadow(
color: sliderShadow.shadowColor,
blurRadius: sliderShadow.shadowBlurRadius,
// soften the shadow
spreadRadius: sliderShadow.shadowSpreadRadius,
//extend the shadow
offset: Offset(
15.0, // Move to right 15 horizontally
15.0, // Move to bottom 15 Vertically
),
)
]),
),
);
}
openOrClose() => _percent > 0.3 ? openSlider() : closeSlider();
}

5
lib/src/slider_bar.dart
Unescape Escape View File

@ -18,10 +18,7 @@ class SliderBar extends StatelessWidget {
@override
Widget build(BuildContext context) {
var container = Container(
width: sliderMenuOpenSize,
child: sliderMenu,
);
var container = SizedBox(width: sliderMenuOpenSize, child: sliderMenu);
switch (slideDirection) {
case SlideDirection.LEFT_TO_RIGHT:
return container;

49
lib/src/slider_shadow.dart
Unescape Escape View File

@ -0,0 +1,49 @@
import 'package:flutter/widgets.dart';
import 'package:flutter_slider_drawer/src/helper/utils.dart';
import 'helper/slider_shadow.dart';
import 'slider_direction.dart';
class SliderShadow extends StatelessWidget {
const SliderShadow({
Key? key,
required AnimationController? animationDrawerController,
required this.animation,
required this.sliderBoxShadow,
required this.slideDirection,
required this.sliderOpenSize,
}) : _animationDrawerController = animationDrawerController,
super(key: key);
final AnimationController? _animationDrawerController;
final Animation animation;
final SliderBoxShadow sliderBoxShadow;
final SlideDirection slideDirection;
final double sliderOpenSize;
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _animationDrawerController!,
builder: (_, child) {
return Transform.translate(
offset: Utils.getOffsetValueForShadow(
slideDirection, animation.value, sliderOpenSize),
child: child,
);
},
child: Container(
width: double.infinity,
height: double.infinity,
decoration: BoxDecoration(shape: BoxShape.rectangle, boxShadow: [
BoxShadow(
color: sliderBoxShadow.color,
blurRadius: sliderBoxShadow.blurRadius,
spreadRadius: sliderBoxShadow.spreadRadius,
offset: Offset(15.0, 15.0),
)
]),
),
);
}
}

BIN
slider_d_2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 137 KiB

After

Width:  |  Height:  |  Size: 172 KiB

Write Preview
Loading…
Cancel
Save