flutter - 将 Choicechip 小部件与 Cupertino 应用程序一起使用

Question

我正在尝试在 Cupertino 应用程序中使用 ChoiceChip 小部件。

我找到了这个解决方案https://github.com/flutter/flutter/issues/21872#issuecomment-421508939在 GitHub 上

CupertinoApp(
  localizationsDelegates: const <LocalizationsDelegate<dynamic>>[
      DefaultMaterialLocalizations.delegate,
      DefaultWidgetsLocalizations.delegate,
  ],
  title: 'Flutter Demo',
  home: new MyHomePage(title: 'Flutter Demo Home Page'),
)

这是我的代码

return CupertinoApp(
  localizationsDelegates: const <LocalizationsDelegate<dynamic>>[
    DefaultWidgetsLocalizations.delegate,
  ],
  home: CupertinoStoreHomePage(),
);

  _buildChoiceList() {
    List<Widget> choices = List();
    widget.reportList.forEach((item) {
      choices.add(Container(
        child: ChoiceChip(
          label: Text(item),
          selected: selectedChoice == item,
          onSelected: (selected) {
            setState(() {
              selectedChoice = item;
              widget.onChoiceSelected(item);
            });
          },
        ),
      ));
    });
    return choices;
  }

我收到此错误

════════小组件库捕获异常═════════════════════════════ ═════ ═ 构建 ChoiceChip(dirty) 时抛出以下断言: 找不到 Material 小部件。

ChoiceChip 小部件需要 Material 小部件祖先。

Answer 1

您可以使用Material包裹Column
完整的工作代码和演示请参见下面

代码片段

@override
Widget build(BuildContext context) {
    return Material(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: _buildChoiceList(),
    ));
  }

完整代码

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      localizationsDelegates: const <LocalizationsDelegate<dynamic>>[
        DefaultMaterialLocalizations.delegate,
        DefaultWidgetsLocalizations.delegate,
      ],
      home: CupertinoStoreHomePage(
        reportList: ["a", "b"],
        onChoiceSelected: (item) {
          print(item);
        },
      ),
    );
  }
}

class CupertinoStoreHomePage extends StatefulWidget {
  List<String> reportList;
  Function(String) onChoiceSelected;

  CupertinoStoreHomePage({Key key, this.reportList, this.onChoiceSelected})
      : super(key: key);
  @override
  _CupertinoStoreHomePageState createState() => _CupertinoStoreHomePageState();
}

class _CupertinoStoreHomePageState extends State<CupertinoStoreHomePage> {
  String selectedChoice;

  @override
  Widget build(BuildContext context) {
    return Material(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: _buildChoiceList(),
    ));
  }

  _buildChoiceList() {
    List<Widget> choices = [];
    widget.reportList.forEach((item) {
      choices.add(Container(
        child: ChoiceChip(
          label: Text(item),
          selected: selectedChoice == item,
          onSelected: (selected) {
            setState(() {
              selectedChoice = item;
              widget.onChoiceSelected(item);
            });
          },
        ),
      ));
    });
    return choices;
  }
}

输出

I/flutter (10201): a
I/flutter (10201): b