Flutter 一些坑

[popeyelau]

WebView 相关

• iOS 禁用 H5页面视频全屏
  [webview_flutter] Added 'allowsInlineMediaPlayback' property flutter/plugins#3334
  webview_flutter ios disable native fullscreen video flutter/flutter#25630

• 使用 Safari 替换脚本文件
  找到对应的脚本文件，右键 - 创建本地覆盖

• Android 允许混合模式

if (Build.VERSION.SDK_INT > Build.VERSION_CODES.LOLLIPOP) {
       webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}
webView.getSettings().setBlockNetworkImage(false);

• iOS 允许混合模式 (info.plist)

<key>NSAppTransportSecurity</key>
 <dict>
   <key>NSAllowsArbitraryLoads</key>
   <true/>
  <key>NSAllowsArbitraryLoadsInWebContent</key>
  <true/>
</dict>

[popeyelau]

• Stack 中子组件超出边界，不响应事件

Stack(
      overflow: Overflow.visible, //超出边界显示
      children: [
        //...
        Positioned(
            right: -20,
            bottom: -20,
            child: GestureDetector(
              onTap: () {
                //如果点击区域在超出边界范围内，是不会响应事件的
              },
            )),
      ],
    );

flutter/flutter#19445
https://stackoverflow.com/questions/62258640/flutter-overflowed-positioned-button-is-not-clickable

[popeyelau]

• CustomScrollView/Column/ Stack 中会有大约 1px 的间隔闪烁 （没有好的解决方案)
  

临时解决方案 向上偏移 1px
Transform.translate(offset: Offset(0, -1), child: <some widget>);

flutter/flutter#14288
flutter/flutter#37578

[popeyelau]

• 忽略父组件 padding
  

 Container(
  padding: EdgeInsets.all(16.0),
  child: Column(
    children: [
      Container(color: randomColor, height: rowHeight),
      Container(color: randomColor, height: rowHeight),
      Container(
        height: rowHeight,
        child: OverflowBox(  //OverflowBox
          minWidth: screenWidth,
          minHeight: rowHeight,
          maxHeight: rowHeight,
          maxWidth: screenWidth,
          child: Container(
            color: Colors.indigo,
            child: Center(child: Text("Hello World")),
          ),
        ),
      ),
      Container(color: randomColor, height: rowHeight),
    ],
  ))

[popeyelau]

webview_flutter iOS 视频默认全屏
flutter/flutter#25630

[popeyelau]

虚线边框
flutter/flutter#4858 (comment)