

1. Buat database dengan nama db_login

2. Buat table dengan nama pegawai

3. Buat folder dengan nama cobalogin di dalam htdocs

4. Buat 2 file didalam cobalogin

5. Edit conn.php menjadi seperti ini
<?php
$connect = new mysqli("localhost","root","","db_login");
if($connect){
}else{
echo "Connection Failed";
exit();
}
?>
6. Edit login.php menjadi seperti ini
<?php
include 'conn.php';
$username = $_POST['username'];
$password = $_POST['password'];
$queryResult=$connect->query("SELECT * FROM pegawai WHERE username='".$username."' and password='".$password."' ");
$result=array();
while($fetchData=$queryResult->fetch_assoc()){
$result[]=$fetchData;
}
echo json_encode($result);
?>
7. Start a new Flutter project

8. Pilih flutter pplication

9. Konfigurasi project anda

10. Konfigurasi project anda

11. Buka file pubspec.yaml

http: ^0.12.0
fluttertoast:
12. Buat 2 file baru

memberPage.dart
13. Edit main.dart menjadi seperti ini
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:loginsatu/adminPage.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'memberPage.dart';
void main() {
runApp(MyApp());
}
String username = '';
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Login Dengan MySql',
home: MyHomePage(),
routes: <String, WidgetBuilder>{
'/AdminPage': (BuildContext context) => new AdminPage(
username: username,
),
'/MemberPage': (BuildContext context) => new MemberPage(
username: username,
),
'/MyHomePage': (BuildContext context) => new MyHomePage(),
},
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
bool _isHidePassword = true;
void _togglePassword() {
setState(() {
_isHidePassword = !_isHidePassword;
});
}
TextEditingController user = new TextEditingController();
TextEditingController pass = new TextEditingController();
Future<List> _login() async {
final response =
await http.post("http://192.168.10.42/cobalogin/login.php", body: {
"username": user.text,
"password": pass.text,
});
var datauser = json.decode(response.body);
if (datauser.length == 0) {
setState(() {
tampil();
});
} else {
if (datauser[0]['level'] == 'admin') {
Navigator.pushReplacementNamed(context, '/AdminPage');
} else if (datauser[0]['level'] == 'member') {
Navigator.pushReplacementNamed(context, '/MemberPage');
}
setState(() {
username = datauser[0]['username'];
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Login"),
),
body: Padding(
padding: const EdgeInsets.fromLTRB(25, 50, 25, 0),
child: Center(
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.fromLTRB(18, 0, 18, 18),
child: TextField(
controller: user,
decoration: InputDecoration(
//hintText: 'Username'
fillColor: Colors.lightGreen[40],
filled: true,
prefixIcon: Icon(
Icons.person,
color: Colors.blue,
),
prefixStyle: TextStyle(
color: Colors.blue, fontWeight: FontWeight.w600),
labelText: "Username",
hintText: 'Username anda',
hintStyle: TextStyle(
color: Colors.black, fontWeight: FontWeight.w200),
labelStyle: TextStyle(
color: Colors.blue, fontWeight: FontWeight.w600),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(18, 0, 18, 0),
child: TextField(
controller: pass,
obscureText: _isHidePassword,
decoration: InputDecoration(
//hintText: 'Password'
fillColor: Colors.lightGreen[40],
filled: true,
prefixIcon: Icon(
Icons.lock,
color: Colors.blue,
),
prefixStyle: TextStyle(
color: Colors.blue, fontWeight: FontWeight.w600),
labelText: "Password",
hintText: 'Pawssord anda',
hintStyle: TextStyle(
color: Colors.black, fontWeight: FontWeight.w200),
labelStyle: TextStyle(
color: Colors.blue, fontWeight: FontWeight.w600),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
suffixIcon: GestureDetector(
onTap: () {
_togglePassword();
},
child: Icon(
_isHidePassword
? Icons.visibility_off
: Icons.visibility,
color: _isHidePassword ? Colors.grey : Colors.blue,
),
),
isDense: true,
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(0, 20, 0, 0),
child: RaisedButton(
child: Text(
"Login",
style: TextStyle(fontSize: 20),
),
padding: EdgeInsets.fromLTRB(60, 10, 60, 10),
textColor: Colors.white,
color: Colors.blue,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(16.0))),
onPressed: () {
_login();
},
),
),
],
),
),
),
);
}
void tampil() {
Fluttertoast.showToast(
msg: "LOGIN GAGAL",
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.CENTER,
timeInSecForIosWeb: 1,
backgroundColor: Colors.red,
textColor: Colors.white,
fontSize: 16.0);
}
}
14. Edit adminPage.dart menjadi seperti ini
import 'package:flutter/material.dart';
class AdminPage extends StatelessWidget {
AdminPage({this.username});
final String username;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Admin",style: TextStyle(fontSize: 24.0),),
actions: <Widget>[
new IconButton(icon: new Icon(Icons.exit_to_app, color: Colors.white,size: 40,),
onPressed: (){
Navigator.pushReplacementNamed(context, '/MyHomePage');
},),
],),
body: Padding(
padding: const EdgeInsets.all(15.0),
child: Stack(
children: <Widget>[
Align(
alignment: Alignment.center,
child:Text('Halo $username', style:TextStyle(fontSize: 25.0)),
),
],
),
),
);
}
}
15. Edit memberPage.dart menjadi seperti ini
import 'package:flutter/material.dart';
class MemberPage extends StatelessWidget {
MemberPage({this.username});
final String username;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
"Member",
style: TextStyle(fontSize: 24.0),
),
actions: <Widget>[
new IconButton(
icon: new Icon(
Icons.exit_to_app,
color: Colors.white,
size: 40,
),
onPressed: () {
Navigator.pushReplacementNamed(context, '/MyHomePage');
},
),
],
),
body: Padding(
padding: const EdgeInsets.all(15.0),
child: Stack(
children: <Widget>[
Align(
alignment: Alignment.center,
child: Text('Halo $username', style: TextStyle(fontSize: 25.0)),
),
],
),
),
);
}
}
