Flutter Beginner

(Updated: )

Flutter Packages

Execute the command below to create a new flutter package:

1
flutter create --template=package package_name

The standard flutter package files structure:

  • package_name

    • lib
      • src
        • feature1.dart
        • feature2.dart
      • package_name.dart

  • src: Private code directory

  • package.dart: // Main file, the file name must equals to the package name

  • Don’t write any useful code in the package_name.dart, this file is just used to import the files you want to expose in src.

The standard content of the file package_name.dart:

1
2
3
4
library package_name;

export '../src/feature1.dart';
export '../src/feature2.dart';

Flutter Plugin

Execute the command below to create a new flutter plugin:

1
flutter create --org com.example --template=plugin --platforms=android,ios -i swift plugin_name
  • --org: Your organization host.
  • --platforms: The platforms this plugin supported.
  • --i Specify ios development language oc/swift)

How to edit the plugin in Xcode?

  1. Open the plugin directory. You can find a Runner.xcworkspace file, open it.
  2. The plugin code is in the path Pods/Development Pods/plugin_name/.../ios/Classes
  3. If you want to test the plugin code, you have two ways. First, you can directly write test code in the Runner target. Another better way is creating a Unit Test target.
  4. There are some problems you will get. You cannot import plugin_name to test its code.
  5. I have a solution is appending pods dependence for the unit test target:
1
2
3
4
5
6
target 'pluginName_exampleTests' do
  use_frameworks!
  use_modular_headers!

  flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
end
  1. Test code examples:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import XCTest
import myecho


class myecho_exampleTests: XCTestCase {
    
    var plugin: SwiftMyechoPlugin?
        

    override func setUpWithError() throws {
        plugin = SwiftMyechoPlugin()
        // Put setup code here. This method is called before the invocation of each test method in the class.
    }

    func testEcho() throws {
        let echoExpectation = expectation(description: "method channel echo")
        let call = FlutterMethodCall(methodName: "echo", arguments: "SSBun")
        plugin!.handle(call) { result in
            if let level = result as? String {
                XCTAssert(level == "SSBun");
                echoExpectation.fulfill()
            } else {
                XCTAssert(false)
            }
        }
        wait(for: [echoExpectation], timeout: 4)
    }
}

Communicating between Flutter and Native

  • Method Channel
    • You can send an action from flutter to native or reversing, and then you can asynchronously get a result from the other side.
  • Event Channel
    • Can only send a message from native to flutter
    • Like an event stream, you can register the event channel in flutter to handle events. The native side will get a sink used to send an event to the flutter side. Unlike method channel that can only receive one event, the receiver using event channel can receive multiple events until canceling the subscription.