简体   繁体   中英

here my listview is not scrolling dart flutter , please help me iam new to flutter

return Scaffold(
   body: Container(
     width: MediaQuery.of(context).size.width,
     height: MediaQuery.of(context).size.height,
     child: Stack(
       children: [
         Positioned(
           width: MediaQuery.of(context).size.width,
           height: 25.0*SizeConfig.heightMultiplier,
           child:Container(
             decoration: BoxDecoration(
                 gradient: LinearGradient(
                     begin: Alignment.topCenter,
                     end: Alignment.bottomCenter,
                     colors: [Color(0xff009cba), Color(0xff000e11)])

             ),
             child: Row(
               mainAxisAlignment: MainAxisAlignment.spaceEvenly,
               crossAxisAlignment: CrossAxisAlignment.center,
               children: [
                 Expanded(flex:3,
                   child: Container(
                     child: Column(
                       mainAxisAlignment: MainAxisAlignment.center,
                       crossAxisAlignment: CrossAxisAlignment.end,
                       children: [
                         FittedBox(child: Text("Firm Details",style: GoogleFonts.lato(color: Color(0xfffbfbfb),fontSize: 1.6*SizeConfig.textMultiplier),/*TextStyle(color: Color(0xfffbfbfb),)*/)),
                         SizedBox(height: 0.5*SizeConfig.heightMultiplier,),
                         FittedBox(child: Text("Please select the category that best describes your business model.",style: GoogleFonts.lato(color: Color(0xffb3fbfbfb),fontSize: 1.3*SizeConfig.textMultiplier) /*TextStyle(color: Color(0xffb3fbfbfb),fontSize: 12.0)*/,)),
                       ],
                     ),
                   ),
                 ),
                 Expanded(flex:1,child:Container(
                   width: 10.0*SizeConfig.widthMultiplier,
                   height: 10.0*SizeConfig.heightMultiplier,
                   child:Image.asset("assets/images/firmDetail.png",width:1.0*SizeConfig.widthMultiplier,height: 1.0*SizeConfig.heightMultiplier,),
                 ), ),
               ],
             ),
           ), ),
         Positioned(
           top:20.0*SizeConfig.heightMultiplier,
           child:Container(
             width: MediaQuery.of(context).size.width,
             height: 500.0*SizeConfig.heightMultiplier,
             decoration: BoxDecoration(
               borderRadius: BorderRadius.circular(5.0*SizeConfig.widthMultiplier),
               color: Colors.white,
             ),
             child:new Container(
               child: ListView(
                 scrollDirection: Axis.vertical,
                 children: <Widget>[
                   SizedBox(height: 2.0*SizeConfig.heightMultiplier,),
                   Center(child: Padding(
                     padding:  EdgeInsets.all(1.8*SizeConfig.heightMultiplier),
                     child: Text("Please select the category that best describes your business model.",style: GoogleFonts.lato(fontWeight: FontWeight.bold),),
                   )),
                   horizontalList1,
                   verticalList,    // here vertical list
                 ],
               ),
             ),
           ),
         ),
       ],
     ),
   ),
 );

