Flutter Vimeo视频播放插件vimeo_player_jfv的使用

Flutter Vimeo视频播放插件vimeo_player_jfv的使用

Lib 用于通过其链接查看Vimeo上的视频，并且还可以从预定义的时间（以秒为单位）开始播放视频。

示例代码

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: VimeoPlayerUrl(
        url: 'https://player.vimeo.com/video/59777392?h=ab882a04fd&loop=1', // 视频的Vimeo链接
        progress: 10, // 初始进度（秒）
      ),
    );
  }
}

说明

  1. 导入必要的包：

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

  2. 创建主应用类 MyApp：

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

  3. 创建首页类 MyHomePage：

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

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

  4. 实现 _MyHomePageState 类：

    class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: VimeoPlayerUrl(
        url: 'https://player.vimeo.com/video/59777392?h=ab882a04fd&loop=1', // 视频的Vimeo链接
        progress: 10, // 初始进度（秒）
      ),
    );
  }
}

更多关于Flutter Vimeo视频播放插件vimeo_player_jfv的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter Vimeo视频播放插件vimeo_player_jfv的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中使用vimeo_player_jfv插件来播放Vimeo视频非常简单。以下是一个基本的步骤指南，帮助你快速上手。

1. 添加依赖

首先，你需要在pubspec.yaml文件中添加vimeo_player_jfv插件的依赖。

dependencies:
  flutter:
    sdk: flutter
  vimeo_player_jfv: ^1.0.0  # 请确保使用最新版本

然后运行flutter pub get来安装依赖。

2. 导入插件

在你的Dart文件中导入vimeo_player_jfv插件。

import 'package:vimeo_player_jfv/vimeo_player_jfv.dart';

3. 使用VimeoPlayer

你可以使用VimeoPlayer小部件来播放Vimeo视频。你需要提供Vimeo视频的ID。

class MyHomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Vimeo Player Example'),
      ),
      body: Center(
        child: VimeoPlayer(
          videoId: '59777392', // 替换为你的Vimeo视频ID
          autoPlay: true,
          looping: true,
        ),
      ),
    );
  }
}

4. 运行应用

现在你可以运行你的Flutter应用，并看到Vimeo视频在应用中播放。

5. 可选参数

VimeoPlayer小部件支持一些可选参数，你可以根据需要进行配置：

  • autoPlay: 是否自动播放视频，默认为false。
  • looping: 是否循环播放视频，默认为false。
  • aspectRatio: 视频的宽高比，默认为16/9。
  • allowFullScreen: 是否允许全屏播放，默认为true。

示例代码

以下是一个完整的示例代码：

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Vimeo Player Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Vimeo Player Example'),
      ),
      body: Center(
        child: VimeoPlayer(
          videoId: '59777392', // 替换为你的Vimeo视频ID
          autoPlay: true,
          looping: true,
        ),
      ),
    );
  }
}
回到顶部