Flutter:小部件优先级:CustomPainter受滚动的影响

时间:2020-02-06 14:41:56

标签: flutter dart flutter-layout

我有一个包装在SingleChildScrollWidget中的小部件,其中一个是称为SignaturePad()的小部件,其中包含一个自定义绘画程序,可以在其上签名。

我遇到的问题是,滚动优先于CustomePainter小部件,这导致如果由于TextFieldForm焦点而将小部件向上推,则无法上下滑动。下面的示例:

enter image description here

代码:

body: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              Column(
                children: <Widget>[
                  Text(
                    "Enter Client Details",
                    style: fontStyle,
                  ),
                  Form(
                    key: _formKey,
                    child: Column(
                      children: <Widget>[
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: <Widget>[
                            Container(
                              width: screenWidth / 2,
                              child: Column(
                                children: <Widget>[
                                  MyTextFormField(
                                    controller: dateController,
                                    labelText: 'Date',
                                    prefixIcon: Icon(Icons.calendar_today),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Date Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  MyTextFormField(
                                    controller: nameController,
                                    labelText: 'Name',
                                    prefixIcon: Icon(Icons.face),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Name Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  MyTextFormField(
                                    controller: phoneController,
                                    labelText: 'Phone Number',
                                    prefixIcon: Icon(Icons.phone),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Phone Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  MyTextFormField(
                                    controller: emailController,
                                    labelText: 'Email',
                                    isEmail: true,
                                    prefixIcon: Icon(Icons.email),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Email Validation Successful');
                                      //return null;
                                    },
                                  ),
                                ],
                              ),
                            ),
                            Container(
                              width: screenWidth / 2,
                              child: Column(
                                children: <Widget>[
                                  MyTextFormField(
                                    controller: passkeyController,
                                    labelText: 'Passkeys',
                                    prefixIcon: Icon(Icons.security),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Passkeys Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  MyTextFormField(
                                    controller: makeController,
                                    labelText: 'Make',
                                    prefixIcon: Icon(Icons.computer),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Make Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  MyTextFormField(
                                    controller: modelController,
                                    labelText: 'Model',
                                    prefixIcon: Icon(Icons.directions_car),
                                    validator: (val) {
                                      //Do the validation e.g. if(val < 7) {code...}
                                      print('Model Validation Successful');
                                      //return null;
                                    },
                                  ),
                                  Padding(
                                    padding: EdgeInsets.all(5.0),
                                    child: CheckBox(
                                      checkBoxWidth: screenWidth / 2.05,
                                      isCharger: isCharger,
                                      isMouse: isMouse,
                                      isBag: isBag,
                                      setCharger: setCharger,
                                      setBag: setBag,
                                      setMouse: setMouse,
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ],
                        ),

                        Container(
                          width: screenWidth,
                          child: MyTextFormField(
                            controller: faultController,
                            labelText: 'Fault',
                            prefixIcon: Icon(Icons.build),
                            validator: (val) {
                              //Do the validation e.g. if(val < 7) {code...}
                              print('Fault Validation Successful');
                              //return null;
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),


              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Container(
                    width: screenWidth / 2.05,
                    child: Wrap(
                      alignment: WrapAlignment.center,
                      children: <Widget>[
                        Text(
                          "Terms and Conditions",
                          style: fontStyle,
                        ),
                        Text(
                          "",
                          textAlign: TextAlign.justify,
                          style: TextStyle(fontSize: 15.0),
                        ),
                      ],
                    ),
                  ),

                  //Signing area
                  Container(
                    height: 150.0,
                    width: screenWidth / 2,
                    child: SignaturePad(),
                  ),

                ],
              ),

              Center(
                child: RaisedButton(
                    child: Text("Save and Submit"),
                    onPressed: () {
                      _submitForm();
                      _imageFile = null;
                      screenshotController.capture().then((File image) async {
                        print("Capture Done. File: $image");
                        setState(() {
                          _imageFile = image;
                        });
                        final result = await ImageGallerySaver.saveImage(image
                            .readAsBytesSync()); // Save image to gallery,  Needs plugin  https://pub.dev/packages/image_gallery_saver
                        _showSnackBar("File Saved to Gallery");
                      }).catchError((onError) {
                        print(onError);
                      });
                    }),
              ),
            ],
          ),
        ),

主要问题是,我似乎无法将签名区域从可滚动窗口小部件中移出,而不会产生一些不利影响,例如单击时textformfields不会向上推,或者textformfields下方的区域“超出范围/溢出” “。

有人建议如何解决此问题,或者使签名小部件的优先级高于滚动吗?

0 个答案:

没有答案