Jawaban
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
void main() {
runApp(
ChangeNotifierProvider(
create: (context) => UserModel(),
child: MyApp(),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: LoginScreen(),
);
}
}
class UserModel extends ChangeNotifier {
String _username = '';
String _password = '';
String get username => _username;
String get password => _password;
void login(String username, String password) {
_username = username;
_password = password;
notifyListeners();
}
void logout() {
_username = '';
_password = '';
notifyListeners();
}
}
class LoginScreen extends StatefulWidget {
@override
_LoginScreenState createState() => _LoginScreenState();
}
class _LoginScreenState extends State<LoginScreen> {
final _formKey = GlobalKey<FormState>();
String _username = '';
String _password = '';
void _submitForm() {
if (_formKey.currentState!.validate()) {
_formKey.currentState!.save();
Provider.of<UserModel>(context, listen: false).login(_username, _password);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => HomeScreen(),
),
);
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Login Screen'),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Form(
key: _formKey,
child: Column(
children: [
TextFormField(
decoration: InputDecoration(labelText: 'Username'),
validator: (value) {
if (value == null || value.isEmpty) {
return 'Please enter your username';
}
return null;
},
onSaved: (value) {
_username = value!;
},
),
TextFormField(
decoration: InputDecoration(labelText: 'Password'),
obscureText: true,
validator: (value) {
if (value == null || value.isEmpty) {
return 'Please enter your password';
}
if (value.length < 6) {
return 'Password must be at least 6 characters';
}
return null;
},
onSaved: (value) {
_password = value!;
},
),
SizedBox(height: 20),
ElevatedButton(
onPressed: _submitForm,
child: Text('Submit'),
),
],
),
),
),
);
}
}
class HomeScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
final user = Provider.of<UserModel>(context);
return Scaffold(
appBar: AppBar(
title: Text('Home Screen'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Welcome, ${user.username}!',
style: TextStyle(fontSize: 24),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ProfileScreen(),
),
);
},
child: Text('Go to Profile'),
),
],
),
),
);
}
}
class ProfileScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
final user = Provider.of<UserModel>(context);
return Scaffold(
appBar: AppBar(
title: Text('Profile Screen'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Username: ${user.username}',
style: TextStyle(fontSize: 24),
),
Text(
'Password: ${user.password}',
style: TextStyle(fontSize: 24),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
user.logout();
Navigator.pushAndRemoveUntil(
context,
MaterialPageRoute(
builder: (context) => LoginScreen(),
),
(route) => false,
);
},
child: Text('Logout'),
),
],
),
),
);
}
}
Penjelasan:
-
UserModel: Mengelola state pengguna yang sedang login.
loginmethod menyimpan username dan password, sertalogoutmethod menghapus data pengguna. -
LoginScreen: Stateful widget yang mengelola form login. Validasi input dilakukan dan jika validasi berhasil, pengguna dinavigasi ke
HomeScreen. -
HomeScreen: Stateless widget yang menampilkan pesan selamat datang menggunakan username dari
UserModel. Tombol untuk navigasi keProfileScreen. -
ProfileScreen: Stateless widget yang menampilkan informasi username dan password dari
UserModel. Tombol untuk logout yang menghapus data pengguna dariUserModeldan kembali keLoginScreen.