-
Notifications
You must be signed in to change notification settings - Fork 22
/
keyboard_dismiss_behavior.dart
201 lines (183 loc) · 5.87 KB
/
keyboard_dismiss_behavior.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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
import 'package:flutter/material.dart';
import 'package:smooth_sheets/smooth_sheets.dart';
void main() {
runApp(const _KeyboardDismissBehaviorExample());
}
class _KeyboardDismissBehaviorExample extends StatelessWidget {
const _KeyboardDismissBehaviorExample();
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: _ExampleHome(),
);
}
}
enum _KeyboardDismissBehaviorKind {
onDrag(
'onDrag',
'Dismisses the keyboard when the user drags the sheet.',
),
onDragDown(
'onDragDown',
'Dismisses the keyboard only when the user drags the sheet downwards.',
),
onDragUp(
'onDragUp',
'Dismisses the keyboard only when the user drags the sheet upwards.',
);
final String name;
final String description;
const _KeyboardDismissBehaviorKind(this.name, this.description);
}
class _ExampleHome extends StatefulWidget {
const _ExampleHome();
@override
State<_ExampleHome> createState() => _ExampleHomeState();
}
class _ExampleHomeState extends State<_ExampleHome> {
_KeyboardDismissBehaviorKind selectedBehavior =
_KeyboardDismissBehaviorKind.onDrag;
bool isContentScrollAware = false;
bool isFullScreen = false;
@override
Widget build(BuildContext context) {
final options = [
for (final behavior in _KeyboardDismissBehaviorKind.values)
RadioListTile(
title: Text(behavior.name),
subtitle: Text(behavior.description),
value: behavior,
groupValue: selectedBehavior,
contentPadding: const EdgeInsets.only(left: 32, right: 16),
controlAffinity: ListTileControlAffinity.trailing,
onChanged: (value) => setState(() {
selectedBehavior = value!;
}),
),
];
return Scaffold(
body: SafeArea(
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const ListTile(
title: Text('keyboardDismissBehavior'),
subtitle: Text(
'Determines when the sheet should dismiss the on-screen keyboard.',
),
),
...options,
const Divider(),
CheckboxListTile(
value: isContentScrollAware,
title: const Text('isContentScrollAware'),
subtitle: const Text(
'If enabled, the on-screen keyboard will also be dismissed when '
'the user scrolls up/down the scrollable content. Test this behavior '
'by entering lots of text (or blank lines) until the text field becomes '
'scrollable, and scroll it.',
),
controlAffinity: ListTileControlAffinity.trailing,
onChanged: (value) {
setState(() => isContentScrollAware = value!);
},
),
const Divider(),
CheckboxListTile(
value: isFullScreen,
title: const Text('isFullScreen'),
onChanged: (value) {
setState(() => isFullScreen = value!);
},
),
const SizedBox(height: 100),
],
),
),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
floatingActionButton: FloatingActionButton.extended(
label: const Text('Show sheet'),
onPressed: () => showExampleSheet(context),
),
);
}
void showExampleSheet(BuildContext context) {
// This object determines when the sheet should dismisses the on-screen keyboard.
final keyboardDismissBehavior = switch (selectedBehavior) {
_KeyboardDismissBehaviorKind.onDrag =>
SheetKeyboardDismissBehavior.onDrag(
isContentScrollAware: isContentScrollAware),
_KeyboardDismissBehaviorKind.onDragDown =>
SheetKeyboardDismissBehavior.onDragDown(
isContentScrollAware: isContentScrollAware),
_KeyboardDismissBehaviorKind.onDragUp =>
SheetKeyboardDismissBehavior.onDragUp(
isContentScrollAware: isContentScrollAware),
};
Navigator.push(
context,
ModalSheetRoute(
swipeDismissible: true, // Enable the swipe-to-dismiss behavior.
builder: (context) => SafeArea(
bottom: false,
child: SheetViewport(
child: _ExampleSheet(
isFullScreen: isFullScreen,
keyboardDismissBehavior: keyboardDismissBehavior,
),
),
),
),
);
}
}
class _ExampleSheet extends StatelessWidget {
const _ExampleSheet({
required this.isFullScreen,
required this.keyboardDismissBehavior,
});
final bool isFullScreen;
final SheetKeyboardDismissBehavior? keyboardDismissBehavior;
@override
Widget build(BuildContext context) {
Widget body = const SingleChildScrollView(
child: TextField(
maxLines: null,
decoration: InputDecoration(
hintText: 'Enter some text...',
),
),
);
if (isFullScreen) {
body = SizedBox.expand(child: body);
}
return SheetKeyboardDismissible(
dismissBehavior: keyboardDismissBehavior,
child: ScrollableSheet(
child: SheetContentScaffold(
appBar: AppBar(),
body: body,
bottomBar: StickyBottomBarVisibility(
child: BottomAppBar(
child: Row(
children: [
IconButton(
onPressed: () {},
icon: const Icon(Icons.menu),
),
const Spacer(),
IconButton(
onPressed: () {},
icon: const Icon(Icons.more_vert),
),
],
),
),
),
),
),
);
}
}