Flutter表单验证插件nik_validator的使用

nik_validator 是一个用于解析印度尼西亚身份证号码（NIK）的Flutter包，它能将NIK转换为有用的信息。只需调用.parse函数并输入NIK号码作为参数，即可获取信息，且无需网络连接（离线）。以下是关于如何在Flutter项目中使用此插件的详细说明和示例代码。

添加依赖

首先，在pubspec.yaml文件中添加nik_validator依赖：

dependencies:
  flutter:
    sdk: flutter
  nik_validator: ^latest_version # 替换为最新版本号

然后执行flutter pub get以安装依赖。

示例代码

下面是一个完整的Flutter应用程序示例，演示了如何使用nik_validator来验证和解析NIK。

main.dart

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'NIK Validator',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.blue,
          title: Text("NIK Validator"),
        ),
        body: HomePage(),
      ),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final nikController = TextEditingController();
  NIKModel? nikResult;

  /// Validate NIK information
  void validate() async {
    if (nikController.text.isNotEmpty) {
      NIKModel result = await NIKValidator.instance.parse(nik: nikController.text);
      setState(() {
        nikResult = result;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;

    return Center(
      child: Container(
        margin: EdgeInsets.symmetric(horizontal: 20),
        width: width,
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              _fieldNIK(),
              _buttonParse(),
              SizedBox(height: 20),
              nikResult != null
                  ? _resultWidget()
                  : SizedBox(),
            ],
          ),
        ),
      ),
    );
  }

  Widget _resultWidget() {
    double width = MediaQuery.of(context).size.width;

    return Container(
      width: width,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(8),
        border: Border.all(color: Colors.black)
      ),
      child: Padding(
        padding: const EdgeInsets.all(10),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _textWidget(
              title: "NIK",
              value: nikResult!.nik!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Unique Code",
              value: nikResult!.uniqueCode!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Gender",
              value: nikResult!.gender!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Birth Date",
              value: nikResult!.bornDate!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Age",
              value: nikResult!.age!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Next Birthday",
              value: nikResult!.nextBirthday!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Zodiac",
              value: nikResult!.zodiac!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Province",
              value: nikResult!.province!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "City/District",
              value: nikResult!.city!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Subdistrict",
              value: nikResult!.subdistrict!
            ),
            Divider(color: Colors.black),
            _textWidget(
              title: "Postal Code",
              value: nikResult!.postalCode!
            ),
          ],
        ),
      ),
    );
  }

  Widget _textWidget({required String title, required String value}) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Expanded(
          child: Text(
            title,
            style: TextStyle(
              color: Colors.black,
              fontWeight: FontWeight.bold,
              fontSize: 18
            ),
          ),
        ),
        Expanded(
          child: Text(
            value,
            textAlign: TextAlign.end,
            style: TextStyle(
              color: Colors.black,
              fontSize: 18
            ),
          ),
        )
      ],
    );
  }

  Widget _fieldNIK() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        TextField(
          controller: nikController,
          textInputAction: TextInputAction.go,
          keyboardType: TextInputType.number,
          decoration: InputDecoration(
            hintText: "Enter NIK number",
            border: OutlineInputBorder(borderSide: BorderSide(color: Colors.blue)),
            labelText: "NIK"
          ),
        ),
        SizedBox(height: 5),
        nikResult != null && !nikResult!.valid
            ? Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  "Invalid NIK code",
                  style: TextStyle(
                    color: Colors.red,
                    fontSize: 15
                  ),
                ),
                SizedBox(height: 5),
              ],
            )
            : SizedBox()
      ],
    );
  }

  Widget _buttonParse() {
    double width = MediaQuery.of(context).size.width;
    return Container(
      width: width,
      child: ElevatedButton(
        style: ElevatedButton.styleFrom(
          primary: Colors.blue,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(5)
          ),
        ),
        onPressed: () => validate(),
        child: Text(
          "Validate NIK",
          style: TextStyle(
            color: Colors.white
          ),
        ),
      ),
    );
  }
}

关于我

如果您对nik_validator或任何其他问题有任何疑问，欢迎访问我的网站：leeyurani.com 或在我的GitHub上关注我：yusriltakeuchi

希望这个指南能帮助您成功地在Flutter应用中集成和使用nik_validator！如果有任何问题，请随时提问。