Чтобы создать нижний лист Flutter с наложением кнопки ввода, вы можете использовать различные методы. Вот несколько примеров кода:
Метод 1: использование showModalBottomSheet и RaishedButton
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget {
void _showBottomSheet(BuildContext context) {
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text('Bottom Sheet Content'),
SizedBox(height: 16.0),
RaisedButton(
child: Text('Close'),
onPressed: () {
Navigator.of(context).pop();
},
),
],
),
),
);
},
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Bottom Sheet Example'),
),
body: Center(
child: RaisedButton(
child: Text('Open Bottom Sheet'),
onPressed: () {
_showBottomSheet(context);
},
),
),
);
}
}
Метод 2: использование DraggableScrollableSheet и RaishedButton
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Bottom Sheet Example'),
),
body: Column(
children: <Widget>[
Expanded(
child: Center(
child: RaisedButton(
child: Text('Open Bottom Sheet'),
onPressed: () {
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return DraggableScrollableSheet(
expand: false,
builder: (BuildContext context, ScrollController scrollController) {
return Container(
color: Colors.white,
child: ListView(
controller: scrollController,
children: <Widget>[
ListTile(
title: Text('Item 1'),
),
ListTile(
title: Text('Item 2'),
),
ListTile(
title: Text('Item 3'),
),
RaisedButton(
child: Text('Close'),
onPressed: () {
Navigator.of(context).pop();
},
),
],
),
);
},
);
},
);
},
),
),
),
],
),
);
}
}
Метод 3: использование Persistent Bottom Sheet и RaishedButton
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget {
PersistentBottomSheetController _controller;
void _showBottomSheet(BuildContext context) {
_controller = Scaffold.of(context).showBottomSheet(
(BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text('Bottom Sheet Content'),
SizedBox(height: 16.0),
RaisedButton(
child: Text('Close'),
onPressed: () {
_controller.close();
},
),
],
),
),
);
},
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Bottom Sheet Example'),
),
body: Center(
child: RaisedButton(
child: Text('Open Bottom Sheet'),
onPressed: () {
_showBottomSheet(context);
},
),
),
);
}
}