Login Screen - Flutterflow Typing CST Test

Login Screen — Flutterflow Code

Demonstrates a simple login UI in FlutterFlow with custom Dart validation logic.

import 'package:flutter/material.dart';

class LoginScreen extends StatefulWidget {
	@override
	_LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
	final email = TextEditingController();
	final pass = TextEditingController();

	void login(){
		if(email.text.isEmpty || pass.text.isEmpty){
		ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Fill all fields')));
		}else{
		ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Login Success')));
		}
	}

	@override
	Widget build(BuildContext context){
		return Scaffold(
		appBar: AppBar(title: Text('Login')),
		body: Padding(
		padding: EdgeInsets.all(16),
		child: Column(children:[
		TextField(controller: email, decoration: InputDecoration(labelText:'Email')),
		TextField(controller: pass, obscureText: true, decoration: InputDecoration(labelText:'Password')),
		ElevatedButton(onPressed: login, child: Text('Login')),
		])
		)
		);
	}
}

Flutterflow Language Guide

FlutterFlow is a low-code visual app builder that enables users to create native iOS, Android, and web applications using a drag-and-drop interface, powered by Google’s Flutter framework.

More Flutterflow Typing Exercises

Practice Other Languages