Flutter远程桌面控制插件flutter_rfb的使用

Flutter远程桌面控制插件flutter_rfb的使用

动机

我们一直在寻找一个用于Flutter的VNC查看器包，但未能找到。随后，有一场讨论涉及协议的复杂性，以及是否应该自己实现它。估计的时间从5天到100天不等，我们开玩笑说在周末后我会完成它。于是，经过一个周末的努力，我们有了第一个最小的VNC查看器实现。

支持的功能

有关当前支持的协议功能列表，请参阅dart_rfb包。

安装

安装方法非常简单，只需要运行以下命令：

dart pub add flutter_rfb

或者手动添加到pubspec.yaml文件中：

dependencies:
  flutter_rfb: ^<最新版本>

使用

以下是一个基本的使用示例：

import 'package:flutter/material.dart';
import 'package:flutter_rfb/flutter_rfb.dart';

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(final BuildContext context) => MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: const Text('Flutter RFB Example'),
          ),
          body: Center(
            child: InteractiveViewer(
              constrained: true,
              maxScale: 10,
              child: RemoteFrameBufferWidget(
                hostName: '127.0.0.1', // 远程服务器IP地址
                onError: (final Object error) {
                  ScaffoldMessenger.of(context).showSnackBar(
                    SnackBar(
                      content: Text('Error: $error'),
                    ),
                  );
                },
                password: 'password', // 远程服务器密码
              ),
            ),
          ),
        ),
      );
}

示例代码

以下是从GitHub获取的完整示例代码：

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rfb/flutter_rfb.dart';
import 'package:logging/logging.dart';

void main() {
  Logger.root
    ..level = Level.FINE
    ..onRecord.listen(
      (final LogRecord logRecord) {
        if (kDebugMode) {
          print(
            '${logRecord.level} ${logRecord.loggerName}: ${logRecord.message}',
          );
        }
      },
    );
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _connected = false;

  [@override](/user/override)
  Widget build(final BuildContext context) => MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: const Text('Flutter RFB Example'),
          ),
          body: SizedBox(
            width: double.infinity,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      _connected = !_connected;
                    });
                  },
                  child: Text(_connected ? 'Disconnect' : 'Connect'),
                ),
                ..._connected
                    ? [
                        Expanded(
                          child: Center(
                            child: InteractiveViewer(
                              constrained: true,
                              maxScale: 10,
                              child: Builder(
                                builder: (final BuildContext context) =>
                                    RemoteFrameBufferWidget(
                                  hostName: '127.0.0.1', // 远程服务器IP地址
                                  onError: (final Object error) {
                                    ScaffoldMessenger.of(context).showSnackBar(
                                      SnackBar(
                                        content: Text('Error: $error'),
                                      ),
                                    );
                                    setState(() {
                                      _connected = false;
                                    });
                                  },
                                  password: 'password', // 远程服务器密码
                                ),
                              ),
                            ),
                          ),
                        ),
                      ]
                    : [],
              ],
            ),
          ),
        ),
      );
}