Assalamulaikum Wr.Wb..
Haloo teman-teman, pada artikel kali ini kita akan mencoba membuat sebuah aplikasi pada flutter yaitu mengakses camera. Sebelum kita ke pembahasannya, kita bahas sedikit mengenai apa itu Flutter? Flutter merupakan sebuah platform yang diciptakan oleh Google dan juga menyediakan framework serta bersifat open source. Flutter adalah suatu UI(User Interface) SDK(Software Development Kit) yang digunakan oleh banyak developer untuk membangun aplikasi di OS (Operation System) Android dan IOS serta juga Website app. Untuk membuat satu tampilan desain dibutuhkan satu bahasa dart. Dart juga diartikan sebagai UI (User Interface). Nah mungkin itu dulu penjelasan singkat nya,langsung saja kita masuk ke tahap pembuatan access camera in flutter.
Langkah 1 : buatlah sebuah new flutter project baik di visual code maupun di android studio
Langkah 2 : tambahkan dependecies “image_picker” pada pubspec.yaml yang bisa kita dapatkan dari https://pub.dev/.
copy dependecies nya kemudian dipastekan di pubspec.yaml
Langkah 3 :
edit file main.dart yang ada di folder lib menjadi seperti ini:
import’package:image_picker/image_picker.dart’; -> untuk memanggil library yang sudah kita tambahkan tadi di pubspec.yaml
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
void main() {
runApp( MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Access Camera',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: AccessCameraPage(),
);
}
}
class AccessCameraPage extends StatefulWidget {
const AccessCameraPage({Key? key}) : super(key: key);
@override
_AccessCameraPageState createState() => _AccessCameraPageState();
}
class _AccessCameraPageState extends State<AccessCameraPage> {
File? _image;
Future<void> openCamera() async{
final pickedImage = await ImagePicker().pickImage(source: ImageSource.camera);
if (pickedImage != null) {
setState(() {
_image = File(pickedImage.path);
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Access Camera"),
),
body: Container(
child: Center(
child: _image == null
? Text("NO Image")
: Image.file(_image!),
),
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add_a_photo, color: Colors.white,),
backgroundColor: Colors.green,
onPressed: (){
openCamera();
},
),
);
}
}
kemudian kita save, dan bisa kita running….
berikut hasil running dari access camera:
nah, segitu dulu teman-teman.. sampai jumpa lagi di artikel berikutnya…..
Wassalam….