🙂 İNSANLARIN EN HAYIRLISI INSANLARA FAYDALI OLANDIR 🙂

Ramazan HABER / FLUTTER / Tarih girişi button ile showDatePicker CupertinoDatePicker kullanımı

1-) FLUTTER - Tarih girişi button ile showDatePicker CupertinoDatePicker kullanımı

 

EKRAN GÖRÜNTÜSÜ

 

 

1- DEĞİŞKENLER VE SHOWDATEPİCKER METOTU

 

@override
void initState() {
  
// TODO: implement initState
  
super.initState();

  
_dogumTar = new TextEditingController();

 

}

 

DateTime? _chosenDateTime;
String secilenTarih = "";

late TextEditingController _dogumTar;

// Show the modal that contains the CupertinoDatePicker
void _showDatePicker(ctx) {
  
// showCupertinoModalPopup is a built-in function of the cupertino library

  
showCupertinoModalPopup(
      context: ctx,
      builder: (_) =>
Container(
            height:
300,
            color:
const Color.fromARGB(255, 255, 255, 255),
            child:
Column(
              children: [
                
SizedBox(
                  height:
200,
                  child:
CupertinoDatePicker(
                    mode:
CupertinoDatePickerMode.date,
                    initialDateTime:
DateTime(1980, 01, 01),
                    onDateTimeChanged: (value) {
                      setState(
                        () {
                          
_chosenDateTime = value;
                          print(value.toString());
                          print(formatDate(value, [
yyyy, '-', mm, '-', dd]));
                          
secilenTarih =
                              formatDate(value, [
yyyy, '-', mm, '-', dd]);

                          
_dogumTar.text = secilenTarih;
                        },
                      );
                    },
                  ),
                ),

                
// Close the modal
                
CupertinoButton(
                  child:
const Text('OK'),
                  onPressed: () {
                    
if(secilenTarih==""){
                      
secilenTarih= "1980-01-01";
                    }

                    setState(() {
                      
_dogumTar.text = secilenTarih;
                    });

                    
Navigator.of(ctx).pop();
                  },
                )
              ],
            ),
          ));
}

 

 

2- TEXTFORMFİELD

Padding(
  padding:
EdgeInsets.only(top: 10),
  child:
Container(
    child:
TextFormField(
      controller:
_dogumTar, // DEĞERİ BUNUN SAYESİNDE ATAMIŞ OLURUZ
      onTap: () {
        
// Below line stops keyboard from appearing
        
FocusScope.of(context)
            .requestFocus(
new FocusNode());

        _showDatePicker(context);


      },
      style:
TextStyle(
          fontSize:
17, fontWeight: FontWeight.bold),
      keyboardType:
TextInputType.emailAddress,
      decoration:
InputDecoration(
        labelText:
"Doğum Tarihini Seçiniz",
        border:
OutlineInputBorder(),
        labelStyle:
TextStyle(fontSize: 15),
      ),
    ),
  ),
),

 

NOT : formatDate için aşağıki paketi eklemen lazım

 

flutter pub add date_format

pubspec.yaml

date_format: ^2.0.5

 

main.dart -> import --> import 'package:date_format/date_format.dart';

 

 2022 Eylül 10 Cumartesi
 467