웹개발일지

플러터 네이티브 플랫폼 연동 본문

플러터/네이티브연동

플러터 네이티브 플랫폼 연동

hee_log 2023. 3. 5. 19:13
728x90


 플러터 네이티브 연동 방법을 배웠다. android 와 ios 플랫폼 각각의 코드를 작성해주어야 한다. 메소드 채널을 통해서 통신하기 때문에 같은 채널명의 변수를 플러터와 각 플랫폼에 동일하게 적어주어야 한다. 

 

 

 

class HomePage extends StatefulWidget {
  static const platform = const MethodChannel('example.com/value');

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  String _value = 'null';

  Future<void> _getNativeValue() async {
    String value;
    try {
      value = await HomePage.platform.invokeMethod('getValue');
    } on PlatformException catch(e) {
       value = '네이티브 코드 실행 에러 : ${e.message}';
    }


    setState((){
      _value = value;
    });

  }

 

MethodChannel('채널명') 

 플러터와 각 네이티브 플랫폼(안드로이드, IOS)은 메서드 채널을 통해 값을 주고받는다. 메소드채널은 플러터에서 네이티브 코드를 실행할 수 있도록 도와준다. 플러터에서와 각 플랫폼에서 채널명을 동일하게 지정해주어야 통신 가능하다. 채널명을 'example.com/value'로 지정했다. 

 

 _getNativeValue() ; 비동기 메서드 구현 

 비동기로 Future - async 선언을 해주었다. value 값이 비동기로 받아올 future 값이기 때문에 await 로 플랫폼 메서드를 실행시킨다. invokeMethod()를 통해 네이티브 값을 받아온다. 이런경우 보통 예외처리를 같이 구현하여 네이티브 코드 실행 에러시 에러 메시지가 출력되도록 한다. 

 상태값 변화는 setState()를 통해 구현한다. 네이티브에서 받아온 value 값을 위에서 정의한 _value 값에 저장해준다.