首页 > 解决方案 > 如何在 Flutter 应用中保存最近点击按钮的历史记录

问题描述

我目前有一个钢琴应用程序,可以在按下任何按钮时播放声音,这是 main.dart 中的代码片段:

class _MyAppState extends State<MyApp> {
  static AudioCache player = AudioCache();

  Widget myTone(Color myColor, int myNumber) {
    return Expanded(
      child: FlatButton(
          hoverColor: Colors.lightGreenAccent,
          color: myColor,
          onPressed: () {
            setState(() {
              player.play('note$myNumber.wav');
            });
          },
          child: null),
    );
  }

  @override
  Widget build(BuildContext context) {
    // Set landscape orientation
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.landscapeRight,
    ]);
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Piano Everywhere'),
        ),
        body: SafeArea(
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              myTone(Colors.black, 1),
              myTone(Colors.black54, 2),
              myTone(Colors.black45, 3),
              myTone(Colors.black38, 4),
              myTone(Colors.black26, 5),
              myTone(Colors.black12, 6),
              myTone(Colors.white12, 7)
            ],
          ),
        ),
      ),
    );

我想保存最近演奏的音符的历史记录。有没有办法做到这一点?

标签: flutterdart

解决方案


您可以创建一个数组来存储已按下的音色编号。我通常将提供程序用于全局变量,因此您可以在更改历史列表时显示更新的历史列表。

就我而言,我可能会保存在列表中。

List<Int> pressedToneList = [];

在您的 myTone 小部件的 onPressed 中,每次按下时将 myNumber 附加到列表中:

Widget myTone(Color myColor, int myNumber) {
return Expanded(
  child: FlatButton(
      hoverColor: Colors.lightGreenAccent,
      color: myColor,
      onPressed: () {
        pressedToneList.add(myNumber);
        setState(() {
          player.play('note$myNumber.wav');
        });
      },
      child: null),
);

}

如果您使用提供程序,您可以创建一个存储数组的类,如下所示:

class RecentClickedHistory extends ChangeNotifier {
    List<int> list;
    
    RecentClickedHistory();

    add(int myNumber) {
        list.add(myNumber);
        notifyListeners();
    }
}

使用RecentClickedHistory.add(myNumber) 而不是pressedToneList.add(myNumber); 如果您使用提供程序。

如果您想走这条路,请阅读有关 Listeners 的提供商文档,或者您可以在此处回复,我会尽力提供帮助。


推荐阅读