Today I am sharing 20 major issues with high visits on *. These issues give me a particularly familiar feeling. I think you must have encountered them more or less. Some problems have hundreds of thousands of views on *, which means that many people have encountered these problems. They will organize and share these problems with everyone, with 20 each issue and share them every 2 weeks.
How to implement wrap_content and match_parent of Android platform
You can do it as follows:
1、Width = Wrap_content Height=Wrap_content：
Wrap( children: <Widget>[your_child])
2、Width = Match_parent Height=Match_parent：
Container( height: , width: ,child:your_child)
3、Width = Match_parent ,Height = Wrap_conten：
Row( mainAxisSize: , children: <Widget>[*your_child*], );
4、Width = Wrap_content ,Height = Match_parent：
Column( mainAxisSize: , children: <Widget>[your_child], );
How to avoid frequent execution of FutureBuilderfuturemethod
Error usage:
@override
Widget build(BuildContext context) {
return FutureBuilder(
future: httpCall(),
builder: (context, snapshot) {
},
);
}
Correct usage:
class _ExampleState extends State<Example> {
Future<int> future;
@override
void initState() {
future = (42);
();
}
@override
Widget build(BuildContext context) {
return FutureBuilder(
future: future,
builder: (context, snapshot) {
},
);
}
}
Bottom navigation switching causes reconstruction issues
When using the bottom navigation, the following writing method is often used:
Widget _currentBody;
@override
Widget build(BuildContext context) {
return Scaffold(
body: _currentBody,
bottomNavigationBar: BottomNavigationBar(
items: <BottomNavigationBarItem>[
...
],
onTap: (index) {
_bottomNavigationChange(index);
},
),
);
}
_bottomNavigationChange(int index) {
switch (index) {
case 0:
_currentBody = OnePage();
break;
case 1:
_currentBody = TwoPage();
break;
case 2:
_currentBody = ThreePage();
break;
}
setState(() {});
}
This usage causes the page to be rebuilt every time you switch.
Solution, useIndexedStack：
int _currIndex;
@override
Widget build(BuildContext context) {
return Scaffold(
body: IndexedStack(
index: _currIndex,
children: <Widget>[OnePage(), TwoPage(), ThreePage()],
),
bottomNavigationBar: BottomNavigationBar(
items: <BottomNavigationBarItem>[
...
],
onTap: (index) {
_bottomNavigationChange(index);
},
),
);
}
_bottomNavigationChange(int index) {
setState(() {
_currIndex = index;
});
}
TabBar switch causes reconstruction (build) issues
Normally, use TabBarView as follows:
TabBarView( controller: this._tabController, children: <Widget>[ _buildTabView1(), _buildTabView2(), ], )
When switching tabs, the page will be rebuilt. Solution settingsPageStorageKey：
var _newsKey = PageStorageKey('news');
var _technologyKey = PageStorageKey('technology');
TabBarView(
controller: this._tabController,
children: <Widget>[
_buildTabView1(_newsKey),
_buildTabView2(_technologyKey),
],
)
Stack child component set width and height does not work
Set the 100x100 red box in Stack, as follows:
Center( child: Container( height: 300, width: 300, color: , child: Stack( children: <Widget>[ ( child: Container( height: 100, width: 100, color: , ), ) ], ), ), )
At this time, the red box is filled with parent components. The solution is to wrap the red box components Center, Align or UnconstrainedBox. The code is as follows:
( child: Align( child: Container( height: 100, width: 100, color: , ), ), )
How to get the properties of a StatefulWidget control in a State class
class Test extends StatefulWidget {
Test({});
final int data;
@override
State<StatefulWidget> createState() => _TestState();
}
class _TestState extends State<Test>{
}
As follows, how to get the Test'sdataWhat about the data:
- The same parameters are also defined in _TestState. This method is more troublesome and is not recommended.
- Use directly
(recommend).
default value of optional parameter must be constant
The above exceptions are often encountered when class constructors, such as the following code:
class BarrageItem extends StatefulWidget {
BarrageItem(
{ ,
= Duration(seconds: 3)});
Exception information prompts: The optional parameters must be constants, modified as follows:
const Duration _kDuration = Duration(seconds: 3);
class BarrageItem extends StatefulWidget {
BarrageItem(
{,
= _kDuration});
Define a constant,DartMedium constants are usually usedkbeginning,_It means private, and can only be used in the current package. Don't ask me why I'm named so, but I'm named in the source code.
How to remove the "DEBUG" logo in the upper right corner in debug mode
MaterialApp( debugShowCheckedModeBanner: false )
How to use hexadecimal color values
The following usage cannot display the color:
Color(0xb74093)
Because the constructor of Color isARGB, so transparency needs to be added, the correct usage:
Color(0xFFb74093)
FFIndicates total opaqueness.
How to change the icon and name of an application
Link:/mengks1987/article/details/95306508
How to set initial value for TextField
class _FooState extends State<Foo> {
TextEditingController _controller;
@override
void initState() {
();
_controller = new TextEditingController(text: 'Initial Value');
}
@override
Widget build(BuildContext context) {
return TextField(
controller: _controller,
);
}
}
() called with a context that does not contain a Scaffold
The context in () is not included in Scaffold, and the following code will report this exception:
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Old Meng'),
),
body: Center(
child: RaisedButton(
color: ,
textColor: ,
onPressed: _displaySnackBar(context),
child: Text('show SnackBar'),
),
),
);
}
}
_displaySnackBar(BuildContext context) {
final snackBar = SnackBar(content: Text('Old Meng'));
(context).showSnackBar(snackBar);
}
Note that the context at this time is HomePage, and HomePage is not included in Scaffold, so it is not enough to call it in Scaffold, but look at the context and modify it as follows:
_scaffoldKey.(snackbar);
or:
Scaffold(
appBar: AppBar(
title: Text('Old Meng'),
),
body: Builder(
builder: (context) =>
Center(
child: RaisedButton(
color: ,
textColor: ,
onPressed: () => _displaySnackBar(context),
child: Text('Old Meng'),
),
),
),
);
Waiting for another flutter command to release the startup lock
ExecutionflutterThe above problems are often encountered during commands.
Solution 1:
1. Execute the following commands on the terminal for Mac or Linux:
killall -9 dart
2. Window executes the following command:
taskkill /F /IM
Solution 2:
Delete the flutter SDK directory/bin/cache/lockfiledocument.
Unable to callsetState
It cannot be called in the StatelessWidget control, it needs to be called in the StatefulWidget.
Set the current control size to the percentage of the parent control size
1. UseFractionallySizedBoxControls
2. Get the size of the parent control and multiply by percentage:
(context). * 0.5
Row directly wraps TextField exception: BoxConstraints forces an infinite width
Solution:
Row( children: <Widget>[ Flexible( child: new TextField(), ), ], ),
TextField Dynamically Get Focus and Lost Focus
Get focus:
(context).requestFocus(_focusNode);
_focusNodeFocusNode for TextField:
_focusNode = FocusNode(); TextField( focusNode: _focusNode, ... )
Lost focus:
_focusNode.unfocus();
How to judge the current platform
import 'dart:io' show Platform;
if () {
// Android-specific code
} else if () {
// iOS-specific code
}
Platform types include:
Android cannot access http
In fact, this is not a Flutter problem, but it is often encountered during development. Access to http is prohibited by default on Android Pie version and above and IOS systems, mainly for security considerations.
Android solution:
exist./android/app/src/main/Set the networkSecurityConfig property in the application tag in the configuration file:
<?xml version="1.0" encoding="utf-8"?> <manifest ... > <application android:networkSecurityConfig="@xml/network_security_config"> <!-- ... --> </application> </manifest>
exist./android/app/src/main/resCreate an xml folder in the directory (it does not need to be created if it already exists), and create a network_security_config.xml file under the xml folder, with the content as follows:
<?xml version="1.0" encoding="utf-8"?> <network-security-config> <base-config cleartextTrafficPermitted="true"> <trust-anchors> <certificates src="system" /> </trust-anchors> </base-config> </network-security-config>
IOS cannot access http
exist./ios/Runner/Add the following to the file:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "/DTDs/PropertyList-1."> <plist version="1.0"> <dict> ... <key>NSAppTransportSecurity</key> <dict> <key>NSAllowsArbitraryLoads</key> <true/> </dict> </dict> </plist>
comminicate
Github address:/781238222/flutter-do
Detailed usage of 170+ components:
Summarize
This is the end of this article about 20 major issues with * Flutter over one million. For more related * Flutter content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!