build method

  1. @override
Widget build(
  1. BuildContext context
)
override

Builds the UI for the send screen.

Returns a Scaffold widget that contains a Column with two children:

Implementation

@override
Widget build(BuildContext context) {
  return Scaffold(
    // Set the background color of the scaffold.
    backgroundColor: Constants.backColor,
    // Build the body of the scaffold.
    body: Column(
      // Align the children vertically to the center.
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        // Build the file picking and dragging UI.
        Center(
          child: Stack(
            children: [
              // Build the gesture detector.
              GestureDetector(
                // Handle file picking when the user taps.
                onTap: openFilePicker,
                // Handle file dragging.
                child: DropTarget(
                  // Add the selected files to the list when the user drops files.
                  onDragDone: (detail) {
                    setState(() {
                      _list.addAll(detail.files);
                    });
                  },
                  // Show the add icon when the user drags files over the drop area.
                  onDragEntered: (detail) {
                    setState(() {
                      _dragging = true;
                    });
                  },
                  // Hide the add icon when the user stops dragging files.
                  onDragExited: (detail) {
                    setState(() {
                      _dragging = false;
                    });
                  },
                  // Build the drop area UI.
                  child: Column(
                    children: [
                      // Build the circular container for the drop area.
                      Container(
                        height: 200,
                        width: 200,
                        decoration: const BoxDecoration(
                            shape: BoxShape.circle,
                            color: Constants.textColor),
                        // Show the add icon when the user is dragging files.
                        child: _dragging
                            ? const Center(
                                child: Icon(
                                  Icons.add_rounded,
                                  color: Constants.highlightColor,
                                  size: 200,
                                ),
                              )
                            // Show the upload icon when the user is not dragging files.
                            : const Center(
                                child: Icon(
                                  Icons.upload_rounded,
                                  color: Constants.highlightColor,
                                  size: 200,
                                ),
                              ),
                      ),
                      // Add some spacing between the drop area and the send button.
                      const SizedBox(height: 16),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
        // Build the send button.
        ElevatedButton(
          style: ElevatedButton.styleFrom(
            // Set the background color of the button.
            backgroundColor: Constants.textColor,
            // Set the text color of the button.
            foregroundColor: Constants.backColor,
            // Set the shape of the button.
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20),
            ),
          ),
          // Trigger the transfer when the user presses the button.
          onPressed: () {
            _startTransfer();
          },
          // Set the text of the button.
          child: const Text("Send"),
        ),
      ],
    ),
  );
}