1
I’m a beginner in Flutter, I need help with something that although it seems simple I can’t find a solution, not even a widget that helps me with it. Even if it was a direction it would help me!
I would like after a successful message sending message via SMTP to email the screen automatically change, or even after a amount of time, seconds, this is my page code I want to change to another after the success message.
This is the data fill screen in the message inputs:
import 'package:animated_text_kit/animated_text_kit.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'dart:io';
import 'PaginadeConfirmacao.dart';
import 'package:image_picker/image_picker.dart';
// é um statefull
class MensagemChat extends StatefulWidget {
@override
_MensagemChatState createState() => _MensagemChatState();
}
class _MensagemChatState extends State<MensagemChat> {
TextEditingController _textNome = TextEditingController();
TextEditingController _textProblem = TextEditingController();
TextEditingController _textEmail = TextEditingController();
//a Funcação abaixo bloqueia o giro de tela, permitindo assim que o app fique no modo vertical
void blockgiro() {
SystemChrome.setPreferredOrientations(
[DeviceOrientation.portraitDown, DeviceOrientation.portraitUp]);
}
//Fim da fução de giro
// Função da CAMERA E GALERIA - GALERIA, CAMERA
File _imagem;
File _imagemTemporaria;
//Funcação para pegar a imagem na galeria
void ImagemGaleria() async {
_imagemTemporaria =
await ImagePicker.pickImage(source: ImageSource.gallery);
setState(() {
_imagem = _imagemTemporaria;
});
}
// Função para tirar foto
void ImagemCamera() async {
_imagemTemporaria = await ImagePicker.pickImage(source: ImageSource.camera);
setState(() {
_imagem = _imagemTemporaria;
});
}
// Final da função de camera/galeria
@override
//Esse é o nosso layout para utilizarmos em nosso formulario
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
title: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SizedBox(width: 20.0, height: 100.0),
Text(
"Ouvidoria",
style: TextStyle(fontSize: 24.0),
),
SizedBox(width: 20.0, height: 100.0),
RotateAnimatedTextKit(
isRepeatingAnimation: true,
duration: const Duration(milliseconds: 2000),
onTap: () {
print("");
},
text: ["Móvel", "Móvel", "Móvel"],
textStyle: TextStyle(fontSize: 24.0, fontFamily: "Horizon"),
textAlign: TextAlign.start),
],
)),
body: SingleChildScrollView(
child: Container(
padding: EdgeInsets.all(16),
child: Column(
//Abixo irá ficar nossos botões/caixa de texto para coletar os dados
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
margin: EdgeInsets.only(bottom: 10, top: 10),
child: TextField(
controller: _textNome,
decoration: new InputDecoration(
labelText: "Nome",
fillColor: Colors.white,
border: new OutlineInputBorder(
borderRadius: new BorderRadius.circular(25.0),
borderSide: new BorderSide(),
),
//fillColor: Colors.green
),
keyboardType: TextInputType.text,
style: new TextStyle(
fontFamily: "Poppins",
),
),
),
Row(children: <Widget>
[ RaisedButton(child:Text("Sim") ,onPressed:(){},
), Container(child: Text("Deseja envair como anonimo?"),)
],),
//Abaixo esta o e-mail no titulo da variavel, mas não é
Container(
margin: EdgeInsets.only(bottom: 10, top: 10),
child: TextField(
controller: _textEmail,
decoration: new InputDecoration(
labelText: "Bairro ou rua da ocorrência",
fillColor: Colors.white,
border: new OutlineInputBorder(
borderRadius: new BorderRadius.circular(25.0),
borderSide: new BorderSide(),
),
//fillColor: Colors.green
),
keyboardType: TextInputType.emailAddress,
style: new TextStyle(
fontFamily: "Poppins",
),
),
),
Container(
margin: EdgeInsets.only(bottom: 10, top: 10),
child: TextField(
controller: _textProblem,
maxLines: 5,
decoration: new InputDecoration(
labelText: "Ocorrencia:",
fillColor: Colors.white,
border: new OutlineInputBorder(
borderRadius: new BorderRadius.circular(25.0),
borderSide: new BorderSide(),
),
//fillColor: Colors.green
),
keyboardType: TextInputType.text,
style: new TextStyle(
fontFamily: "Poppins",
),
),
),
Container(
child: _imagem != null
? Image.file(_imagem)
: Center(
child: Text('Capture uma foto'),
)),
Padding(
padding: const EdgeInsets.all(10),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
icon: Icon(
Icons.camera_alt,
color: Colors.teal,
size: 35,
),
onPressed: () {
ImagemCamera();
}),
],
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
margin: EdgeInsets.only(bottom: 20),
child: RaisedButton(
color: Colors.red,
splashColor: Colors.blue,
child: Text(
"Enviar",
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white),
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
PaginaBoasvindas(
_textNome.text,
_textEmail.text,
_textProblem.text,
_imagem)));
BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Colors.redAccent,
boxShadow: [
BoxShadow(
color: Colors.red,
blurRadius: 50,
offset: Offset(
10,
0,
))
],
);
}),
),
]),
]))));
}
}
And this screen to which is being directed, is in this second screen that would like after confirmed sending the message the user was directed to a thank you screen.
import 'dart:io';
import 'package:flutter/services.dart';
import 'package:mailer/mailer.dart';
import 'package:mailer/smtp_server.dart';
import 'package:mailer/smtp_server/gmail.dart';
import 'package:animated_text_kit/animated_text_kit.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
// ignore: must_be_immutable
class PaginaBoasvindas extends StatelessWidget {
String _nome;
String _email;
String _problema;
File _imagem;
PaginaBoasvindas(this._nome, this._email, this._problema, this._imagem, );
//a Funcação abaixo bloqueia o giro de tela, permitindo assim que o app fique no modo vertical
void blockgiro() {
SystemChrome.setPreferredOrientations(
[DeviceOrientation.portraitDown, DeviceOrientation.portraitUp]);
}
//Fim da fução de giro
void sendMail() async {
String username = '*****@gmail.com';
String password = '!@#*****@#';
final smtpServer = gmail(username, password);
final message = Message()
..from = Address(username, '$_nome')
..recipients.add('l******')
..ccRecipients.addAll(['[email protected]', '[email protected]'])
..bccRecipients.add(Address('[email protected]'))
..subject = 'Ouvidoria Móvel - ${DateTime.now()}'
..text = 'A localização é:$_email,'
'Problema que precisa de solução: $_problema, e a foto da ocorrência: $_imagem';
try {
final sendReport = await send(message, smtpServer);
print('Mensagem enviada: ' + sendReport.toString());
} on MailerException catch (e) {
print('Mensagem não enviada.');
for (var p in e.problems) {
print('Problem: ${p.code}: ${p.msg}');
}
}
}
@override
Widget build(BuildContext context) {
blockgiro();
return Stack(children: <Widget>[
Image.asset(
"Assets/image/appouvidoria_bg.png",
fit: BoxFit.fitHeight,
height: 1000,
),
Scaffold(
appBar: AppBar(
centerTitle: true,
title: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SizedBox(width: 20.0, height: 100.0),
Text(
"Iremos",
style: TextStyle(fontSize: 24.0),
),
SizedBox(width: 20.0, height: 100.0),
RotateAnimatedTextKit(
isRepeatingAnimation: true,
duration: const Duration(milliseconds: 2000),
onTap: () {
print("");
},
text: ["Mais além", "Juntos", "Venceremos"],
textStyle: TextStyle(fontSize: 24.0, fontFamily: "Horizon"),
textAlign: TextAlign.start),
],
)),
backgroundColor: Colors.transparent,
body: SingleChildScrollView(
padding: EdgeInsets.only(bottom: 20),
child: Container(
margin: EdgeInsets.all(10),
color: Colors.transparent,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
padding: EdgeInsets.only(bottom: 120, top: 20),
),
Column(
children: [
Container(
margin: EdgeInsets.all(10),
padding: EdgeInsets.all(
10),
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
blurRadius: 1,
color: Colors.black87,
offset: Offset(1, 1))
],
borderRadius: BorderRadius.circular(13),
color: Colors.red),
child: Align(
alignment: Alignment.topLeft,
child: Text(
"$_nome, verifique se sua mensagem esta correta:",
style: TextStyle(
fontStyle: FontStyle.normal,
fontSize: 18,
color: Colors.white),
),
),
),
Container( padding: EdgeInsets.only(
bottom: 50, right: 12, left: 12, top: 20),),
Container(
margin: EdgeInsets.all(10),
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
blurRadius: 1,
color: Colors.black87,
offset: Offset(1, 1))
],
borderRadius: BorderRadius.circular(13),
color: Colors.white),
child: Align(
alignment: Alignment.topLeft,
child: SizedBox(
width: 250.0,
child: TypewriterAnimatedTextKit(
pause: Duration(minutes: 10),
speed: Duration(milliseconds: 100),
onTap: () {
print("Tap Event");
},
text: ['Seu nome é: $_nome'],
textStyle: TextStyle(
color: Colors.black,
fontSize: 20.0,
fontFamily: "Agne"),
textAlign: TextAlign.start,
),
),
),
),
Container(
margin: EdgeInsets.all(10),
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
blurRadius: 1,
color: Colors.black87,
offset: Offset(1, 1))
],
borderRadius: BorderRadius.circular(13),
color: Colors.white),
child: Align(
alignment: Alignment.topLeft,
child: SizedBox(
width: 250.0,
child: TypewriterAnimatedTextKit(
pause: Duration(minutes: 10),
speed: Duration(milliseconds: 100),
onTap: () {
print("Tap Event");
},
text: ['A localização é essa: $_email'],
textStyle: TextStyle(
color: Colors.black,
fontSize: 20.0,
fontFamily: "Agne"),
textAlign: TextAlign.start,
),
),
),
),
Container(
margin: EdgeInsets.all(10),
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
blurRadius: 1,
color: Colors.black87,
offset: Offset(1, 1))
],
borderRadius: BorderRadius.circular(30),
color: Colors.white),
child: Align(
alignment: Alignment.topLeft,
child: SizedBox(
width: 250.0,
child: TypewriterAnimatedTextKit(
pause: Duration(minutes: 10),
onTap: () {
print("Tap Event");
},
text: ['Seu problema é: $_problema'],
textStyle: TextStyle(
color: Colors.black,
fontSize: 24.0,
fontFamily: "Agne"),
textAlign: TextAlign.start,
),
),
)),
Container(
child: _imagem != null
? Image.file(
_imagem,
fit: BoxFit.scaleDown,
)
: Center(
child: Text('Capture uma foto'),
),
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
blurRadius: 1,
color: Colors.black87,
offset: Offset(1, 1))
],
borderRadius: BorderRadius.circular(30),
color: Colors.white),
),
Container(
padding: EdgeInsets.only(bottom: 20, top: 20),
),
],
),
Row(
crossAxisAlignment: CrossAxisAlignment.baseline,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
margin: EdgeInsets.only(bottom: 20),
child: MaterialButton(
padding: EdgeInsets.all(10),
disabledColor: Colors.greenAccent[100],
disabledTextColor: Colors.blue[100],
elevation: 5.0,
color: Colors.red,
splashColor: Colors.blue,
shape: RoundedRectangleBorder(
borderRadius:
new BorderRadius.circular(18.0),
side: BorderSide(color: Colors.black),
),
child: Text(
"Enviar",
style: TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
color: Colors.white),
),
onPressed: sendMail,
))
]),
Container(
padding: EdgeInsets.only(bottom: 50),
)
]))),
)
]);
}
}
How are you navigating? Ta using named routes? And that screen that you want to display, the user will be able to click "back" and drop on the email sending screen again?
– Matheus Ribeiro
I’m using a text controller to take the input data and take it to the other page,
– Lucas Gomes
I am using named routes and yes, there would be buttons to direct the user to the upload screen again. I tried to send the code of the screen to fill the message fields, but I could not.
– Lucas Gomes