招待コードぽい文字を自動生成してみた

🤔やってみたいこと

Flutterで招待コードを使った機能を作りたいと思ったが、どうやって招待コードなるものを作成すればいいのか???

こちらの記事が参考になりましたなりました

Dartでビジネスロジックを作ってみる。今回は数字と大文字しかいらないので、小文字と記号はなしにします。

import 'dart:math';

  // 8文字の招待コードを自動性する関数
  String invitationCode([int length = 8]) {
    const charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVXYZ';
    final random = Random.secure();
    final randomStr =  List.generate(length, (_) => charset[random.nextInt(charset.length)]).join();
    return randomStr;
  }

void main() {
  print(invitationCode());
}

[実行結果]

🚀やってみたこと

Flutterアプリにこの機能を組み込みたい。どうすればいいのか。最初は非表示にするために、から文字の入った変数を定義する。

ボタンを押すと、変数に値が代入されsetStateで画面を更新して、招待コードを画面に表示する仕組みになっております。

import 'dart:math';

import 'package:flutter/material.dart';

class InvitationPage extends StatefulWidget {
  const InvitationPage({super.key});

  @override
  State<InvitationPage> createState() => _InvitationPageState();
}

class _InvitationPageState extends State<InvitationPage> {

  // から文字の招待コードを保持する変数
  String invitationCode = '';

  // 8文字の招待コードを自動性する関数
  String inputInvitationCode([int length = 8]) {
    const charset = '0123456789ABCDEFGHIJKLMNOPQRSTUVXYZ';
    final random = Random.secure();
    final randomStr =  List.generate(length, (_) => charset[random.nextInt(charset.length)]).join();
    // invitationCodeに代入
    invitationCode = randomStr;
    return randomStr;
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('招待コード'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text('招待コード'),
            Text(invitationCode),
            ElevatedButton(onPressed: () {
              setState(inputInvitationCode);
            }, child: const Text('招待コードを作成')),
          ],
        ),
      ),
    );
  }
}

importして実行する。

import 'package:flutter/material.dart';
import 'package:widget_cookbook/invitation/invitation_page.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: InvitationPage(),
    );
  }
}

こんな感じです✨

🙂最後に

今回は招待コードの自動生成のロジックぽいのを考えてみました。参考になりそうでしたら、有効活用してみてください。