Common problems with Flutter Widget (1)

One, foreword

Based on my study of flutter widgets, problems may increase when they are used together. To this end, I share some problems encountered during the use of flutter widgets here, hoping to help you.

TextField input box component

Problems:

In use, after clicking the TextField input box, the interface displays the prompt information with exceeding or yellow warning bar, etc.

(No renderings here)

Solution:

Wrap a layer of SingleChildScrollView in the outer layer of TextField, so that the input box can move up when the keyboard of input method is opened, that is, solve. The same situation can also be solved by this method.

Column and ListView components

Problems:

A blank page exception occurred when I tried to wrap the ListView component with the Column component.

Container( height: 300, color: Colors.blue, child: Column( children: <Widget>[ ListView.builder( padding: EdgeInsets. All (5.0), itemExtent: 50.0, itemBuilder: (BuildContext Context,int index){return Text("text $index"); },),],),Copy the code

Data display blank

Solution:

Wrap a layer of Expanded components around the ListView.

Ex. :

Container( height: 300, color: Colors.blue, child: Column( children: <Widget>[ Expanded( child: Listview. builder(padding: EdgeInsets. All (5.0), itemExtent: 50.0, itemBuilder: (BuildContext Context,int index){return Text("text $index"); },),],),),Copy the code

ListView component

Problems:

Vertical ListView level of nested ListView times wrong ‘constraints. HasBoundedHeight’ : is not true. ‘or don’t show.

Solution:

ListView => Container => Horizontal ListView

The Container component controls the width and height by wrapping a Container around the horizontal ListView and setting the width and height ratio

CupertinoPicker

Problems:

You want the CupertinoPicker component content item to have a control sliding effect.

Solution:

So, if you set an index in CupertinoPicker, you can select specific items according to the index. So, the controller controls sliding.

Specific use method:

. class _DemoPageState extends State<SuperMasterPage> { ScrollController _controller = new FixedExtentScrollController( initialItem: 1 ); . . Final picker = CupertinoPicker(// When defining control, use control scrollController: _controller, itemExtent: 40, backgroundColor: Colors.white, onSelectedItemChanged: (position){print('The position is $position');
          mDefaultPosition = position;
        },
        children: [
          Text("abc",style: TextStyle(fontSize: 20,color: Colors.black),),
          Text("123",style: TextStyle(fontSize: 20,color: Colors.black),),
          Text("cba",style: TextStyle(fontSize: 20,color: Colors.black),),
        ]
    );Copy the code