在颤动的页面视图中向左向右滑动时添加声音答案

【问题标题】：Add sound while swiping left right in pageview in flutter在颤动的页面视图中向左向右滑动时添加声音
【发布时间】：2022-01-09 18:36:46
【问题描述】：

您好，如何在页面浏览中向左向右滑动时添加声音我将通过手势检测器添加，但问题是他们不会判断左右位置，如果我启用自定义页面浏览滚动则手势检测器不起作用所以如何做到这一点

【问题讨论】：

stackoverflow.com/questions/55050463/…

标签： flutter dart

【解决方案1】：

对于音频，我使用 audioplayers 插件使用本地音频（来自资产）。

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


class PageViewScreen extends StatefulWidget {
  @override
  _PageViewScreenState createState() => _PageViewScreenState();
}

class _PageViewScreenState extends State<PageViewScreen> {
  AudioCache _audioCache;

  final PageController _pageController = PageController(initialPage: 0);

  int staticIndex = 0;

  @override
  void initState() {
    super.initState();
    _audioCache = AudioCache(
      prefix: 'assets/audio/',
      fixedPlayer: AudioPlayer()..setReleaseMode(ReleaseMode.STOP),
    );
  }

  @override
  void dispose() {
    _pageController.dispose();
    _audioCache.fixedPlayer.stop();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
          physics: ClampingScrollPhysics(),
          controller: _pageController,
          onPageChanged: (int page) {
            if (staticIndex < page + 1) {
              _audioCache.fixedPlayer.stop();

              _audioCache.play('next.wav');
              print("RIGHT SWIPE DETECTED ");
              setState(() => staticIndex++);
            } else {
              _audioCache.fixedPlayer.stop();
              _audioCache.play('previous.wav');
              print("LEFT SWIPE DETECTED");
              setState(() => staticIndex--);
            }
          },
          children: <Widget>[
            ChildClasss(
              title: "PAGE 1",
            ),
            ChildClasss(
              title: "PAGE 2",
            ),
            ChildClasss(
              title: "PAGE 3",
            ),
            ChildClasss(
              title: "PAGE 4",
            ),
            ChildClasss(
              title: "PAGE 5",
            ),
          ]),
    );
  }
}

class ChildClasss extends StatelessWidget {
  final String title;

  const ChildClasss({Key key, this.title}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;

    return Container(alignment: Alignment.center, child: Text(title));
  }
}

【讨论】：