Required stock of DART knowledge

Create a FLUTTER project (the flutter environment is installed by default)

// Create a flutter project, flutter create app_name // Create a flutter module using the module as part of the native flutter development Module_name // Create a flutter package, package can be easily shared modular code eg: utility classes can be used in different projects, flutter create -t package package_nameCopy the code

Once created, open the created project and run it

The first thing you need to do is connect a device, either a real machine or an emulator,

  • How to open vscode

Install xcode open -a Simulator // Run the flutter run to open the ios emulatorCopy the code
  • Android Studio selects the emulator and runs the project

This is when you can see the project in action

Project directory structure

Beginners need only care about the lib folder and the configuration file pubspec.yaml

Common problems && Common operations

Waiting for another flutter command to release the startup lock.. The flutter process is locked and needs to wait. Killall -9 dart //flutter pub get Obtain dependencies // Flutter doctor Check whether the flutter environment is normal //flutter --version Obtain the version number, flutter 1.22.1 • The channel stable, https://github.com/flutter/flutter.git Framework, revision f30b7f4db9 (3 weekes line), 2020-10-08 Dart 2.10.1 // Get channel master dev beta * stable Change the flutter to the specified version. // Change the flutter to V1.12.13 +hotfix.9Copy the code

Flutter reference plugin

Add to this list the following dependencies: //github.com/xxx.git xxxname: git: url: Git ://github.com/xxx.git # If your package is not in the root directory of your git repository, you can also specify its path xxxname: git: url: git://github.com/xxx.git path: packages/urlCopy the code

The flutter communicates with the primary

  • MethodChannel // The Flutter calls the native method for method abandonment
  • BasicMessageChannel // The Flutter sends messages to each other with the native for data transfer
  • EventChannel natively sends messages that are received by Flutter for data flow messages

MethodChannel (calling methods to each other)

// First we need to define the channel that we want to call in our Dart code. Testflutter must be consistent with the native definition. Static const MethodChannel = const MethodChannel('testflutter'); // We call the Android method through the channel connection by calling the native showToast method 2, Future<Null> _getBatteryLevel() async {String batteryLevel; try { final int result = await methodChannel.invokeMethod('getBatteryLevel'); batteryLevel = 'Battery level $result .'; } on PlatformException catch (e) { batteryLevel = 'Battery level unknown ${e.message}'; } setState(() { _batteryLevel = batteryLevel; }); Static const MethodChannel = const MethodChannel('testflutter'); / / 2 add processing method to MethodChannel MethodChannel. SetMethodCallHandler (_addNativeMethod); //3 Methods for handling native calls, Future<dynamic> _addNativeMethod(MethodCall MethodCall) async {switch (methodCall.method) {case 'flutterMethod':  setState(() { _calledFromNative = 'flutter method called from native with param ' + methodCall.arguments; }); return 'flutter method called from native with param ' + methodCall.arguments; break; }}Copy the code

EventChannel

// In Flutter we need to register the listener for broadcast events and process incoming events eventChannel = const EventChannel('com.flyou.test/netChanged'); @override void initState() {super.initstate (); eventChannel.receiveBroadcastStream().listen(_onEvent, onError: _onError); } void _onEvent(Object event) { setState(() { netChangeStr = event; }); } void _onError(Object error) {setState(() {netChangeStr = "network state failed to obtain "; }); }Copy the code

BasicMessageChannel

// Send messages to a Flutter. BasicMessageChannel static const BasicMessageChannel = BasicMessageChannel('messageChannel', StandardMessageCodec()); / / 2 add receive information processing method void _listenMessageFromNative () {basicMessageChannel. SetMessageHandler (_receiveMessageFromNative); Future<dynamic> _receiveMessageFromNative(Object result) async {setState(() { _messageFromNative = result.toString(); }); } // a message is sent to the parent of a Flutter: BasicMessageChannel static const BasicMessageChannel = BasicMessageChannel('messageChannel', StandardMessageCodec()); // 2 Send message to native and receive return data Future<dynamic> _sendMessageToNative(String message) async {String reply = await basicMessageChannel.send(message); print(reply); setState(() { _replayFromNative = reply; }); return reply; }Copy the code