Vamos a diseñar y programar la pantalla de login es de decir el acceso para los usuarios de la aplicación en Flutter.
Vamos a diseñar y programar la pantalla de login es de decir el acceso para los usuarios de la aplicación en Flutter.
Básicamente disponemos Tres widgets: dos TextField y un Botón
import 'dart:convert';
import 'package:arequipalocal/api/Api.dart';
import 'package:arequipalocal/pantalla/PantallaCategoria.dart';
import 'package:arequipalocal/pantalla/PantallaRegistro.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
class PantallaLogin extends StatefulWidget {
@override
_PantallaLoginState createState() => _PantallaLoginState();
}
class _PantallaLoginState extends State<PantallaLogin> {
final GlobalKey<ScaffoldState> _globalKey = new GlobalKey<ScaffoldState>();
TextEditingController _email = TextEditingController();
TextEditingController _password = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
key: _globalKey,
appBar: AppBar(
title: Text("LOGIN"),
),
backgroundColor: Colors.orangeAccent,
body: Container(
padding: EdgeInsets.all(20),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextField(
controller: _email,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.email, color: Colors.white,),
hintText: "Email",
hintStyle: TextStyle(
color: Colors.grey
)
),
),
SizedBox( height: 25,),
TextField(
controller: _password,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.vpn_key, color: Colors.white,),
hintText: "Password",
hintStyle: TextStyle(
color: Colors.grey
)
),
),
SizedBox( height: 50,),
FlatButton(
color: Colors.red,
shape: new RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20.0)
),
child: Padding(
padding: EdgeInsets.only(top: 8,bottom: 8,left: 10,right: 10),
child: Text("LOGIN", style: TextStyle(color: Colors.white),),
),
onPressed: (){
_procesoLogin();
},
),
SizedBox( height: 50,),
InkWell(
child: Text("¿Primera vez?, CREA UNA CUENTA", textAlign: TextAlign.center,),
onTap: (){
Navigator.of(context).push(MaterialPageRoute(
builder: (BuildContext) =>PantallaRegistro()
));
},
)
],
),
),
);
}
void _procesoLogin() async{
if(_email.text.isEmpty){
_globalKey.currentState.showSnackBar( SnackBar(
content: Text("Por favor llene su email"), duration: Duration(seconds: 3)
),);
}else if(_password.text.isEmpty){
_globalKey.currentState.showSnackBar( SnackBar(
content: Text("Por favor llene su paswword"), duration: Duration(seconds: 3)
),);
}else{
var data ={"email":_email.text, "password":_password.text};
var respuesta = await ServicioApi().postData(data, "login");
var body = json.decode(respuesta.body);
if(body['success']){
SharedPreferences login = await SharedPreferences.getInstance();
login.setString("token", body['token']);
login.setString("user", json.encode(body['user']));
Navigator.of(context).pushAndRemoveUntil(
MaterialPageRoute(
builder: (context) =>PantallaCategoria()
),(Route<dynamic> route) =>false);
}else{
_globalKey.currentState.showSnackBar( SnackBar(
content: Text(body['message']), duration: Duration(seconds: 3)
),);
}
}
}
}
4330 visitas
Descarga el código fuente del proyecto
USD 37.00 67.00
© Todos los derechos reservados Codea App | Cursos de programación | 2020 - 2022