LAPORAN FLUTTER DAN ANDROID STUDIO

Tugas Laporan

Diajukan Untuk Memenuhi Tugas Mata Kuliah Pemrograman Mobile Dosen

Pengampu : I Ketut Resika Arthana, S.T.,M.Kom.

Disusun Oleh :

Mario Martin Da Silva

1815051088

JURUSAN PENDIDIKAN TEKNIK INFORMATIKA FAKULTAS

TEKNIK DAN KEJURUAN

UNIVERSITAS PENDIDIKAN GANESHA

SINGARAJA

2020
1. Tampilan Splash Screen
2. Tampilan Tambah Data (Form Add)
3. Tampilan Change data
SOURCE CODE :

1. Main.dart
import 'package:crud/src/app.dart';
import 'package:flutter/material.dart';

void main() {
runApp(new MaterialApp(
home: new App(),
));
}

2. app.dart
import 'package:crud/src/ui/formadd/form_add_screen.dart';
import 'package:crud/src/ui/home/home_screen.dart';
import 'package:flutter/material.dart';

GlobalKey<ScaffoldState> _scaffoldState = GlobalKey<ScaffoldState>();

class App extends StatelessWidget {

@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primaryColor: Colors.orange,
accentColor: Colors.orangeAccent,
),
home: Scaffold(
key: _scaffoldState,
appBar: AppBar(
title: Text(
"Flutter CRUD API",
style: TextStyle(
color: Colors.white,
),
),
actions: <Widget>[
GestureDetector(
onTap: () {
Navigator.push(
_scaffoldState.currentContext,
MaterialPageRoute(builder: (BuildContext context) {
return FormAddScreen();
}),
);
},
child: Padding(
padding: const EdgeInsets.only(right: 16.0),
child: Icon(
Icons.add,
 color: Colors.white,
),
),
),
],
),
body: HomeScreen(),
),
);
}
}

3. homescreen.dart
import 'package:flutter/material.dart';
import 'package:crud/src/api/api_service.dart';
import 'package:crud/src/model/profile.dart';
import 'package:crud/src/ui/formadd/form_add_screen.dart';

class HomeScreen extends StatefulWidget {

@override
_HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {

BuildContext context;
ApiService apiService;

@override
void initState() {
super.initState();
apiService = ApiService();
}

@override
Widget build(BuildContext context) {
this.context = context;
return SafeArea(
child: FutureBuilder(
future: apiService.getProfiles(),
builder: (BuildContext context, AsyncSnapshot<List<Profile>> snapshot) {
if (snapshot.hasError) {
return Center(
child: Text(
"Something wrong with message: ${snapshot.error.toString()}"),
);
} else if (snapshot.connectionState == ConnectionState.done) {
List<Profile> profiles = snapshot.data;
return _buildListView(profiles);
} else {
return Center(
child: CircularProgressIndicator(),
 );
}
},
),
);
}

Widget _buildListView(List<Profile> profiles) {

return Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 16.0),
child: ListView.builder(
itemBuilder: (context, index) {
Profile profile = profiles[index];
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Card(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
profile.name,
style: Theme.of(context).textTheme.title,
),
Text(profile.email),
Text(profile.age.toString()),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
FlatButton(
onPressed: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text("Warning"),
content: Text(
"Are you sure want to delete data profile
${profile.name}?"),
actions: <Widget>[
FlatButton(
child: Text("Yes"),
onPressed: () {
Navigator.pop(context);
apiService
.deleteProfile(profile.id)
.then((isSuccess) {
if (isSuccess) {
setState(() {});
Scaffold.of(this.context)
.showSnackBar(SnackBar(
content: Text(
"Delete data success")));
} else {
 Scaffold.of(this.context)
.showSnackBar(SnackBar(
content: Text(
"Delete data failed")));
}
});
},
),
FlatButton(
child: Text("No"),
onPressed: () {
Navigator.pop(context);
},
)
],
);
});
},
child: Text(
"Delete",
style: TextStyle(color: Colors.red),
),
),
FlatButton(
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return FormAddScreen(profile: profile);
}));
},
child: Text(
"Edit",
style: TextStyle(color: Colors.blue),
),
),
],
),
],
),
),
),
);
},
itemCount: profiles.length,
),
);
}
}
4. form_add_screen.dart
import 'package:flutter/material.dart';
import 'package:crud/src/api/api_service.dart';
import 'package:crud/src/model/profile.dart';

final GlobalKey<ScaffoldState> _scaffoldState = GlobalKey<ScaffoldState>();

class FormAddScreen extends StatefulWidget {

Profile profile;

FormAddScreen({this.profile});

@override
_FormAddScreenState createState() => _FormAddScreenState();
}

class _FormAddScreenState extends State<FormAddScreen> {

bool _isLoading = false;
ApiService _apiService = ApiService();
bool _isFieldNameValid;
bool _isFieldEmailValid;
bool _isFieldAgeValid;
TextEditingController _controllerName = TextEditingController();
TextEditingController _controllerEmail = TextEditingController();
TextEditingController _controllerAge = TextEditingController();

@override
void initState() {
if (widget.profile != null) {
_isFieldNameValid = true;
_controllerName.text = widget.profile.name;
_isFieldEmailValid = true;
_controllerEmail.text = widget.profile.email;
_isFieldAgeValid = true;
_controllerAge.text = widget.profile.age.toString();
}
super.initState();
}

@override
Widget build(BuildContext context) {
return Scaffold(
key: _scaffoldState,
appBar: AppBar(
iconTheme: IconThemeData(color: Colors.white),
title: Text(
widget.profile == null ? "Form Add" : "Change Data",
style: TextStyle(color: Colors.white),
),
),
body: Stack(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
_buildTextFieldName(),
_buildTextFieldEmail(),
_buildTextFieldAge(),
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: RaisedButton(
child: Text(
widget.profile == null
? "Submit".toUpperCase()
: "Update Data".toUpperCase(),
style: TextStyle(
color: Colors.white,
),
),
onPressed: () {
if (_isFieldNameValid == null ||
_isFieldEmailValid == null ||
_isFieldAgeValid == null ||
!_isFieldNameValid ||
!_isFieldEmailValid ||
!_isFieldAgeValid) {
_scaffoldState.currentState.showSnackBar(
SnackBar(
content: Text("Please fill all field"),
),
);
return;
}
setState(() => _isLoading = true);
String name = _controllerName.text.toString();
String email = _controllerEmail.text.toString();
int age = int.parse(_controllerAge.text.toString());
Profile profile =
Profile(name: name, email: email, age: age);
if (widget.profile == null) {
_apiService.createProfile(profile).then((isSuccess) {
setState(() => _isLoading = false);
if (isSuccess) {
Navigator.pop(_scaffoldState.currentState.context);
} else {
_scaffoldState.currentState.showSnackBar(SnackBar(
content: Text("Submit data failed"),
));
}
});
} else {
profile.id = widget.profile.id;
_apiService.updateProfile(profile).then((isSuccess) {
setState(() => _isLoading = false);
if (isSuccess) {
Navigator.pop(_scaffoldState.currentState.context);
} else {
 _scaffoldState.currentState.showSnackBar(SnackBar(
content: Text("Update data failed"),
));
}
});
}
},
color: Colors.orange[600],
),
)
],
),
),
_isLoading
? Stack(
children: <Widget>[
Opacity(
opacity: 0.3,
child: ModalBarrier(
dismissible: false,
color: Colors.grey,
),
),
Center(
child: CircularProgressIndicator(),
),
],
)
: Container(),
],
),
);
}

Widget _buildTextFieldName() {
return TextField(
controller: _controllerName,
keyboardType: TextInputType.text,
decoration: InputDecoration(
labelText: "Full name",
errorText: _isFieldNameValid == null || _isFieldNameValid
? null
: "Full name is required",
),
onChanged: (value) {
bool isFieldValid = value.trim().isNotEmpty;
if (isFieldValid != _isFieldNameValid) {
setState(() => _isFieldNameValid = isFieldValid);
}
},
);
}

Widget _buildTextFieldEmail() {
return TextField(
 controller: _controllerEmail,
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: "Email",
errorText: _isFieldEmailValid == null || _isFieldEmailValid
? null
: "Email is required",
),
onChanged: (value) {
bool isFieldValid = value.trim().isNotEmpty;
if (isFieldValid != _isFieldEmailValid) {
setState(() => _isFieldEmailValid = isFieldValid);
}
},
);
}

Widget _buildTextFieldAge() {
return TextField(
controller: _controllerAge,
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: "Age",
errorText: _isFieldAgeValid == null || _isFieldAgeValid
? null
: "Age is required",
),
onChanged: (value) {
bool isFieldValid = value.trim().isNotEmpty;
if (isFieldValid != _isFieldAgeValid) {
setState(() => _isFieldAgeValid = isFieldValid);
}
},
);
}
}

5. api_service.dart
import 'package:crud/src/model/profile.dart';
import 'package:http/http.dart' show Client;

class ApiService {
final String baseUrl = "http://api.bengkelrobot.net:8001";
Client client = Client();

Future<List<Profile>> getProfiles() async {

final response = await client.get("$baseUrl/api/profile");
if (response.statusCode == 200) {
return profileFromJson(response.body);
} else {
return null;
}
}
 Future<bool> createProfile(Profile data) async {
final response = await client.post(
"$baseUrl/api/profile",
headers: {"content-type": "application/json"},
body: profileToJson(data),
);
if (response.statusCode == 201) {
return true;
} else {
return false;
}
}

Future<bool> updateProfile(Profile data) async {

final response = await client.put(
"$baseUrl/api/profile/${data.id}",
headers: {"content-type": "application/json"},
body: profileToJson(data),
);
if (response.statusCode == 200) {
return true;
} else {
return false;
}
}

Future<bool> deleteProfile(int id) async {

final response = await client.delete(
"$baseUrl/api/profile/$id",
headers: {"content-type": "application/json"},
);
if (response.statusCode == 200) {
return true;
} else {
return false;
}
}
}

Link Github :
https://github.com/mariomartin134/Flutter-API.git