title: How to generate a pdf of the entire visual content of the selected screen or data - Flutter
body: <h2>Hi, How can I generate a pdf with the screen visual data, or generate a pdf of the data being generated by selecting a date?</h2>
  <p>I would like to generate a pdf with the data to be visualized when selecting, which in this case is the registration data. But I'm having a hard time. Sorry if my question is too stupid, but I'm a beginner.</p>
  <p><strong>My code:</strong></p>
  <pre><code>&quot;&quot;    // ignore: unused_import
      import 'dart:math';
      
      import 'package:date_format/date_format.dart';
      import 'package:flutter/cupertino.dart';
      import 'package:flutter/material.dart';
      // ignore: unused_import
      import 'package:flutter_datetime_picker/flutter_datetime_picker.dart';
      import 'package:font_awesome_flutter/font_awesome_flutter.dart';
      // ignore: unused_import
      import 'package:line_awesome_icons/line_awesome_icons.dart';
      import 'package:solidarioweb/constants/meses.dart';
      import 'package:solidarioweb/models/agendamento.dart';
      import 'package:solidarioweb/models/servico.dart';
      import 'package:solidarioweb/models/user.dart';
      import 'package:solidarioweb/pages/agendamentos/meus_agendamentos_page.dart';
      import 'package:solidarioweb/providers/firebase_provider.dart';
      import 'package:solidarioweb/widgets/appbar.dart';
      import 'package:solidarioweb/widgets/explore_drawer.dart';
      import 'package:solidarioweb/widgets/responsive.dart';
      import 'package:solidarioweb/widgets/theme.dart';
      import 'package:solidarioweb/widgets/top_bar_contents.dart';
      import 'package:table_calendar/table_calendar.dart';
      
      class CheckoutIAdmPage extends StatefulWidget {
        Servico servico;
        CheckoutIAdmPage({Key key, this.servico}) : super(key: key);
      
        @override
        _CheckoutIAdmPageState createState() =&gt; new _CheckoutIAdmPageState();
      }
      
      class _CheckoutIAdmPageState extends State&lt;CheckoutIAdmPage&gt;
          with SingleTickerProviderStateMixin {
        TextEditingController horarioController = new TextEditingController();
        DateTime _selectedDay;
        DateTime _selectedHour;
        String _selectedHourPrint;
        CalendarController _calendarController;
        ScrollController _scrollController = ScrollController();
        bool isSending = false;
        bool isSuccess = false;
        final _scaffoldKey = GlobalKey&lt;ScaffoldState&gt;();
        String atendente;
        User user;
        int _markersMaxAmount = 2;
      
        List&lt;String&gt; atendentes = [];
      
        Map&lt;DateTime, List&lt;Agendamento&gt;&gt; _markedDateMap = {};
      
        List&lt;Agendamento&gt; agendamentosDay = [];
      
        List&lt;Agendamento&gt; agendamentosMes = [];
      
        @override
        void initState() {
          super.initState();
          _calendarController = CalendarController();
          atendentes = widget.servico.atendentes.split(', ');
          int mes = DateTime.now().month;
          int ano = DateTime.now().year;
          getAgendamentosMes(mes, ano);
        }
      
        getAgendamentosMes(int mes, int ano) {
          FirebaseProvider.getAgendamentosMensal(mes, ano, widget.servico.id)
              .then((value) {
            setState(() {
              agendamentosMes = value;
              for (var item in agendamentosMes) {
                _markedDateMap[item.data] = [item];
                if (DateTime.now().difference(item.data).inDays == 0) {
                  agendamentosDay.add(item);
                }
              }
            });
          });
        }
      
        getUser() {
          FirebaseProvider.getUser().then((value) {
            if (value != null)
              setState(() {
                user = value;
                print(user);
              });
          });
        }
      
        @override
        Widget build(BuildContext context) {
          var voltar;
          var actions;
          var screenSize = MediaQuery.of(context).size;
      
          return Scaffold(
              key: _scaffoldKey,
              appBar: ResponsiveWidget.isSmallScreen(context)
                  ? AppBar(
                      iconTheme: IconThemeData(color: Colors.white),
                      leading: IconButton(
                        icon: Icon(Icons.keyboard_arrow_left, size: 40.0),
                        onPressed: () {
                          if (voltar == null)
                            Navigator.pop(context, null);
                          else
                            voltar(context);
                        },
                      ),
                      backgroundColor: CustomsColors.customYellow,
                      actions: actions)
                  : PreferredSize(
                      // for larger &amp; medium screen sizes
                      preferredSize: Size(screenSize.width, 1000),
                      child: TopBarContents(0.0),
                    ),
              drawer: ExploreDrawer(), // The draw
              backgroundColor: Colors.white,
              body: Stack(children: [
                Container(
                  padding: EdgeInsets.only(
                      top: 10.0,
                      left: MediaQuery.of(context).size.width * 0.1,
                      right: MediaQuery.of(context).size.width * 0.1),
                  alignment: Alignment.topCenter,
                  child: CustomScrollView(controller: _scrollController, slivers: &lt;
                      Widget&gt;[
                    SliverList(
                        delegate: SliverChildListDelegate([
                      Container(
                        margin: EdgeInsets.all(20),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(widget.servico.title,
                                style: TextStyle(
                                    color: CustomsColors.customYellow,
                                    fontWeight: FontWeight.bold,
                                    fontSize: 30)),
                            Divider(
                              height: 5,
                              thickness: 1.5,
                              color: CustomsColors.customYellow,
                            ),
                          ],
                        ),
                      ),
                      Container(
                        height: 20.0,
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 0, bottom: 20, left: 15),
                        alignment: Alignment.center,
                        child: Container(
                          alignment: Alignment.centerLeft,
                          child: Text(
                            &quot;Veja os atendimentos por dia&quot;,
                            style: TextStyle(
                                fontSize: 20,
                                color: Colors.black87,
                                fontWeight: FontWeight.w300),
                            textAlign: TextAlign.center,
                          ),
                        ),
                      ),
                      PhysicalModel(
                        elevation: 5,
                        shape: BoxShape.rectangle,
                        color: Colors.white,
                        child: Container(
                          color: Colors.yellow.withOpacity(0.08),
                          child: TableCalendar(
                              initialSelectedDay: DateTime.now(),
                              formatAnimation: FormatAnimation.slide,
                              locale: 'pt_BR',
                              initialCalendarFormat: CalendarFormat.month,
                              availableCalendarFormats: const {
                                CalendarFormat.month: 'mês',
                                //CalendarFormat.week: 'semana',
                              },
                              availableGestures: AvailableGestures.horizontalSwipe,
                              calendarController: _calendarController,
                              events: _markedDateMap,
                              startingDayOfWeek: StartingDayOfWeek.monday,
                              headerStyle: HeaderStyle(
                                leftChevronMargin: EdgeInsets.all(0.0),
                                rightChevronMargin: EdgeInsets.all(0.0),
                                leftChevronIcon: Icon(
                                  Icons.keyboard_arrow_left,
                                  size: 40.0,
                                  color: CustomsColors.customYellow,
                                ),
                                rightChevronIcon: Icon(Icons.keyboard_arrow_right,
                                    size: 40.0, color: CustomsColors.custompurple),
                                formatButtonTextStyle: TextStyle()
                                    .copyWith(color: Colors.white, fontSize: 15.0),
                                formatButtonDecoration: BoxDecoration(
                                  color: CustomsColors.customYellow,
                                  borderRadius: BorderRadius.circular(18.0),
                                ),
                                titleTextStyle: TextStyle(
                                    color: CustomsColors.customYellow,
                                    fontSize: 16.0,
                                    fontWeight: FontWeight.bold),
                              ),
                              daysOfWeekStyle: DaysOfWeekStyle(
                                weekendStyle:
                                    TextStyle().copyWith(color: Colors.black),
                                weekdayStyle:
                                    TextStyle().copyWith(color: Colors.black),
                              ),
                              calendarStyle: CalendarStyle(
                                  selectedStyle: TextStyle(
                                      color: Colors.white,
                                      fontSize: 20.0,
                                      fontWeight: FontWeight.bold),
                                  selectedColor: CustomsColors.customPurple,
                                  todayColor: Colors.yellow[200],
                                  todayStyle: TextStyle(color: Colors.black),
                                  weekdayStyle: TextStyle(color: Colors.black),
                                  weekendStyle: TextStyle(color: Colors.black),
                                  markersMaxAmount: _markersMaxAmount),
                              onDaySelected: _onDaySelected,
                              startDay: DateTime.now(),
                              onVisibleDaysChanged: _onVisibleDaysChanged,
                              builders: CalendarBuilders(
                                //
                                markersBuilder: _setMarkersBuilder,
                              )),
                        ),
                      ),
                      agendamentosDay.isEmpty
                          ? Container()
                          : Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Container(
                                  margin:
                                      EdgeInsets.only(top: 20, bottom: 0, left: 15),
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    &quot;Agendamentos para o dia selecionado&quot;,
                                    style: TextStyle(
                                        fontSize: 24,
                                        color: Colors.black87,
                                        fontWeight: FontWeight.w300),
                                  ),
                                ),
                                Container(
                                  margin:
                                      EdgeInsets.only(top: 40.0, left: 50, right: 50),
                                  child: ListView.separated(
                                      shrinkWrap: true,
                                      primary: false,
                                      itemCount: agendamentosDay.length,
                                      padding: EdgeInsets.all(20.0),
                                      separatorBuilder:
                                          (BuildContext context, int index) =&gt;
                                              Container(
                                                  height: 1.0,
                                                  color: CustomsColors.customYellow),
                                      itemBuilder: (BuildContext context, int index) {
                                        return ListTile(
                                          contentPadding: EdgeInsets.only(
                                              top: 10.0,
                                              left: 15.0,
                                              right: 15.0,
                                              bottom: 10),
                                          leading: Icon(
                                            FontAwesomeIcons.calendarCheck,
                                            color: CustomsColors.customYellow,
                                            size: 40.0,
                                          ),
                                          title: new Text(
                                            agendamentosDay[index].title,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 22),
                                          ),
                                          subtitle: Column(
                                            crossAxisAlignment:
                                                CrossAxisAlignment.start,
                                            children: [
                                              new Text(
                                                'Nome do solicitante: ' +
                                                    agendamentosDay[index].user.name,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                'Telefone: ' +
                                                    agendamentosDay[index].user.phone,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                'Email: ' +
                                                    agendamentosDay[index].user.email,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                'Endereço: ' +
                                                    agendamentosDay[index].user.city +
                                                    ', ' +
                                                    agendamentosDay[index]
                                                        .user
                                                        .state +
                                                    ', ' +
                                                    agendamentosDay[index]
                                                        .user
                                                        .country,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                'Gênero: ' +
                                                    agendamentosDay[index]
                                                        .user
                                                        .gender,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              Container(
                                                width: 300,
                                                child: Divider(
                                                    thickness: 1,
                                                    color:
                                                        CustomsColors.customYellow),
                                              ),
                                              new Text(
                                                agendamentosDay[index].atendente,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                agendamentosDay[index].horario,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                              new Text(
                                                formatDate(
                                                    agendamentosDay[index].data,
                                                    [dd, '/', mm, '/', yyyy]),
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: 18),
                                              ),
                                            ],
                                          ),
                                          onTap: () {},
                                        );
                                      }),
                                  decoration: BoxDecoration(
                                      color: Colors.white,
                                      borderRadius: BorderRadius.circular(10.0),
                                      border: Border.all(
                                          color: CustomsColors.customYellow)),
                                ),
                              ],
                            ),
                      agendamentosMes.isEmpty
                          ? Container()
                          : Container(
                              margin: EdgeInsets.only(top: 20, bottom: 0, left: 15),
                              alignment: Alignment.centerLeft,
                              child: Text(
                                &quot;Todos os agendamentos neste mês&quot;,
                                style: TextStyle(
                                    fontSize: 24,
                                    color: Colors.black87,
                                    fontWeight: FontWeight.w300),
                              ),
                            ),
                      agendamentosMes.isEmpty
                          ? Container()
                          : Container(
                              margin: EdgeInsets.only(top: 40.0, left: 50, right: 50),
                              child: ListView.separated(
                                  shrinkWrap: true,
                                  primary: false,
                                  itemCount: agendamentosMes.length,
                                  padding: EdgeInsets.all(20.0),
                                  separatorBuilder:
                                      (BuildContext context, int index) =&gt; Container(
                                          height: 1.0,
                                          color: CustomsColors.customYellow),
                                  itemBuilder: (BuildContext context, int index) {
                                    return ListTile(
                                      contentPadding: EdgeInsets.only(
                                          top: 10.0,
                                          left: 15.0,
                                          right: 15.0,
                                          bottom: 10),
                                      leading: Icon(
                                        FontAwesomeIcons.calendarCheck,
                                        color: CustomsColors.customYellow,
                                        size: 40.0,
                                      ),
                                      title: new Text(
                                        agendamentosMes[index].title,
                                        style: TextStyle(
                                            color: Colors.black87, fontSize: 22),
                                      ),
                                      subtitle: Column(
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          new Text(
                                            'Nome do solicitante: ' +
                                                agendamentosMes[index].user.name,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            'Telefone: ' +
                                                agendamentosMes[index].user.phone,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            'Email: ' +
                                                agendamentosMes[index].user.email,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            'Endereço: ' +
                                                agendamentosMes[index].user.city +
                                                ', ' +
                                                agendamentosMes[index].user.state +
                                                ', ' +
                                                agendamentosMes[index].user.country,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            'Gênero: ' +
                                                agendamentosMes[index].user.gender,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          Container(
                                            width: 300,
                                            child: Divider(
                                                thickness: 1,
                                                color: CustomsColors.customYellow),
                                          ),
                                          new Text(
                                            agendamentosMes[index].atendente,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            agendamentosMes[index].horario,
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                          new Text(
                                            formatDate(agendamentosMes[index].data,
                                                [dd, '/', mm, '/', yyyy]),
                                            style: TextStyle(
                                                color: Colors.black87, fontSize: 18),
                                          ),
                                        ],
                                      ),
                                      onTap: () {},
                                    );
                                  }),
                              decoration: BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: BorderRadius.circular(10.0),
                                  border:
                                      Border.all(color: CustomsColors.customYellow)),
                            ),
                      _selectedHour != null &amp;&amp; _selectedDay != null
                          ? Container(
                              height: 75,
                            )
                          : Container(),
                      _selectedHour == null ? Container(height: 400) : Container(),
                    ])),
                  ]),
                ),
               
  &quot;&quot;
  </code></pre>