Flutter全景图查看插件panorama_viewer_plus的使用

一个360度全景图查看器。 支持平台：Android, iOS, 平板, Web支持（移动/桌面）。

此插件是 https://github.com/dariocavada/panorama_viewer 的更新移植版。

截图

开始使用

在你的 pubspec.yaml 文件中添加全景图作为依赖项。

dependencies:
  panorama_viewer_plus: ^0.1.0

导入并添加全景图查看器小部件到你的项目中。

import 'package:panorama_viewer_plus/panorama_viewer_plus.dart';
... ...

[@override](/user/override)
Widget build(BuildContext context) {
  var deviceSize = MediaQuery.of(context).size;
  return Scaffold(
    appBar: AppBar(title: const Text("自定义全景图查看器")),
    body: Center(
      child: CustomPanoramaViewer(
        imagePath: 'https://raw.githubusercontent.com/ShreyaAmbaliya/panorama_viewer_plus/main/example/assets/test.jpg',
        width: deviceSize.width,
        height: 220,
      ),
    ),
  );
}

设置 isAssetImage 为 true 查看资源图像

import 'package:panorama_viewer_plus/panorama_viewer_plus.dart';
... ...

[@override](/user/override)
Widget build(BuildContext context) {
  var deviceSize = MediaQuery.of(context).size;
  return Scaffold(
    appBar: AppBar(title: const Text("自定义全景图查看器")),
    body: Center(
      child: CustomPanoramaViewer(
        imagePath:'assets/test.jpg',
        isAssetImage:true,
        width: deviceSize.width,
        height: 220,
      ),
    ),
  );
}

支持 ❤️

在 github.com 上给项目点赞。

在 pub.dev 上喜欢它。

### 示例代码

```dart
import 'package:flutter/material.dart';
import 'package:panorama_viewer_plus/panorama_viewer_plus.dart';

void main() {
  runApp(const MyApp());
}

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

  // 这个小部件是你的应用的根。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter 自定义全景图组件',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter 示例主页'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    var deviceSize = MediaQuery.of(context).size;
    return Scaffold(
      body: Center(
        child: CustomPanoramaViewer(
          imagePath: 'https://raw.githubusercontent.com/ShreyaAmbaliya/panorama_viewer_plus/main/example/assets/test.jpg',
          width: deviceSize.width,
          height: deviceSize.height,
        ),
      ),
    );
  }
}