image picker

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:image_picker/image_picker.dart';
class Catelogue extends StatefulWidget {
  const Catelogue({Key? key}) : super(key: key);

  @override
  State<Catelogue> createState() => _CatelogueState();
}

class _CatelogueState extends State<Catelogue> {
  
  late File imageFile;
  File? _proImage;
  File? _proImages;
  List<TextEditingController> _controllers = [];
  List<TextField> _fields = [];
  @override
  void dispose() {
    for (final controller in _controllers) {
      controller.dispose();
    }
    super.dispose();
  }
  Widget _addTile() {
    return Padding(
      padding: const EdgeInsets.only(top: 30,left: 350),
      child: ListTile(
        title: Icon(Icons.add),
        onTap: () {
          final controller = TextEditingController();
          final field = TextField(
            controller: controller,
            decoration: InputDecoration(
              hintText: "Products Details${_controllers.length + 1}",
              hintStyle: TextStyle(fontWeight: FontWeight.w600,
              fontSize: 14,color: Colors.black)
            ),
          );

          setState(() {
            _controllers.add(controller);
            _fields.add(field);
          });
        },
      ),
    );
  }
  @override
  Widget build(BuildContext context) {
    MediaQuery.of(context).size.height;
    MediaQuery.of(context).size.width;
    return SafeArea(
      child: Scaffold(
        resizeToAvoidBottomInset: false,
        body: Column(
          children: [
            Boxcontainer(),
            Type(hinttext: "Item Name"),
            Type(hinttext: "Price"),
            Type(hinttext: "Description"),
            Type(hinttext: "Product Details"),

            _addTile(),
           Expanded(child:_listView() ),

          ],
        )
      ),
    );
  }
  Widget Boxcontainer(){
    return Center(
      child: Padding(
        padding:  EdgeInsets.only(top: 20),
        child: InkWell(
          onTap: (){
            proPickImage();
          },
          child: Container(
          height: MediaQuery.of(context).size.height*0.27,
            width: MediaQuery.of(context).size.width*0.91,
            decoration: BoxDecoration(
              // image: DecorationImage(
              //     image:imageFile ==null? Image.memory(_proImage,)
              //     FileImage(_proImage!),
              //
              // ),
              borderRadius: BorderRadius.circular(20),
              color: Colors.cyan.shade300,
            ),
            child:_proImage !=null?Image(image: FileImage(_proImage!),fit: BoxFit.cover,):Icon(Icons.add_a_photo,color: Colors.black,)
            // Column(
            //   children: [
            //
            //     IconButton(
            //         onPressed: (){
            //          proPickImage();
            //         },
            //         icon: Icon(Icons.camera_alt,size: 50,)),
            //     Text("  Add Image",
            //       style: TextStyle(fontSize: 20,
            //       fontWeight: FontWeight.w700,color: Colors.black),
            //     ),
            //
            //   ],
            // ),

          ),
        ),
      ),
    );
  }

  Widget _listView() {
    return ListView.builder(
      itemCount: _fields.length,
      itemBuilder: (context, index) {
        return Container(
          margin: EdgeInsets.all(5),
          child: _fields[index],
        );
      },
    );
  }

  Future proPickImage() async {
    try {
      final proImage = await ImagePicker()
          .pickImage(source: ImageSource.gallery, imageQuality: 60);
      if (proImage == null) {
        return;
      }
      final imageTemporary = File(proImage.path);
      setState(() => _proImage = imageTemporary);
    } on PlatformException {
      return "Failed to Pick";
    }
  }

}
class Type extends StatelessWidget {
  final String hinttext;
  const Type({Key? key,required this.hinttext}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(left: 30,right: 30,top: 50),
      child: TextField(
        decoration: InputDecoration(
          hintText: hinttext,
          hintStyle: TextStyle(fontSize: 16,
          fontWeight: FontWeight.w600,color: Colors.black)
        ),
      ),
    );
  }
}

