Question

当我启动键盘（在iOS和Android上）时，在其上方添加了额外的50 px填充，这显示了空白。

这不是由存在多个Scaffold小部件的其他建议问题引起的。我知道这是由我的布局引起的，我不确定目前是否可以解决。

我有一个静态导航栏，该导航栏出现在应用程序的底部。这是50px高，位于CupertinoApp下面。启动键盘时，似乎会增加额外的填充以填充此空间。该导航栏是一个带有InkWell链接的Container小部件，可直接打开视图，类似于CupertinoTabScaffold，除了我没有选项卡，它只是推送或替换当前导航项

添加resizeToAvoidBottomInset: false,不能使用，因为这会删除滚动动作或不包含50px，因此内容被隐藏。

仅当键盘处于活动状态时，才会出现此问题

CupertinoApp构建器

Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () => Future<bool>.value(true),
      child: Column(
        children: <Widget>[
          Expanded(
            child: DefaultTextStyle(
                style: Fonts.defaultFontStyle(),
                child: CupertinoApp(
                  navigatorKey: navigatorKey,
                  routes: routes.builder,
                )),
          ),
          BottomBar(),
        ],
      ),
    );
  }

添加一个最小的示例以了解一个更好的主意

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.

  final NAVIGATION_HEIGHT = 50.0;

  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

  static const home = "/";
  static const about = "/about";
  static const products = "/products";

  Map<String, WidgetBuilder> builder = {
    home: (BuildContext context) => MyPage(),
    about: (BuildContext context) => MyPage(),
    products: (BuildContext context) => MyPage(),
  };

  Widget _createButtonsBuilder(int index) {
    String pageTitle = builder.keys.toList()[index].substring(1);
    if (pageTitle.length == 0) {
      pageTitle = "Home";
    }

    return Expanded(
      child: Material(
        color: Colors.black87,
        child: InkWell(
            onTap: () {
              navigatorKey.currentState.push(CupertinoPageRoute<void>(
                builder: (BuildContext context) => MyPage(
                      title: "$pageTitle",
                  navigationHeight: NAVIGATION_HEIGHT,
                    ),
              ));
            },
            child: Container(
              padding: EdgeInsets.all(10.0),
              height: NAVIGATION_HEIGHT,
              child: Text(
                "$pageTitle",
                style: TextStyle(
                    inherit: true, color: Colors.white, fontSize: 20.0),
                textAlign: TextAlign.center,
              ),
            )),
      ),
    );
  }

  Widget _BottomBar() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      mainAxisSize: MainAxisSize.max,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: List.generate(builder.keys.toList().length,
              (int i) => _createButtonsBuilder(i)),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Directionality(
      textDirection: TextDirection.ltr,
      child: Container(
        color: Colors.white,
        child: Column(
          children: <Widget>[
            Expanded(
              child: CupertinoApp(
                title: 'Flutter Demo',
                routes: builder,
                navigatorKey: navigatorKey,
              ),
            ),
            _BottomBar()
          ],
        ),
      ),
    );
  }
}

class MyPage extends StatefulWidget {
  MyPage({Key key, this.title, this.navigationHeight}) : super(key: key);

  final String title;
  final double navigationHeight;

  @override
  _MyPageState createState() => _MyPageState();
}

class _MyPageState extends State<MyPage> {
  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
        navigationBar: CupertinoNavigationBar(),
        child: Scrollbar(
          child: SingleChildScrollView(
            child: SafeArea(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text(
                    '${widget.title}',
                  ),
                  SizedBox(height: 40.0),
                  Container(
                    margin: EdgeInsets.all(30.0),
                    child: CupertinoTextField(
                      placeholder: "Tap in here",
                    ),
                  ),
                  Container(
                      margin: EdgeInsets.all(30.0),
                      child: Text(
                          "When tapping to add focus to the above CupertinoTextField Widget the keyboard will appear as normal but because of the _BottomBar() outside the CupertinoApp the height (${widget.navigationHeight}px) is included in the padding above the keyboard")),
                  Container(
                      margin: EdgeInsets.all(30.0),
                      child: Text(
                          "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi interdum blandit diam sed faucibus. Donec ut enim in ante luctus sagittis. Donec vestibulum aliquet nunc, in efficitur erat molestie quis. In dictum aliquet neque. Vivamus pharetra nibh dictum urna sodales malesuada. Nunc porta condimentum mi, sed laoreet erat maximus vitae. Nunc luctus nisi urna, a luctus nisi consectetur quis. Sed rhoncus euismod nisl, in laoreet leo molestie sed. Suspendisse aliquet commodo dui, sit amet rhoncus sapien venenatis in. Nulla tempus libero diam, non cursus odio euismod at. Fusce nec ipsum ipsum. Mauris congue blandit risus, vitae pretium leo euismod id. Vivamus venenatis finibus diam id auctor. Donec vel urna finibus erat viverra bibendum. Vivamus sagittis eros id bibendum tristique. Nullam eleifend elit dapibus elit porttitor, ac egestas libero mollis.\n\nMorbi eleifend ligula sed leo placerat tristique. Mauris consequat fringilla maximus. Fusce pharetra ultrices risus, quis fermentum urna ultrices non. Vivamus suscipit nunc non ipsum ultrices laoreet. Etiam sed vestibulum eros, nec tempus neque. Vestibulum efficitur mauris ac ipsum aliquet, et tincidunt massa suscipit. Vivamus enim justo, viverra tempor purus eu, elementum tempor tortor. Sed rhoncus gravida sem, vitae molestie augue iaculis et. Donec augue ligula, interdum id interdum sit amet, condimentum in dolor. Donec dignissim erat lorem, ut accumsan felis porta id. Nunc lorem enim, maximus ut odio at, ultrices sodales velit."))
                ],
              ),
            ),
          ),
        ) // This trailing comma makes auto-formatting nicer for build methods.
        );
  }
}

Answer 1

我将CupertinoApp封装在Scaffold小部件中，该小部件暴露了bottomNavigationBar。

@override
  Widget build(BuildContext context) {
    return WillPopScope(
        onWillPop: () => Future<bool>.value(true),
        child: Scaffold(
          body: DefaultTextStyle(
                style: Fonts.defaultFontStyle(),
                child: CupertinoApp(
                  navigatorKey: navigatorKey,
                  routes: routes.builder,
                )),
          ),
          bottomNavigationBar: HomeBottomBar(),
        ));
  }

然后将resizeToAvoidBottomPadding = true添加到任何具有CupertinoTextfield子级的CupertinoPageScaffold

键盘在上方添加了额外的填充

添加一个最小的示例以了解一个更好的主意

1 个答案: