PS: 接觸Flutter已經(jīng)有一段時(shí)間了小渊，默默的擼app也快接近尾聲了，其中遇到了蠻多坑（或許也不叫做坑卖氨，只是功夫不夠深^^），不過感覺都有驚無險(xiǎn)的度過了负懦。然鵝筒捺，小白的開拓之路注定是坎坷的，這不又遇到難題了纸厉。系吭。】牌罚“在模態(tài)框里有輸入框彈出鍵盤”肯尺，首先想的是用系統(tǒng)提供的showModalBottomSheet，然而躯枢，因?yàn)楦叨鹊南拗圃蛞鳎斎肟蜃⒍ū绘I盤擋住， 那腫么辦呢闺金。逾滥。。經(jīng)過一系列嘗試終于找到辦法了败匹，分享下解決方案:
- 國際慣例
input.gif
- 先創(chuàng)建一個(gè)帶輸入框的半透明的頁面
import 'package:flutter/material.dart';
class BottomInputDialog extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
backgroundColor: Colors.transparent,
body: new Column(
children: <Widget>[
Expanded(
child: new GestureDetector(
child: new Container(
color: Colors.black54,
),
onTap: () {
Navigator.pop(context);
},
)
),
new Container(
height: 50,
color: Colors.white,
child: TextField(
autofocus: true,
maxLines: 100,
)
)
],
),
);
}
}
- 關(guān)鍵：代碼跳轉(zhuǎn)上面半透明頁面時(shí)選擇自定義的Route, 代碼如下：
import 'package:flutter/material.dart';
class PopRoute extends PopupRoute{
final Duration _duration = Duration(milliseconds: 300);
Widget child;
PopRoute({@required this.child});
@override
Color get barrierColor => null;
@override
bool get barrierDismissible => true;
@override
String get barrierLabel => null;
@override
Widget buildPage(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
return child;
}
@override
Duration get transitionDuration => _duration;
}
- 調(diào)用方式很簡單寨昙，
Navigator.push(context, PopRoute(child: BottomInputDialog()));
