Flutter中比较常见的问题

1.使用AppBar后如何去掉左边的返回箭头。我们查看原代码

    Widget leading = widget.leading;
    if (leading == null && widget.automaticallyImplyLeading) {
      if (hasDrawer) {
        leading = IconButton(
          icon: const Icon(Icons.menu),
          onPressed: _handleDrawerButton,
          tooltip: MaterialLocalizations.of(context).openAppDrawerTooltip,
        );
      } else {
        if (canPop)
          leading = useCloseButton ? const CloseButton() : const BackButton();
      }
    }
    if (leading != null) {
      leading = ConstrainedBox(
        constraints: const BoxConstraints.tightFor(width: _kLeadingWidth),
        child: leading,
      );
    }

修改方式为， leading为null，automaticallyImplyLeading为false：

appBar: AppBar(
    leading: null,
    automaticallyImplyLeading: false,
)

使用flutter的canvas做文字绘制的时候用到的api为TextPainter
使用flutter绘制控件的时候想做到控件超出屏幕范围后自动换行，那么请参考Wrap，可以轻松实现如下的布局：

要实现类似安卓原生ViewPager的UI，请使用PageView，注意定义自己的PageController，然后可以利用PageController的jumpToPage（int）实现自定义的Page页的跳转
要实现类似顶部和底部导航栏，请参考TabBar，适当的时候可以和AppBar结合使用
flutter is a SingleTickerProviderStateMixin but multiple tickers were created. 报错，原因是多个地方调用setState请求重绘，但是state使用的是SingleTickerProviderStateMixin ，将其改成TickerProviderStateMixin即可。
解决类冲突的问题，比如，我自定义一个Banner.dart类，这个类跟系统的Banner冲突，那么我们可以这样解决。

import 'package:flutter/material.dart';
import 'package:myproject/Banner.dart' as myproject;
 
//这样使用我们自己的Banner
myproject.Banner _myBanner;
//系统的Banner
Banner _banner;

解决Android手机布局浸入到状态栏的问题，用一个SafeArea进行包装即可，如下：

SafeArea(top: true,
    child: MaterialApp(
        home: ,
    ),
);

在切换tabbar或者pageview的时候要保存上一个tab widget的状态，参考AutomaticKeepAliveClientMixin既可，如下：

//假如PageView有四个子页面
 
 @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: PageView(
          controller: pageController,
          children: <Widget>[
            ArticlesPage(),
            ProjectPage(),
            NavigationPage(),
            CollectionArticlesPage(),
          ],
          onPageChanged: changePage,
        ),
        bottomNavigationBar: Navigations(_page, changePage));
  }
 
 
 
//然后在子Page的State分别实现with AutomaticKeepAliveClientMixin，wantkeepAlive返回true
 
class ArticlesPageState extends State<ArticlesPage> with AutomaticKeepAliveClientMixin{
  @override
  bool get wantKeepAlive => true;
}
 
class ProjectPageState extends State<ProjectPage> with AutomaticKeepAliveClientMixin{
  @override
  bool get wantKeepAlive => true;
}
 
class NavigationPageState extends State<NavigationPage> with AutomaticKeepAliveClientMixin{
  @override
  bool get wantKeepAlive => true;
}
 
class CollectionArticlesPageState extends State<CollectionArticlesPage> with AutomaticKeepAliveClientMixin{
  @override
  bool get wantKeepAlive => true;
}

Android手机启动时候白屏的问题解决，android/app/src/main/res/drawable/launch_background.xml中定义了自定义splash的方法：

<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@android:color/white" />
 
    <!-- You can insert your own image assets here -->
    <!-- <item>
        <bitmap
            android:gravity="center"
            android:src="@mipmap/launch_image" />
    </item> -->
</layer-list>

将注释去掉，替换为自己的launcher_image即可。

界面存在输入框的时候，点击后软键盘将页面顶起来导致页面重绘的问题（Android fitsystem），可以通过将Scaffold的resizeToAvoidBottomPadding属性设置为false来关闭重绘，如下：

return Scaffold(
      resizeToAvoidBottomPadding: false,
);

修改TextFiled的边界宽度，可以通过decoration的contentPadding属性进行修改，如下：

return TextField(
        decoration: InputDecoration(
          contentPadding: EdgeInsets.all(8),
        ),
);

如果想实现一个布局，在某些条件下显示，可以采用Offstage布局，动态控制其offstage属性值即可
如果出现弹出输入法的时候导致Overflow错误，可以将布局镶嵌到SingleChildScrollView中，比如：

return Scaffold(
      body: SingleChildScrollView(
        child: Container(
          constraints: BoxConstraints(
            maxHeight: MediaQuery.of(context).size.height,
            maxWidth: MediaQuery.of(context).size.width,
          ),
        ),
    ),
);

GridView的item宽高默认是1:1，可以通过修改childAspectRatio的值来进行宽高的修改，该值代表宽：高
flutter中绘制虚线，使用path_drawing
flutter 中禁用GridView的滚动，可以使用physics属性，取值为NeverScrollableScrollPhysics()，如下：

GridView.count(
      physics: NeverScrollableScrollPhysics(),
);

flutter隐藏状态栏，使用：

SystemChrome.setEnabledSystemUIOverlays([]);

本文来自：https://blog.csdn.net/email_jade/article/details/85317859

Flutter中比较常见的问题

猜您喜欢

发表评论