ijkplayer_flutter_sdk 1.0.12

A Video Player Flutter plugin based on ijkplayer, support most popular protocols and codecs

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'player_page.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown,
  ]);
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'FijkPlayer Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        useMaterial3: true,
      ),
      darkTheme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.blue,
          brightness: Brightness.dark,
        ),
        useMaterial3: true,
      ),
      home: const HomePage(),
    );
  }
}

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final TextEditingController _urlController = TextEditingController();

  // 示例视频列表
  final List<Map<String, String>> _sampleVideos = [
    {
      'name': 'Big Buck Bunny (MP4)',
      'url': 'https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4',
    },
    {
      'name': 'Sintel Trailer (MP4)',
      'url': 'https://media.w3.org/2010/05/sintel/trailer.mp4',
    },
    {
      'name': 'Elephants Dream (WebM)',
      'url': 'https://upload.wikimedia.org/wikipedia/commons/transcoded/8/87/Schlossbergbahn.webm/Schlossbergbahn.webm.480p.webm',
    },
    {
      'name': 'Test HLS Stream',
      'url': 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
    },
    {
      'name': 'Apple HLS Test',
      'url': 'https://devstreaming-cdn.apple.com/videos/streaming/examples/img_bipbop_adv_example_fmp4/master.m3u8',
    },
  ];

  @override
  void initState() {
    super.initState();
    _urlController.text = _sampleVideos.first['url']!;
  }

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

  void _playVideo(String url) {
    if (url.isEmpty) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('请输入视频地址')),
      );
      return;
    }
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => PlayerPage(url: url),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('FijkPlayer Demo'),
        centerTitle: true,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            // 自定义URL输入
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text(
                      '自定义视频地址',
                      style: TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    const SizedBox(height: 12),
                    TextField(
                      controller: _urlController,
                      decoration: InputDecoration(
                        hintText: '输入视频URL (http/https/rtmp/rtsp)',
                        border: const OutlineInputBorder(),
                        suffixIcon: IconButton(
                          icon: const Icon(Icons.clear),
                          onPressed: () => _urlController.clear(),
                        ),
                      ),
                      maxLines: 2,
                    ),
                    const SizedBox(height: 12),
                    SizedBox(
                      width: double.infinity,
                      child: ElevatedButton.icon(
                        onPressed: () => _playVideo(_urlController.text.trim()),
                        icon: const Icon(Icons.play_arrow),
                        label: const Text('播放'),
                        style: ElevatedButton.styleFrom(
                          padding: const EdgeInsets.symmetric(vertical: 12),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            const SizedBox(height: 24),

            // 示例视频列表
            const Text(
              '示例视频',
              style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 12),
            ..._sampleVideos.map((video) => Card(
              margin: const EdgeInsets.only(bottom: 8),
              child: ListTile(
                leading: const Icon(Icons.video_library),
                title: Text(video['name']!),
                subtitle: Text(
                  video['url']!,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    fontSize: 12,
                    color: Colors.grey[600],
                  ),
                ),
                trailing: const Icon(Icons.play_circle_outline),
                onTap: () => _playVideo(video['url']!),
              ),
            )),

            const SizedBox(height: 24),

            // 功能说明
            Card(
              color: Colors.blue[50],
              child: Padding(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        Icon(Icons.info_outline, color: Colors.blue[700]),
                        const SizedBox(width: 8),
                        Text(
                          '支持的功能',
                          style: TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.bold,
                            color: Colors.blue[700],
                          ),
                        ),
                      ],
                    ),
                    const SizedBox(height: 12),
                    const Wrap(
                      spacing: 8,
                      runSpacing: 8,
                      children: [
                        Chip(label: Text('播放/暂停')),
                        Chip(label: Text('进度拖动')),
                        Chip(label: Text('音量调节')),
                        Chip(label: Text('倍速播放')),
                        Chip(label: Text('全屏模式')),
                        Chip(label: Text('视频截图')),
                        Chip(label: Text('视频录制')),
                        Chip(label: Text('循环播放')),
                        Chip(label: Text('播放信息')),
                        Chip(label: Text('缓冲状态')),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}