Rutube Video Flutter

A Flutter package for playing Rutube videos with cross-platform support

Supported Video Sources

  • ✅ Rutube videos (rutube.ru/video/...)
  • ✅ Private Rutube videos (with password parameter)

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  rutube: ^1.0.0

Usage

Basic Usage

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

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Rutube(
      videoUrl: 'https://rutube.ru/video/d49fe24dfbab2b3af045f0d34f74136c/',
    );
  }
}

Private Video

Rutube(
  videoUrl: 'https://rutube.ru/video/private/9f3b03ad4c67afc07b044731f2734581/?p=WQQk2hlxRC-h90-Wd4ZFRA',
)

Platform-Specific Configuration

Configure web and mobile platforms separately using RutubeWebConfig and RutubeMobileConfig:

import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:rutube/rutube.dart';
import 'package:rutube/config.dart';

Rutube(
  videoUrl: 'https://rutube.ru/video/d49fe24dfbab2b3af045f0d34f74136c/',
  webConfig: RutubeWebConfig(
    hitTestBehavior: PlatformViewHitTestBehavior.opaque,
  ),
  mobileConfig: RutubeMobileConfig(
    showConsoleMessages: true,
    onConsoleMessage: (controller, message) {
      debugPrint('WebView Console: ${message.message}');
    },
    onLoadStop: (controller, url) async {
      debugPrint('Page loaded: $url');
    },
    initialSettings: InAppWebViewSettings(
      javaScriptEnabled: true,
      mediaPlaybackRequiresUserGesture: false,
      allowsInlineMediaPlayback: true,
    ),
  ),
)

Mobile: Custom WebView Callbacks

On mobile platforms, you can customize WebView behavior with callbacks:

import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:rutube/rutube.dart';
import 'package:rutube/config.dart';

Rutube(
  videoUrl: 'https://rutube.ru/video/d49fe24dfbab2b3af045f0d34f74136c/',
  mobileConfig: RutubeMobileConfig(
    onConsoleMessage: (controller, message) {
      debugPrint('WebView Console: ${message.message}');
    },
    onLoadStop: (controller, url) async {
      debugPrint('Page loaded: $url');
      // Add custom JavaScript or handle page load events
    },
  ),
)

Mobile: Custom WebView Settings

import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:rutube/rutube.dart';
import 'package:rutube/config.dart';

Rutube(
  videoUrl: 'https://rutube.ru/video/d49fe24dfbab2b3af045f0d34f74136c/',
  mobileConfig: RutubeMobileConfig(
    initialSettings: InAppWebViewSettings(
      javaScriptEnabled: true,
      mediaPlaybackRequiresUserGesture: false,
      allowsInlineMediaPlayback: true,
      // Add more custom settings
    ),
  ),
)

Web: Custom Platform View Settings

import 'package:flutter/rendering.dart';
import 'package:rutube/rutube.dart';
import 'package:rutube/config.dart';

Rutube(
  videoUrl: 'https://rutube.ru/video/d49fe24dfbab2b3af045f0d34f74136c/',
  webConfig: RutubeWebConfig(
    hitTestBehavior: PlatformViewHitTestBehavior.opaque,
    creationParams: customParams,
  ),
)

Platform Support

  • Web: Uses HTML5 iframe for video playback
  • Mobile (iOS/Android): Uses InAppWebView for embedded player
  • WASM: Experimental support included

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Issues

If you encounter any issues, please report them on the GitHub repository.

Libraries

config
rutube