[flutter] 플러터 RxDart를 활용한 원격 제어 및 IoT 연동 기능 구현

05 Dec 2023

flutter

이번 글에서는 Flutter 앱에서 RxDart를 활용하여 원격 제어와 IoT 기기와의 연동 기능을 구현하는 방법에 대해 알아보겠습니다.

RxDart란?

RxDart는 Dart 언어를 위한 반응형 프로그래밍 라이브러리입니다. 이 라이브러리를 사용하면 Flutter 앱에서 쉽게 비동기 작업을 처리하고 상태 관리를 할 수 있습니다.

원격 제어 기능 구현하기

단계 1: RxDart 의존성 추가하기

먼저, 프로젝트의 pubspec.yaml 파일에 RxDart 의존성을 추가해야 합니다. 아래와 같이 dependencies 섹션에 RxDart를 추가합니다.

dependencies:
  rxdart: ^0.27.0

의존성을 추가한 후, 패키지를 업데이트해야 합니다. 터미널에서 다음 명령어를 실행하여 패키지를 업데이트합니다.

flutter pub get

단계 2: 상태 제어 클래스 생성하기

다음으로, 원격 제어를 위한 상태를 관리하는 클래스를 생성해야 합니다. 이 클래스는 RxDart의 BehaviorSubject를 사용하여 상태를 제어하고, 상태가 변경될 때마다 관련된 동작을 수행합니다.

import 'package:rxdart/rxdart.dart';

class RemoteControlBloc {
  final _isOn = BehaviorSubject<bool>();

  Stream<bool> get isOn => _isOn.stream;
  bool get currentStatus => _isOn.value;

  void turnOn() {
    _isOn.add(true);
    // IoT 기기에 전원을 켜는 명령을 전송하는 코드 작성
  }

  void turnOff() {
    _isOn.add(false);
    // IoT 기기에 전원을 끄는 명령을 전송하는 코드 작성
  }

  void dispose() {
    _isOn.close();
  }
}

위의 코드에서는 RemoteControlBloc라는 클래스를 생성하고, isOn이라는 BehaviorSubject를 사용하여 현재의 상태를 관리합니다. 또한, turnOn()과 turnOff() 메서드를 사용하여 상태를 변경하고, 필요한 동작을 수행합니다.

단계 3: UI와 연결하기

마지막으로, RemoteControlBloc 클래스를 UI와 연결하여 사용자가 제어할 수 있는 버튼을 만들고, 버튼을 누를 때마다 상태가 변경되도록 합니다.

import 'package:flutter/material.dart';

class RemoteControlPage extends StatefulWidget {
  @override
  _RemoteControlPageState createState() => _RemoteControlPageState();
}

class _RemoteControlPageState extends State<RemoteControlPage> {
  final _bloc = RemoteControlBloc();

  @override
  void dispose() {
    _bloc.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('원격 제어'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            StreamBuilder<bool>(
              stream: _bloc.isOn,
              initialData: _bloc.currentStatus,
              builder: (context, snapshot) {
                return Text(
                  snapshot.data ? 'ON' : 'OFF',
                  style: TextStyle(fontSize: 24),
                );
              },
            ),
            SizedBox(height: 20),
            RaisedButton(
              child: Text('ON'),
              onPressed: _bloc.turnOn,
            ),
            RaisedButton(
              child: Text('OFF'),
              onPressed: _bloc.turnOff,
            ),
          ],
        ),
      ),
    );
  }
}

위의 코드에서는 StreamBuilder 위젯을 사용하여 RemoteControlBloc 클래스의 isOn 스트림을 감지하여 상태에 따라 UI를 업데이트합니다. 또한, 두 개의 버튼을 추가하여 turnOn()과 turnOff() 메서드를 호출합니다.

결론

위에서 설명한 방법을 따라 Flutter 앱에서 RxDart를 활용하여 원격 제어 및 IoT 연동 기능을 구현할 수 있습니다. RxDart를 사용하면 비동기 작업을 보다 쉽게 처리하고, 상태 관리를 효율적으로 할 수 있으므로, 개발 시 유용하게 활용될 수 있습니다.

참고 자료: