1

enter image description here

I wants to put the calendar half on one container and half on another container. I tried it using stack but it doesn't worked well can anyone guide me regarding that? Below code is giving an error as bottom overflowed. I wants to put calendar half on orange colored widget at top and half on white colored widget below that:

import 'dart:async';
import 'package:AtDocHUB/Model/Document.dart';
import 'package:AtDocHUB/Model/User.dart';
import 'package:AtDocHUB/Notification/AptNotification.dart';
import 'package:AtDocHUB/View/BottomNavigationBar.dart';
import 'package:AtDocHUB/View/Document/adminSearchDocStatus.dart';
import 'package:AtDocHUB/View/Document/dateSearch.dart';
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:AtDocHUB/View/Activity/ActivityStatusPage.dart';
import 'package:AtDocHUB/View/Document/DocumentPage.dart';
import 'package:AtDocHUB/View/homePageAdmin.dart';
import 'package:flutter_typeahead/flutter_typeahead.dart';
import 'package:get/get.dart';
import '../../Controller/AppointmentController.dart';
import '../../Model/Appointment.dart';
import '../Controller/DocumentController.dart';
import 'Appointment/AddNewAppointment.dart';
import 'Appointment/AppointmentsDetailsEditPage.dart';
import 'package:table_calendar/table_calendar.dart'; //import '../Controller/AppointmentController.dart';
// import '../Controller/DocumentController.dart';
//import '../Model/Appointment.dart';
//import 'Appointment/AddNewAppointment.dart';
//import 'Appointment/AppointmentDetailPage.dart';

class AppointmentHomePage extends StatefulWidget {
  final String userName;
  final String playerid;

  AppointmentHomePage(
    this.playerid,
    this.userName,
  );
  // final TextEditingController mycontroller = TextEditingController();
  @override
  State<AppointmentHomePage> createState() => _AppointmentHomePageState(
        this.playerid,
        this.userName,
      );
}

class _AppointmentHomePageState extends State<AppointmentHomePage> {
  late final String userName;
  final String playerid;

  var focusedDay;
  _AppointmentHomePageState(
    this.playerid,
    this.userName,
  );

  late final String executive;
  final TextEditingController typeAheadControllerDate = TextEditingController();
  final TextEditingController typeAheadControllerName = TextEditingController();
  //String formattedDate = DateFormat('yyyy-MM-dd – kk:mm');
  AppointmentController appointmentController =
      Get.put(AppointmentController());
  final TextEditingController controller = TextEditingController();
  final TextEditingController dateController = TextEditingController();

  List<UserLogin> logs = [];
  String email = '';

  String pass = '';
  List<Document> docs = [];

  //final _myController = TextEditingController(text: '');
  TextEditingController dateinput = TextEditingController();

  late Future<List<Appointment>> futureAppointments; //call for search bar
  late Future<List<Appointment>> futureapt; //call for list of documents
  late Future<List<Appointment>> futuretodayapt; //call for list of documents
  late Future<List<Appointment>> futuretommorowapt;
  late Future<List<Appointment>> aptsExecutive =
      [] as Future<List<Appointment>>; //call for search bar

  List<Appointment> apmnt = [];
  String query = '';
  String dTitle = '';
  String token = '';
  String username = '';

  int aptid = 0;
  @override
  void initState() {
    super.initState();

    dateinput.text = "";
    //set the initial value of text field
    futureAppointments = AppointmentController
        .fetchSearchAppointmentList(); //call for search bar
    futureapt = AppointmentController
        .fetchAppointmentList(); //call for list of documents
    futuretodayapt = AppointmentController.fetchAptByTodays();
    futuretommorowapt = AppointmentController.fetchAptByTommorow();
    init();
  }

  Future init() async {
    final apmnt = await AppointmentController.fetchAppointmentList();
    final aptsExecutive = await AppointmentController.fetchAppointments;

    setState(() {
      this.apmnt = apmnt;
      // this.aptsExecutive = aptsExecutive as Future<List<Appointment>>;
      for (int i = 0; i <= apmnt.length; i++) {
        this.username = apmnt[i].userName;
        this.aptid = apmnt[i].aptId;
      }
    });
    // final docs = await DocumentController.getdocs(query);

    setState(() {
      //   this.docs = docs;

      // for (int i = 0; i <= docs.length; i++) {
      //   this.dTitle = docs[i].docTitle;
      //   this.token = docs[i].tokenNo.toString();
      // }
    });
    print(docs);
  }

