Flutter国家旗帜展示插件country_flags_flutter的使用

国家旗帜展示插件country_flags_flutter

项目概述

(Fork from flag as it was not maintained anymore)

这是一个用于Android / iOS / Web的国家旗帜Flutter插件。基于flutter_svg。

截图

SVG源文件

所有旗帜来自https://github.com/lipis/flag-icons/releases/tag/v4.1.4

感谢伟大的项目flag-icons。

旗帜列表

ISO 3166-1-alpha-2 Flags

注意：

组织：

• eu 欧洲联盟。

争议领土：

• hk 香港。中国特别行政区。
• mo 澳门。中国特别行政区。
• eh 西撒哈拉。摩洛哥声称拥有主权。
• tw 台湾。中国声称拥有主权。

未争议的非联合国成员国领土：

• va 梵蒂冈城。由圣座管理。

如何使用

Flag.fromCode(FlagsCode.COUNTRY_CODE, height: HEIGHT, width: WIDTH),
Flag.fromString(COUNTRY_CODE, height: HEIGHT, width: WIDTH),
Flags.fromCode([FlagsCode.GB, FlagsCode.US], height: 100, width: 100 * 4 / 3),

例如：

Flag.fromCode(FlagsCode.AD, height: 100, width: null)
Flag.fromString('AD', height: null, width: null)
Flag.fromString('AD', height: 10, width: 100, fit: BoxFit.fill)

完整示例代码

以下是一个完整的示例代码，展示了如何在Flutter应用中使用country_flags_flutter插件来展示国家旗帜。

import 'package:example/restart_widget.dart';
import 'package:country_flags_flutter/flag.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() => runApp(RestartWidget(child: MyApp()));

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool? displayFlagPicker;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SafeArea(
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              Flag.fromCode(
                FlagsCode.KI,
                height: 100,
              ),
              Flag.fromCode(
                FlagsCode.AD,
                height: 10,
                width: 100,
                fit: BoxFit.fill,
              ),
              Flag.fromCode(
                FlagsCode.AD,
                height: 50,
                width: 50,
                fit: BoxFit.fill,
                flagSize: FlagSize.size_1x1,
                borderRadius: 25,
              ),
              Flags.fromCode(
                [
                  FlagsCode.GB,
                  FlagsCode.US,
                ],
                height: 100,
                width: 100 * 4 / 3,
              ),
              Flag.fromString(
                'ACC',
                height: 10,
                width: 100,
                fit: BoxFit.fill,
                replacement: Text('ACC not found'),
              ),
              if (Flag.flagsCode.contains('AF'.toLowerCase()))
                Flag.fromString(
                  'af',
                  height: 10,
                  width: 100,
                  fit: BoxFit.fill,
                ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  ElevatedButton(
                    onPressed: displayFlagPicker == null
                        ? () => setState(() {
                              displayFlagPicker = false;
                            })
                        : null,
                    child: Text('no preCache'),
                  ),
                  ElevatedButton(
                    onPressed: displayFlagPicker == null
                        ? () => setState(() {
                              displayFlagPicker = true;
                            })
                        : null,
                    child: Text('preCache'),
                  ),
                  ElevatedButton(
                    onPressed: () => RestartWidget.restartApp(context),
                    child: Text('restart'),
                  ),
                ],
              ),
              if (displayFlagPicker != null)
                FlagPicker(
                  width: 50,
                  height: 300,
                  preCache: displayFlagPicker!,
                ),
            ],
          ),
        ),
      ),
    );
  }
}

class FlagPicker extends StatefulWidget {
  const FlagPicker({Key? key, this.width, this.height, this.preCache = false})
      : super(key: key);

  final double? width;
  final double? height;
  final bool preCache;

  [@override](/user/override)
  _FlagPicker createState() => _FlagPicker();
}

class _FlagPicker extends State<FlagPicker> {
  late FixedExtentScrollController _controller;
  late int _currentIndex;

  [@override](/user/override)
  void initState() {
    super.initState();
    _currentIndex = 0;
    _controller = FixedExtentScrollController(
      initialItem: _currentIndex,
    );
  }

  [@override](/user/override)
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Container(
      height: widget.height,
      width: widget.width,
      child: CupertinoPicker.builder(
        scrollController: _controller,
        offAxisFraction: 0.0,
        itemExtent: 40,
        childCount: Flag.flagsCode.length,
        useMagnifier: true,
        magnification: 1.0,
        diameterRatio: 0.8,
        onSelectedItemChanged: (value) {
          setState(() {
            print(value);
          });
        },
        itemBuilder: (context, index) => Center(
          child: Flag.fromString(
            Flag.flagsCode[index],
          ),
        ),
      ),
    );
  }
}