Flutter and native iOS call albums

Purpose: To implement a Flutter function that calls native ios albums and delivers photos

The operation of the flutter

The module that flutter uses to pass is called channel, and we use MethodChannel here

// Register channel MethodChannel _methodChannel = MethodChannel("picture_page"); / / send a message _methodChannel. InvokeMapMethod (" picture "); / / receive messages _methodChannel. SetMethodCallHandler (async {(call) if (call) method = = "picture - the ios") {print (" ios call the arguments  --- " + call.arguments); }});Copy the code

The operation of the iOS

The module that iOS uses to pass is the FlutterMethodChannel

// Register the channel

methodChannel = FlutterMethodChannel(name: "picture_page", binaryMessenger: vc as! FlutterBinaryMessenger)

// Send a message

self?.methodChannel.invokeMethod("picture-ios", arguments: "img")

// Receive the message

methodChannel.setMethodCallHandler { (call, result) in
        if call.method = = "picture" {
            print("call method - ", call.method)
        }
    }

Copy the code

Call the album

After iOS14, apple recommended using the new PHPicker instead of UIImagePicker, and using PHPicker requires the first entry into the frame PhotosUI

PhotosUI contains

* PHPickerConfiguration
* PHPickerFilter
* PHPickerResult
* PHPickerViewController
* PHPickerViewControllerDelegate
Copy the code

PHPickerConfiguration configuration class

* selectionLimit: most can choose a few photos, is more than 0, the default is 1 * preferredAssetRepresentationMode: The default value is automatic, in which transcoding is performed automatically. * filter: PHPickerFilter, filter mode, you can specify filter for photos, videos, and livephotoCopy the code

PHPickerViewController selector

There's only one delegate method left!! When the user completes the selection, the method fires, and the result of the user's selection is passed in as an array of PhPickerResults, each of which corresponds to a photo, video, or LivePhoto dataCopy the code

PHPickerResult Photo information

* itemProvider: NSItemProvider, through the API of itemProvider, we can get the final result * assetIdentifier: Select the PHAsset ID of the object. If you want to access additional PHAsset information, you need to obtain the album permissionCopy the code

To get photos

    // Get the image
    itemProvider.loadObject(ofClass: UIImage.self) { (image, error) in
        // do someting with results
    }
	
	The API returns a temporary file path of URL type. Apple notes in the API that the system copies the requested file data to the corresponding address and deletes the temporary file after the callback is completed.
	itemProvider.loadFileRepresentation(forTypeIdentifier: UTType.image.identifier) { (url, error) in
	}

Copy the code

IOS14 PHPicker access to images of address is a temporary path, so use UIImagePickerViewController get under the TMP path of address will be more convenient for some. Or you can manually save the PHPicker image in the cache itself, which is simply a file store

public let ZPHFile = ZPHFileManager.share

open class ZPHFileManager {

    let fileManager: FileManager = FileManager(a)static let share = ZPHFileManager(a)func write(_ filePath: String = ""._ name: String._ data: Data)- > (Bool.String) {

        let DocumentsPath: String = "\(NSHomeDirectory())/Documents/"
        let path = "\(DocumentsPath)\(filePath)"
        let dataPath = "\(path)/\(name)"

        if !fileManager.fileExists(atPath: path) {
            do {
                try fileManager.createDirectory(atPath: path, withIntermediateDirectories: true, attributes: nil)}catch {
                print("Failed to create file directory")}}return (fileManager.createFile(atPath: dataPath, contents: data, attributes: nil), dataPath)
    }
}

Copy the code

Flutter gets photo information

Flutter updates the widget state setState() when it receives the image via a callback

image: DecorationImage(
                image: _imageFile == null
                    ? AssetImage("asset/images/me_head_empty.png")
                    : FileImage(File(_imageFile)))


Copy the code

This way you can display native images, of course there are a lot of good third party implementation is easier and easier, write questions welcome correction