WIP: Add forms
This commit is contained in:
parent
316f5d17d5
commit
b7a79fd2a4
@ -19,7 +19,7 @@ ENV PATH="$FLUTTER_SDK/bin:$FLUTTER_SDK/bin/cache/dart-sdk/bin:${PATH}"
|
||||
RUN mkdir $APP
|
||||
COPY . $APP
|
||||
WORKDIR $APP
|
||||
RUN flutter build web
|
||||
RUN flutter build web --web-renderer html
|
||||
|
||||
# once heare the app will be compiled and ready to deploy
|
||||
|
||||
|
@ -5,6 +5,7 @@ import 'dart:html';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:softplayer_web/components/sign_in_form.dart';
|
||||
import 'package:softplayer_web/components/sign_up_form.dart';
|
||||
|
||||
class MenuPanel extends StatefulWidget implements PreferredSizeWidget {
|
||||
final TabName tab;
|
||||
@ -40,7 +41,12 @@ class _MenuPanel extends State<MenuPanel> {
|
||||
},
|
||||
child: const Text("sign in")),
|
||||
TextButton(
|
||||
onPressed: () => print("sign up"), child: const Text("sign up")),
|
||||
onPressed: () {
|
||||
showDialog(
|
||||
context: context,
|
||||
builder: (BuildContext context) => const SignUpForm());
|
||||
},
|
||||
child: const Text("sign up")),
|
||||
];
|
||||
}
|
||||
}
|
||||
@ -89,7 +95,7 @@ class _MenuPanel extends State<MenuPanel> {
|
||||
Navigator.pushNamed(context, "/about");
|
||||
}),
|
||||
]),
|
||||
backgroundColor: Colors.cyan,
|
||||
backgroundColor: const Color.fromRGBO(46, 51, 78, 1.0),
|
||||
automaticallyImplyLeading: false,
|
||||
actions: accountActions(),
|
||||
);
|
||||
|
@ -13,7 +13,10 @@ class _SignInFormState extends State<SignInForm> {
|
||||
@override
|
||||
Widget build(BuildContext context) => AlertDialog(
|
||||
title: const Text(dialogName),
|
||||
content: Form(
|
||||
content: SizedBox(
|
||||
width: 420,
|
||||
height: 140,
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: Center(
|
||||
child: Column(children: [
|
||||
@ -22,16 +25,24 @@ class _SignInFormState extends State<SignInForm> {
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Enter your username or email",
|
||||
icon: Icon(Icons.account_circle),
|
||||
label: Text("Username"),
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
TextFormField(
|
||||
obscureText: true,
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Enter your password",
|
||||
icon: Icon(Icons.password),
|
||||
label: Text("Password")
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
]))),
|
||||
])))),
|
||||
actions: <Widget>[
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(context, 'Cancel'),
|
||||
|
88
lib/components/sign_up_form.dart
Normal file
88
lib/components/sign_up_form.dart
Normal file
@ -0,0 +1,88 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class SignUpForm extends StatefulWidget {
|
||||
const SignUpForm({super.key});
|
||||
|
||||
@override
|
||||
State<StatefulWidget> createState() => _SignUpFormState();
|
||||
}
|
||||
|
||||
class _SignUpFormState extends State<SignUpForm> {
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
static const dialogName = "Sign Up";
|
||||
@override
|
||||
Widget build(BuildContext context) => AlertDialog(
|
||||
title: const Text(dialogName),
|
||||
content: SizedBox(
|
||||
width: 420,
|
||||
height: 280,
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: Center(
|
||||
child: Column(children: [
|
||||
TextFormField(
|
||||
autofocus: true,
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Enter your username",
|
||||
icon: Icon(Icons.account_circle),
|
||||
label: Text("Username"),
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
TextFormField(
|
||||
autofocus: true,
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Enter your email",
|
||||
icon: Icon(Icons.email),
|
||||
label: Text("Email"),
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
TextFormField(
|
||||
obscureText: true,
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Enter your password",
|
||||
icon: Icon(Icons.password),
|
||||
label: Text("Password")
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
TextFormField(
|
||||
obscureText: true,
|
||||
decoration: const InputDecoration(
|
||||
hintText: "Verify your password",
|
||||
icon: Icon(Icons.password),
|
||||
label: Text("Confirm Password")
|
||||
),
|
||||
cursorWidth: 1,
|
||||
cursorHeight: 18,
|
||||
cursorRadius: const Radius.circular(10),
|
||||
),
|
||||
])))),
|
||||
actions: <Widget>[
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(context, 'Cancel'),
|
||||
child: const Text('Cancel'),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () {
|
||||
// Validate returns true if the form is valid, or false otherwise.
|
||||
if (_formKey.currentState!.validate()) {
|
||||
// If the form is valid, display a snackbar. Up the real world,
|
||||
// you'd often call a server or save the information in a database.
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text(_formKey.toString())),
|
||||
);
|
||||
}
|
||||
},
|
||||
child: const Text('OK'),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
Loading…
Reference in New Issue
Block a user