// class ProductDetails extends StatelessWidget {
//   final String htext;
//   const ProductDetails({Key? key,required this.htext}) : super(key: key);
//
//
//
//   @override
//   Widget build(BuildContext context) {
//     return Padding(
//       padding: const EdgeInsets.only(left: 30,top: 50,right: 120),
//       child: Row(
//         children: [
//           TextField(
//             decoration: InputDecoration(
//               hintText: htext,
//                 hintStyle: TextStyle(fontSize: 16,
//                     fontWeight: FontWeight.w600,color: Colors.black),
//             ),
//           ),
//        ]
//         )
//     );
//   }
// }
// class TextFieldInput extends StatefulWidget {
//   const TextFieldInput({Key? key}) : super(key: key);
//   @override
//   _TextFieldInputState createState() => _TextFieldInputState();
// }
//
// class _TextFieldInputState extends State<TextFieldInput> {
//
//   @override
//   Widget build(BuildContext context) {
//     return SafeArea(
//         child: Row(
//           children: [
//             _add
//           ],
//         )
//    
//     );
    // return Padding(
    //   padding: const EdgeInsets.only(left: 30,top: 50,right: 30),
    //   child: Column(
    //     mainAxisAlignment: MainAxisAlignment.center,
    //     children: const [
    //       TextField(
    //         decoration: InputDecoration(
    //           hintText: "Product Details",
    //           hintStyle: TextStyle(fontSize: 16,
    //               fontWeight: FontWeight.w600,color: Colors.black),
    //         ),
    //       )
    //     ],
    //   ),
    // );
//   }
// }

// class _View1 extends StatefulWidget {
//   @override
//   _View1State createState() => _View1State();
// }

// class _View1State extends State<_View1> {
//   List<TextEditingController> _controllers = [];
//   List<TextField> _fields = [];
//
//   @override
//   void dispose() {
//     for (final controller in _controllers) {
//       controller.dispose();
//     }
//     super.dispose();
//   }
//
//   Widget _addTile() {
//     return ListTile(
//       title: Icon(Icons.add),
//       onTap: () {
//         final controller = TextEditingController();
//         final field = TextField(
//           controller: controller,
//           decoration: InputDecoration(
//             border: OutlineInputBorder(),
//             labelText: "name${_controllers.length + 1}",
//           ),
//         );
//
//         setState(() {
//           _controllers.add(controller);
//           _fields.add(field);
//         });
//       },
//     );
//   }
//   @override
//   Widget build(BuildContext context) {
//     return SafeArea(
//       child: Scaffold(
//           appBar: AppBar(
//             title: Text("Dynamic Text Field"),
//           ),
//           body: Column(
//             children: [
//               _addTile(),
//               Expanded(child: _listView()),
//               _okButton(),
//             ],
//           )),
//     );
//   }Widget _okButton() {
//     return ElevatedButton(
//       onPressed: () async {
//         String text = _controllers
//             .where((element) => element.text != "")
//             .fold("", (acc, element) => acc += "${element.text}\n");
//         final alert = AlertDialog(
//           title: Text("Count: ${_controllers.length}"),
//           content: Text(text.trim()),
//           actions: [
//             TextButton(
//               onPressed: () {
//                 Navigator.of(context).pop();
//               },
//               child: Text("OK"),
//             ),
//           ],
//         );
//         await showDialog(
//           context: context,
//           builder: (BuildContext context) => alert,
//         );
//         setState(() {});
//       },
//       child: Text("OK"),
//     );
//   }
//   Widget _listView() {
//     return ListView.builder(
//       itemCount: _fields.length,
//       itemBuilder: (context, index) {
//         return Container(
//           margin: EdgeInsets.all(5),
//           child: _fields[index],
//         );
//       },
//     );
//   }
//
// }
// class _View2 extends StatelessWidget {
//   const _View2({Key? key}) : super(key: key);
//
//   @override
//   Widget build(BuildContext context) {
//     return const Placeholder();
//   }
// }