Para programar una Pantalla Registro debemos agregar dos widgets tipo Textfield más un Button, la función es enviar datos por la API y devolver data.
La pantalla de registro es muy similar a la de el Login con una ligera modificación en el diseño y la dinámica. Donde enviamos una lista de datos en formato JSON:
Veamos algunos aspecto
CÓDIGO DART
import 'dart:convert';
import 'package:arequipalocal/api/Api.dart';
import 'package:arequipalocal/pantalla/PantallaCategoria.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
class PantallaRegistro extends StatefulWidget {
@override
_PantallaRegistroState createState() => _PantallaRegistroState();
}
class _PantallaRegistroState extends State<PantallaRegistro> {
final GlobalKey<ScaffoldState> _globalKey = new GlobalKey<ScaffoldState>();
TextEditingController _nombre = TextEditingController();
TextEditingController _direccion = TextEditingController();
TextEditingController _celular = TextEditingController();
TextEditingController _email = TextEditingController();
TextEditingController _password = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
key: _globalKey,
appBar: AppBar(title:Text("REGISTRO")),
backgroundColor: Colors.orangeAccent,
body: Container(
padding: EdgeInsets.all(20),
child: Column(
children: <Widget>[
TextField(
controller: _nombre,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.people, color: Colors.white,),
hintText: "NOMBRE",
hintStyle: TextStyle(
color: Colors.white54
)
),
),
SizedBox( height: 25,),
TextField(
controller: _direccion,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.map, color: Colors.white,),
hintText: "DIRECCIÓN",
hintStyle: TextStyle(
color: Colors.white54
)
),
),
SizedBox( height: 25,),
TextField(
controller: _celular,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.phone, color: Colors.white,),
hintText: "CELULAR",
hintStyle: TextStyle(
color: Colors.white54
)
),
),
SizedBox( height: 25,),
TextField(
controller: _email,
style: TextStyle( color: Colors.black),
decoration: InputDecoration(
prefixIcon: Icon(Icons.email, color: Colors.white,),
hintText: "EMAIL",
hintStyle: TextStyle(
color: Colors.white54
)
),
),
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.white54
)
),
),
SizedBox( height: 25,),
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: (){
_procesoRegistro();
},
),
],
),
),
);
}
void _procesoRegistro() async{
if(_nombre.text.isEmpty){
_globalKey.currentState.showSnackBar( SnackBar(
content: Text("Por favor llene su nombre"), duration: Duration(seconds: 3)
),);
}else if(_direccion.text.isEmpty){
_globalKey.currentState.showSnackBar( SnackBar(
content: Text("Por favor llene su dirección"), duration: Duration(seconds: 3)
),);
}else if(_celular.text.isEmpty){
_globalKey.currentState.showSnackBar( SnackBar(
content: Text("Por favor llene su celular"), duration: Duration(seconds: 3)
),);
}else 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 ={
"name":_nombre.text,
"direccion":_direccion.text,
"celular":_celular.text,
"email":_email.text,
"password":_password.text
};
var respuesta = await ServicioApi().postData(data, "register");
var body = json.decode(respuesta.body);
if(body['success']){
SharedPreferences registro = await SharedPreferences.getInstance();
registro.setString("token", body['token']);
registro.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)
),);
}
}
}
}
1890 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