Membuat dan Menampilkan Inputan Tanggal pada Flutter

Untuk membuat dan menampilkan inputan tanggal (date picker) pada Flutter, Anda dapat menggunakan widget showDatePicker yang disediakan oleh Flutter. Berikut adalah contoh cara membuat inputan tanggal:

import ‘package:flutter/material.dart’;

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: DatePickerExample(),
);
}
}

class DatePickerExample extends StatefulWidget {
@override
_DatePickerExampleState createState() => _DatePickerExampleState();
}

class _DatePickerExampleState extends State {
DateTime selectedDate = DateTime.now();

Future _selectDate(BuildContext context) async {
final DateTime picked = await showDatePicker(
context: context,
initialDate: selectedDate,
firstDate: DateTime(2000),
lastDate: DateTime(2101),
);

if (picked != null && picked != selectedDate)
  setState(() {
    selectedDate = picked;
  });

}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(‘Input Tanggal’),
),
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
“${selectedDate.toLocal()}”.split(‘ ‘)[0],
style: TextStyle(fontSize: 55, fontWeight: FontWeight.bold),
),
SizedBox(
height: 20.0,
),
ElevatedButton(
onPressed: () => _selectDate(context),
child: Text(‘Pilih Tanggal’),
),
],
),
),
);
}
}

Subscribe

Related articles

Membuat Design Form Login & Register Hi-Fi (Hight-Fidelity)

  Langkah - langkah membuat Hight-Fidelity pada UI “Login” seperti...

Mengenal Fitur Pada Figma

Figma memiliki fungsi yang berbeda dengan aplikasi desain grafis...

4 Karateristik Utama Yang Baik Pada UX

Apa yang membuat suatu produk efektif bagi penggunanya? Jawabannya berbeda-beda...

Mengenal UI/UX Dan Perbedaannya

Ap aitu UI/UX? UI (User Interface) dan UX (User Experience)...

Mengenal Display Properti Pada CSS

Display property dalam CSS adalah untuk mengontrol tipe tata...

LEAVE A REPLY

Please enter your comment!
Please enter your name here