-
Notifications
You must be signed in to change notification settings - Fork 22
/
draggable_sheet.dart
74 lines (66 loc) · 2.47 KB
/
draggable_sheet.dart
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
import 'package:flutter/material.dart';
import 'package:smooth_sheets/smooth_sheets.dart';
void main() {
runApp(const _BasicDraggableSheetExample());
}
class _BasicDraggableSheetExample extends StatelessWidget {
const _BasicDraggableSheetExample();
@override
Widget build(BuildContext context) {
return const MaterialApp(
// Typically, you would use a Stack to place the sheet
// on top of another widget.
home: Stack(
children: [
Scaffold(),
_MySheet(),
],
),
);
}
}
class _MySheet extends StatelessWidget {
const _MySheet();
@override
Widget build(BuildContext context) {
// The sheet will have the same height as the content.
// If you want to the sheet to be as big as the screen,
// wrap the content in a widget that fills the free space
// such as SizedBox.expand().
const content = SafeArea(
top: false,
child: Padding(
padding: EdgeInsets.all(24),
child: Text(_loremIpsum),
),
);
// Then, wrap the content in DraggableSheet.
// Note that DraggableSheet does not work with scrollable widgets.
// If you want to use a scrollable widget as its content,
// use ScrollableSheet instead.
return DraggableSheet(
child: buildSheetBackground(context, content),
);
}
Widget buildSheetBackground(BuildContext context, Widget content) {
// Add background color, circular corners and material shadow to the sheet.
// This is just an example, you can customize it however you want!
return Material(
color: Theme.of(context).colorScheme.secondaryContainer,
borderRadius: BorderRadius.circular(16),
clipBehavior: Clip.antiAlias,
child: content,
);
}
}
const _loremIpsum = '''
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis auctor id turpis vel pulvinar.
Etiam rhoncus mollis mollis. Nam fringilla justo quis nulla scelerisque, sed consectetur libero
pretium. Curabitur vel ornare orci, non cursus risus. Cras faucibus, purus et porta
scelerisque, ligula nulla pulvinar sem, vitae efficitur ipsum risus non lacus.
Ut in purus est. Mauris vitae fringilla velit. Cras pharetra finibus dolor nec condimentum.
Nunc lacinia velit quis ex tempus congue. Proin porttitor iaculis lacinia.
Cras sit amet cursus urna. Nullam tincidunt ullamcorper elementum. Ut hendrerit mi a tellus posuere,
in iaculis felis blandit. Cras malesuada lorem augue, et porttitor sem aliquet et. Aliquam
nec diam nisl.
''';