fis_lib_measure/lib/vid_player_test.dart

import 'package:fis_vid/data_host/data_host.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

import 'index.dart';
import 'view/main/desktop.dart';

class VidPlayerPage extends StatefulWidget {
  const VidPlayerPage(this.url, {Key? key}) : super(key: key);

  final String url;

  @override
  State<StatefulWidget> createState() => _VidPlayerPageState();
}

class _VidPlayerPageState extends State<VidPlayerPage> {
  late final _dataHost = Get.put(VidDataHost(widget.url));
  late final _playerController =
      Get.put(VidPlayerController(dataHost: _dataHost));

  @override
  Widget build(BuildContext context) {
    // _playerController.load().then((value) {
    //   _playerController.play();
    // });
    return FutureBuilder(
      future: _playerController.load(),
      builder: (_, snapshot) {
        if (snapshot.connectionState == ConnectionState.done) {
          if (_playerController.canPlay) {
            _playerController.play();
            return buildPage();
          } else {
            return const Material(child: Center(child: Text("Load fila")));
          }
        } else {
          return const Material(
              child: Center(child: CircularProgressIndicator()));
        }
      },
    );
  }

  Widget buildPage() {
    return Scaffold(
      // appBar: AppBar(),
      body: Row(
        children: [
          _LeftSider(),
          _Body(_playerController),
          _RightSider(),
        ],
      ),
    );
  }

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

class _Body extends StatelessWidget {
  const _Body(this.controller);

  final VidPlayerController controller;

  @override
  Widget build(BuildContext context) {
    const borderSide = BorderSide(color: Colors.grey);
    return Expanded(
      child: Container(
        decoration: const BoxDecoration(
          border: Border(left: borderSide, right: borderSide),
        ),
        child: Column(
          mainAxisSize: MainAxisSize.max,
          children: [
            const Expanded(
              // child: VidPlayer(controller),
              child: MeasureMainView(),
            ),
            SizedBox(
              height: 160,
              // color: Colors.black,
              child: controller.totalFramesCount > 1
                  ? VidPlayerControlBoard(
                      controller,
                    )
                  : Container(),
            ),
          ],
        ),
      ),
    );
  }
}

class _LeftSider extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 180 + 12 * 2,
      alignment: Alignment.topCenter,
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
      child: ListView.separated(
        itemCount: 20,
        itemBuilder: (_, index) {
          return Container(
            width: 180,
            height: 180,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              border: Border.all(
                color: Colors.grey,
              ),
            ),
            child: const Text("Placeholder"),
          );
        },
        separatorBuilder: (_, index) {
          return const SizedBox(height: 8);
        },
      ),
    );
  }
}

class _RightSider extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 320,
      // height: double.infinity,
      alignment: Alignment.topCenter,
      child: LayoutBuilder(
        builder: (context, constraints) {
          final height = constraints.biggest.height / 2;
          return Column(
            mainAxisSize: MainAxisSize.max,
            children: [
              Container(
                height: height,
                padding: const EdgeInsets.all(8),
                alignment: Alignment.topLeft,
                child: const Text('Measure Tools'),
              ),
              Container(
                height: height,
                padding: const EdgeInsets.all(8),
                decoration: const BoxDecoration(
                  border: Border(
                    top: BorderSide(color: Colors.grey),
                  ),
                ),
                alignment: Alignment.topLeft,
                child: const Text('Comment'),
              ),
            ],
          );
        },
      ),
    );
  }
}