Flutter TikTokStyleFullPageScroller()在空白(无内容)屏幕上不起作用

时间:2020-08-28 07:03:55

标签: flutter

我是Flutter的新手,正在尝试为视频添加幻灯片功能。它似乎按预期工作,但只有在通过点击内容区域滑动时才可以。换句话说,如果轻按视频以进行滑动,则不起作用。

包装:

tiktoklikescroller: ^0.1.1

import 'package:tiktoklikescroller/tiktoklikescroller.dart';

这是我的代码:

@override
Widget build(BuildContext context) {
  final List<Color> colors = <Color>[Colors.red, Colors.blue, Colors.yellow];
  return Expanded(
    child: TikTokStyleFullPageScroller(
      contentSize: colors.length,
      swipeThreshold: 0.2,
      swipeVelocityThreshold: 2000,
      animationDuration: const Duration(milliseconds: 300),
      builder: (BuildContext context, int index) {
        return Row(
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            VideoDescription(),
            ActionToolbar(),
          ],
        );
      },
    ),
  );
}

视频说明

class VideoDescription extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: Align(
        alignment: Alignment.bottomLeft,
        child: Container(
          height: 70.0,
          padding: EdgeInsets.only(left: 20.0),
          margin: EdgeInsets.only(bottom: 160.0),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text('Title', style: TextStyle(fontWeight: FontWeight.bold),),
            ],
          ),
        ),
      ),
    );
  }
}

操作工具栏

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 100.0,
      margin: EdgeInsets.only(bottom: 25.0),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          _getMusicPlayerAction(),
        ],
      ),
    );
  }

请帮助。

1 个答案:

答案 0 :(得分:0)

我将VideoDescription()和ActionToolbar()包装在一个容器中,并给它提供了透明的颜色。

@override
Widget build(BuildContext context) {
  final List<Color> colors = <Color>[Colors.red, 
Colors.blue, Colors.yellow];
  return Expanded(
child: TikTokStyleFullPageScroller(
  contentSize: colors.length,
  swipeThreshold: 0.2,
  swipeVelocityThreshold: 2000,
  animationDuration: const Duration(milliseconds: 300),
  builder: (BuildContext context, int index) {
    return Container(
                color: Colors.transparent,
                Row(
      mainAxisSize: MainAxisSize.max,
      children: <Widget>[
        VideoDescription(),
        ActionToolbar(),
      ],
     ),
    );
  },
    ),
  );
}