  //Widget searchbar() => SearchWidget();
  Widget bottomappbar() => BottonNavigationBar(this.userName);
  @override
  Widget build(BuildContext context) {
    const appTitle = 'Appointment';
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: appTitle,
      home: Scaffold(
        // backgroundColor: // Color.fromARGB(
        //     //255, 3, 87, 156),
        //     Color.fromARGB(255, 253, 153, 33),
        floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
        floatingActionButton: FloatingActionButton(
            child: Icon(Icons.add, color: Color.fromARGB(255, 255, 255, 255)),
            backgroundColor: Color.fromARGB(255, 253, 153, 33),
            onPressed: () {
              Navigator.of(context).push(MaterialPageRoute(
                  builder: (BuildContext context) => AddAppointment(
                        this.userName,
                        //this.createdBY
                      )));
            }),
        bottomNavigationBar: bottomappbar(),
        body: Stack(children: [
          Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            // crossAxisAlignment: CrossAxisAlignment.end,
            // mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: MediaQuery.of(context).size.width,
                decoration: BoxDecoration(
                  color: Color.fromARGB(255, 253, 153, 33),
                ),
                height: MediaQuery.of(context).size.height * 0.2,
                //padding: EdgeInsets.only(right: 5.0),
                child: Padding(
                  padding: const EdgeInsets.all(3.0),
                  child: Column(
                    children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.start,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          IconButton(
                              icon: const CircleAvatar(
                                child: Icon(
                                  Icons.arrow_back_ios_new_sharp,
                                  size: 15,
                                  color:
                                      // Color.fromARGB(255, 3, 87,
                                      // //     156),
                                      Color.fromARGB(255, 253, 153, 33),
                                ),
                                backgroundColor: Colors.white, maxRadius: 10,
                                minRadius: 2,

                                // child: Icons.arrow_back_ios_new_rounded,
                              ),
                              onPressed: () => Navigator.of(context).push(
                                  MaterialPageRoute(
                                      builder: (BuildContext context) =>
                                          DocumentPage(this.userName)))),
                          Padding(
                            padding: const EdgeInsets.only(top: 8),
                            child: Text(
                              'Appointment',
                              style: TextStyle(
                                color: Colors.white,
                                fontSize: 20,
                                fontWeight: FontWeight.bold,
                              ),
                              // textAlign: TextAlign.center,
                            ),
                          ),
                          Expanded(
                            child: SizedBox(
                              width: MediaQuery.of(context).size.width * 0.08,
                            ),
                          ),
                          IconButton(
                            alignment: Alignment.center,
                            icon: Icon(
                              Icons.notification_important_rounded,
                              // size: 20,
                              color: Colors.white,
                            ),
                            iconSize: 20,
                            onPressed: () => Navigator.of(context).push(
                                MaterialPageRoute(
                                    builder: (BuildContext context) =>
                                        DocumentPage(this.userName))),
                          ),
                          IconButton(
                              //  alignment: Alignment.bottomRight,
                              icon: Icon(
                                Icons.edit_attributes_sharp,
                                // size: 20,
                                color: Colors.white,
                              ),
                              iconSize: 20,
                              onPressed: () => Navigator.of(context).push(
                                  MaterialPageRoute(
                                      builder: (BuildContext context) =>
                                          AppointmentDetailsEditPage(
                                              this.userName, this.aptid, 45)))),
                          IconButton(
                              //  alignment: Alignment.bottomRight,
                              icon: Icon(
                                Icons.add_circle_outline_rounded,
                                // size: 20,
                                color: Colors.white,
                              ),
                              iconSize: 20,
                              onPressed: () => Navigator.of(context).push(
                                  MaterialPageRoute(
                                      builder: (BuildContext context) =>
                                          AddAppointment(this.userName)))),
                        ],
                      ),
                      AptSearch(),
                      Positioned(
                        top: 40,
                        child: ClipRRect(
                          borderRadius: BorderRadius.only(
                              topLeft: Radius.circular(30),
                              topRight: Radius.circular(30)),
                          child: Center(
                            child: Padding(
                              padding: const EdgeInsets.all(8),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisAlignment: MainAxisAlignment.start,
                                children: [
                                  TableCalendar(
                                    focusedDay: DateTime.now(),
                                    firstDay: DateTime.now(),
                                    lastDay: DateTime.utc(2030, 1, 1),
                                  )
                                ],
                              ),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ]),
      ),
    );
  }

  Widget AptSearch() => SearchWidget(
        text: query,
        hintText: 'Title or Token No.',
        onChanged: searchdoc,
      );

  Future searchdoc(String query) async {
    debounce() async {
      {
        final docs = await DocumentController.getdocs(query);

        if (!mounted) return;

        setState(() {
          this.query = query;
          this.docs = docs;
        });
      }
    }
  }
}

1 Answers1

0

You code is very close to the solution. I think I know what issue you are facing. May be the positioned widget is not taking full height to render the calendar & other items. To solve this simply use Align widget with heightFactor like this.

Align(
  alignment: Alignment.topLeft,
  heightFactor: 1,

This will generate your widget from the exact top left starting below the last widget & heightFactor will tell that it can use the full available height. You can also use list view inside this align widget which is using full height so it will provide scroll on smaller devices.

You can check my sample code here https://dartpad.dev/?id=92c59353b949ed0c1cf99843ddb9ccbb

Aakash Kumar
  • 1,069
  • 7
  • 11