落在pdf（EasyWebView）顶部的部分窗口对话框（showDatePicker）不起作用，没有反应

Posted 2023-02-23

【中文标题】落在pdf（EasyWebView）顶部的部分窗口对话框（showDatePicker）不起作用，没有反应

【英文标题】：Part of the window dialog(showDatePicker) that falls on top of the pdf(EasyWebView) does not work, not react

【发布时间】：2021-04-14 09:58:19

【问题描述】：

我使用了两个插件：EasyWebView 和 showDatePicker。在 EasyWebView 我通过链接显示 pdf。在某些情况下，我需要显示一个日期选择器对话框，使用 showDatePicker，用户将在其中选择一个日期。问题是位于 pdf(EasyWebView) 顶部的窗口对话框 (showDatePicker) 部分不起作用。 pdf侧面没有一个按钮没有反应。不在 pdf 表面上的其余按钮 - 工作

示例显示窗口对话框的A部分叠加在pdf上并不起作用，同时B部分工作正常。

PDF (EasyWebView) 小部件代码：

Expanded(
      flex: 2,
      child: new Container(
        padding: new EdgeInsets.only(left: 8.0, right: 8.0),
        child: Card(
          clipBehavior: Clip.antiAlias,
          child: SizedBox(
              height: 9000, // constrain height
              child: EasyWebView(
                src: widget.url, // API url
                ishtml: false,
                // Use Html syntax
                isMarkdown: false,
                // Use markdown syntax
                convertToWidgets: false,
                onLoaded: () , // Try to convert to flutter widgets
                // width: 100,
                // height: 100,
              )),
        ),
      ),
    );

dialog(showDatePicker) 小部件代码：

    return Padding(
      padding: const EdgeInsets.only(top: 20.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Expanded(
            flex: 1,
            child: GestureDetector(
              onTap: () async 
                DateTime endDatePicked =
                    await showDatePicker(context: context, initialDate: _endDate, firstDate: _earliestEndDate, lastDate: _latestEndDate);
                setState(() 
                  if (endDatePicked != null) 
                    _endDate = endDatePicked;
                    _selectedDateText = getFormattedDateValue(_endDate);
                    endDataLog.comment = _endDate.toString();
                  
                );
              ,
              child: Container(
                decoration: BoxDecoration(
                  border: Border(
                    bottom: BorderSide(width: 1.0, color: RendinColor.darkGrey),
                  ),
                ),
                child: TextFormField(
                  //enabled: false,
                  keyboardType: TextInputType.datetime,
                  readOnly: true,
                  onTap: () async 
                    DateTime endDatePicked = await showDatePicker(
                        context: context, initialDate: _endDate, firstDate: _earliestEndDate, lastDate: _latestEndDate);
                    setState(() 
                      if (endDatePicked != null) 
                        _endDate = endDatePicked;
                        _selectedDateText = getFormattedDateValue(_endDate);
                        endDataLog.comment = _endDate.toString();
                      
                    );
                  ,
                  validator: (val) => _selectedDateText == getFormattedDateValue(_endDate)
                      ? null
                      : translate("agreement.termination.choose_date", context: context),
                  decoration: InputDecoration(hintText: _selectedDateText),
                  style: TextStyle(color: RendinColor.darkGrey),
                ),
              ),
            ),
          )
        ],
      ),
    );

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, 1.24.0-10.2.pre, on Mac OS X 10.15.7 19H2 darwin-x64, locale en-EE)
[✓] android toolchain - develop for Android devices (Android SDK version 30.0.1)
[✓] Xcode - develop for ios and macOS (Xcode 11.7)
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.0)
[✓] IntelliJ IDEA Ultimate Edition (version 2020.2)
[✓] Connected device (2 available)

• No issues found!

如何解决？

【问题讨论】：

在您共享 MRE 之前无法解决此问题。请考虑向我们展示一些代码。然后社区可以提供帮助。除此之外，了解您正在测试哪个平台，哪个颤振版本会很有帮助。这将有助于隔离问题。

@AbhilashChandran 感谢您的评论。我添加了一个代码和颤振医生

【参考方案1】：

解决方案是通过showDataPicker() 的TransitionBuilder builder 参数使用PointerInterceptor

例子：

final date = await showDatePicker(
    ...,
    builder: (ctx, child) => PointerInterceptor(child: child)
);