Flutter指南针功能插件flutter_compass_v2的使用

flutter_compass_v2 是一个用于Flutter应用中的指南针插件，可以获取设备的方向数据。以下是详细的使用指南和示例代码。

插件简介

该插件提供了设备的方向信息，范围从0到360度，其中0度表示北方向。注意：在Android上，如果没有传感器可用，则会返回null作为方向值。

使用步骤

添加依赖

首先，在你的 pubspec.yaml 文件中添加 flutter_compass_v2 依赖：

dependencies:
  flutter_compass_v2: '^1.0.0'

iOS配置

确保在 Info.plist 文件中添加以下键值对，并提供适当的描述：

<key>NSLocationWhenInUseUsageDescription</key>
<string>We need your location to show the compass direction.</string>
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>We need your location to show the compass direction.</string>

Android配置

确保在 app/src/main/AndroidManifest.xml 文件中添加以下权限：

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

推荐的支持插件

为了更方便地请求和检查权限，推荐使用 Flutter Permission handler Plugin。

示例代码

以下是一个完整的示例，展示了如何使用 flutter_compass_v2 插件来创建一个简单的指南针应用。

import 'dart:math' as math;

import 'package:flutter/material.dart';
import 'package:flutter_compass_v2/flutter_compass_v2.dart';
import 'package:permission_handler/permission_handler.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _hasPermissions = false;
  CompassEvent? _lastRead;
  DateTime? _lastReadAt;

  @override
  void initState() {
    super.initState();
    _fetchPermissionStatus();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(title: const Text('Flutter Compass')),
        body: Builder(builder: (context) {
          if (_hasPermissions) {
            return Column(children: <Widget>[
              _buildManualReader(),
              Expanded(child: _buildCompass()),
            ]);
          } else {
            return _buildPermissionSheet();
          }
        }),
      ),
    );
  }

  Widget _buildManualReader() {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Row(children: <Widget>[
        ElevatedButton(
          child: Text('Read Value'),
          onPressed: () async {
            final CompassEvent tmp = await FlutterCompass.events!.first;
            setState(() {
              _lastRead = tmp;
              _lastReadAt = DateTime.now();
            });
          },
        ),
        Expanded(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
              Text('$_lastRead', style: Theme.of(context).textTheme.bodySmall),
              Text('$_lastReadAt', style: Theme.of(context).textTheme.bodySmall),
            ]),
          ),
        ),
      ]),
    );
  }

  Widget _buildCompass() {
    return StreamBuilder<CompassEvent>(
      stream: FlutterCompass.events,
      builder: (context, snapshot) {
        if (snapshot.hasError) {
          return Text('Error reading heading: ${snapshot.error}');
        }

        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(child: CircularProgressIndicator());
        }

        double? direction = snapshot.data!.heading;

        // 如果方向为null，则设备不支持此传感器，显示错误消息
        if (direction == null)
          return Center(child: Text("Device does not have sensors !"));

        return Material(
          shape: CircleBorder(),
          clipBehavior: Clip.antiAlias,
          elevation: 4.0,
          child: Container(
            padding: EdgeInsets.all(16.0),
            alignment: Alignment.center,
            decoration: BoxDecoration(shape: BoxShape.circle),
            child: Transform.rotate(
              angle: (direction * (math.pi / 180) * -1),
              child: Image.asset('assets/compass.jpg'), // 替换为你的指南针图片路径
            ),
          ),
        );
      },
    );
  }

  Widget _buildPermissionSheet() {
    return Center(
      child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
        Text('Location Permission Required'),
        ElevatedButton(
          child: Text('Request Permissions'),
          onPressed: () {
            Permission.locationWhenInUse.request().then((ignored) {
              _fetchPermissionStatus();
            });
          },
        ),
        SizedBox(height: 16),
        ElevatedButton(
          child: Text('Open App Settings'),
          onPressed: () {
            openAppSettings().then((opened) {});
          },
        )
      ]),
    );
  }

  void _fetchPermissionStatus() {
    Permission.locationWhenInUse.status.then((status) {
      if (mounted) {
        setState(() => _hasPermissions = status == PermissionStatus.granted);
      }
    });
  }
}

在这个示例中，我们创建了一个基本的Flutter应用程序，它包含一个按钮来手动读取指南针的方向值，并且有一个实时更新的指南针视图。请确保替换 'assets/compass.jpg' 为你自己的指南针图片路径。