here in widget verticallist Listview is not scrolling,but when we add Sizedbox after form with fixedheight then it is scrolling but i dont need fixed height for scrollview

      Widget verticalList = new Container(
        margin: EdgeInsets.symmetric(vertical: 0*SizeConfig.heightMultiplier),
        height: MediaQuery.of(context).size.height,
        child:ListView(
          shrinkWrap: true,
          scrollDirection: Axis.vertical,
          children: [
            Form(
              key: _formKey,
              child:ListView(
                shrinkWrap: true,
                children: [
                  Padding(
                    padding:EdgeInsets.only(left:6.0*SizeConfig.widthMultiplier,right: 6.0*SizeConfig.widthMultiplier,top:1.8*SizeConfig.widthMultiplier,bottom: 1.8*SizeConfig.widthMultiplier),
                    child: new TextFormField(
                      validator: (String value) {
                        if (value.isEmpty) {
                          return 'PinCode';
                        } else {
                          return null;
                        }
                      },
                      keyboardType: TextInputType.phone,
                      controller: _pincode,
                      // selectionColor:Color(0xffe4065f),
                      style: GoogleFonts.lato(fontSize: 1.6*SizeConfig.textMultiplier,),
                      decoration: const InputDecoration(
                        labelText: "PinCode",
                        labelStyle: TextStyle(color: Color(0xffe4065f)),
                        focusColor: Color(0xffe4065f),
                        hintText:
                        "PinCode",
                        hintStyle: TextStyle(fontSize: 13.0),
                        focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(
                                color: Color(0xffe4065f))),
                      ),
                      //  style: Theme.of(context).textTheme.body1,
                    ),
                  ),
                  Padding(
                    padding:EdgeInsets.only(left:6.0*SizeConfig.widthMultiplier,right: 6.0*SizeConfig.widthMultiplier,top:1.8*SizeConfig.widthMultiplier,bottom: 1.8*SizeConfig.widthMultiplier),
                    child: new TextFormField(
                      validator: (String value) {
                        if (value.isEmpty) {
                          return 'PAN of the unit. is required';
                        } else {
                          return null;
                        }
                      },
                      keyboardType: TextInputType.text,
                      controller: _pan,
                      // selectionColor:Color(0xffe4065f),
                      style: GoogleFonts.lato(fontSize: 1.6*SizeConfig.textMultiplier,),
                      decoration: const InputDecoration(
                        labelText: "PAN of the unit",
                        labelStyle: TextStyle(color: Color(0xffe4065f)),
                        focusColor: Color(0xffe4065f),
                        hintText:
                        "PAN of the unit",
                        hintStyle: TextStyle(fontSize: 13.0),
                        focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(
                                color: Color(0xffe4065f))),
                      ),
                      //  style: Theme.of(context).textTheme.body1,
                    ),
                  ),
                  Padding(
                    padding:EdgeInsets.only(left:6.0*SizeConfig.widthMultiplier,right: 6.0*SizeConfig.widthMultiplier,top:1.8*SizeConfig.widthMultiplier,bottom: 1.8*SizeConfig.widthMultiplier),
                    child: FormField<String>(
                      builder: (FormFieldState<String> state) {
                        return InputDecorator(
                          decoration: InputDecoration(
                            labelText: "Constitution",
                            errorStyle: TextStyle(color: Colors.redAccent, fontSize: 1.6*SizeConfig.textMultiplier),
                            hintText: 'Please select expense',),
                          isEmpty: _constitutions == '',
                          child: DropdownButtonHideUnderline(
                            child: DropdownButton<String>(
                              value: _constitutions,
                              isDense: true,
                              onChanged: (String newValue) {
                                setState(() {
                                  _constitutions = newValue;
                                  state.didChange(newValue);
                                });
                              },
                              items: _constitution.map((String value) {
                                return DropdownMenuItem<String>(
                                  value: value,
                                  child: Text(value,style: GoogleFonts.lato(fontSize: 1.6*SizeConfig.textMultiplier,)),
                                );
                              }).toList(),
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                  Padding(
                    padding:EdgeInsets.only(left:6.0*SizeConfig.widthMultiplier,right: 6.0*SizeConfig.widthMultiplier,top:1.8*SizeConfig.widthMultiplier,bottom: 1.8*SizeConfig.widthMultiplier),
                    child: new TextFormField(
                      validator: (String value) {
                        if (value.isEmpty) {
                          return 'Line of Activity is required';
                        } else {
                          return null;
                        }
                      },
                      keyboardType: TextInputType.text,
                      controller: _lineActicity,
                      // selectionColor:Color(0xffe4065f),
                      style: GoogleFonts.lato(fontSize: 1.6*SizeConfig.textMultiplier,),
                      decoration: const InputDecoration(
                        labelText: "Line of Activity",
                        labelStyle: TextStyle(color: Color(0xffe4065f)),
                        focusColor: Color(0xffe4065f),
                        hintText:
                        "Line of Activity",
                        hintStyle: TextStyle(fontSize: 13.0),
                        focusedBorder: UnderlineInputBorder(
                            borderSide: BorderSide(
                                color: Color(0xffe4065f))),
                      ),
                      //  style: Theme.of(context).textTheme.body1,
                    ),
                  ),
                  Padding(
                    padding:EdgeInsets.only(
                      left: 1.0*SizeConfig.widthMultiplier,
                      right: 1.0*SizeConfig.widthMultiplier,
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.end,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        FlatButton(
                          onPressed: () {
//x                        _postData();
                            if (!_formKey.currentState.validate()) {
                              //_formKey.currentState.save();
                              if (_constitutions == null || _districtSelectedValue == null) {
                                print("eroore");
                                Flushbar(
                                  message:  "please select required fields",
                                  duration:  Duration(seconds: 3),
                                )..show(context);
                              }  else {
                                // Every of the data in the form are valid at this point
                                _formKey.currentState.save();
                                print(_constitutions);
                              }
                            } else {
                              // submitOtp();
                              _postData();
                            }
                          },
                          child: Text(
                            "SAVE & NEXT",
                            style: GoogleFonts.lato(color: Colors.white),
                          ),
                          color: Color(0xffe4065f),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(8.0),
                            side: BorderSide(color: Color(0xffe4065f)),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
         //   SizedBox(height: 1000,),
          ],
        )
    );

here,when we add Sizedbox after form with fixedheight then it is scrolling but i dont need fixed height for scrollview im new to flutter please help

You can wrap your main widget with the SingleChildScrollView widget

I would suggest a simple widget hierarchy like

Scaffold
 - Container (For the red background)
  - Column
   - Container (with size for the lorem ipsom text.
    - Lorem Ipso Text.
   - Expanded (So that it will use the rest of the height automatically.)
    - Container (with white back ground and top rounded borders. Makes sure you add circular borders only to top and not to bottom of this container.
     - DefaultTabController
      - builder (to get different context of the default tab controller if more than one is used in your full app.)
       - Column
        - TabBar (if the number of categories is large use scrolling here as a property of the tab bar.) wrap in container if you need specific height of the tab bar.
        - Expanded
         - TabBarView to show the appropriate form.
          - SingleChildScrollView
           -Column
            -Your fields

your list view is wrapper in a container that is very long and has no scroll on it. So it wont scroll as the list fits within that long container. With list views you want a fixed height. It is the fixed height that is given for the visible parts of the list. Remove the wrapping container or reduce the height so all of it is visible on screen.

Also look at your use of the stack. You might have issues once you fix this with the list scrolling on top of the text "Firm Details" etc.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM