Flutter中撸一个漂亮的Material Design风格登录注册界面,带正则表达式校验

最新推荐文章于 2024-09-15 08:18:06 发布

codekxx

最新推荐文章于 2024-09-15 08:18:06 发布

阅读量4.9k

点赞数 1

分类专栏： Flutter 文章标签： flutter 登录注册 material

本文链接：https://blog.csdn.net/codekxx/article/details/86692442

版权

本文通过代码展示了如何在Flutter中创建一个遵循Material Design风格的登录注册界面，并且包含了正则表达式验证功能。

摘要由CSDN通过智能技术生成

先看图，没图还说个J8

代码实现如下：

import 'package:flutter/material.dart';
import 'package:flutter_wan/utils/common.dart';

class LoginPage extends StatefulWidget {
   
  @override
  _LoginPageState createState() => new _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
   

  final _formKey = GlobalKey<FormState>();
  Color _eyeColor;
  bool _isClickEye = false;
  String _userName;
  String _pwd;

  @override
  Widget build(BuildContext context) {
   
    return Scaffold(
      appBar: AppBar(title: Text('Login'),),
      body: Form(
        key: _formKey,
        child: ListView(
          padding: EdgeInsets.all(10),
          children: <Widget>[
            initTitle(),
            initHorizontalLine(),
            initLoginName(),
            SizedBox(height:30.0),
            initLoginPWD(),
            initForgetPwd(),
            SizedBox(height:50.0),
            initButton(),
            initRegister(),
            SizedBox(height:100.0),
            initBottomIcon()
          ]