build method

Implementation

@override
/// Builds the About App page which provides information about the application.
///
/// The page includes a navigation bar with a title, a background image with a
/// description text overlaid, and multiple sections describing the app's
/// goals, vision, and message. Each section is displayed in a column layout
/// within a scrollable view.
Widget build(BuildContext context) {
  final tr = AppLocalizations.of(context)!;

  return CupertinoPageScaffold(
    /// The navigation bar shows the title and provides a back button to
    /// return to the home page.
    navigationBar: CupertinoNavigationBar(
      middle: Text(tr.infoAboutUs),
      enableBackgroundFilterBlur: true,
    ),

    /// The main content of the page is a scrollable view containing a
    /// background image with a description text overlaid, and multiple
    /// sections describing the app's goals, vision, and message.
    child: SingleChildScrollView(
      child: Column(
        children: [
          /// The background image with a description text overlaid.
          Stack(
            alignment: Alignment.center,
            children: [
              /// The background image is a PNG asset loaded from the
              /// project's assets directory.
              Image.asset(
                AppConstants.handPNG,
                fit: BoxFit.cover,
                width: double.infinity,
              ),

              /// The description text is displayed centered and bold.
              Text(
                tr.aboutUs_description,
                textAlign: TextAlign.center,
                style: const TextStyle(
                  fontSize: 16,
                  fontWeight: FontWeight.bold,
                  color: CupertinoColors.white,
                ),
              ),
            ],
          ),

          /// The section describing the app's goals.
          ArticleSectionComponent(
            title: tr.ourGoals,
            description: tr.ourGoals_description,
            useButton: false,
            color: AppConstants.primarySectionColor,
            onPressed: () {},
          ),

          /// The section describing the app's vision.
          ArticleSectionComponent(
            title: tr.ourVision,
            description: tr.ourVision_description,
            onPressed: () {},
          ),

          /// The section describing the app's message.
          ArticleSectionComponent(
            title: tr.ourMessage,
            description: tr.ourMessage_description,
            onPressed: () {},
            color: AppConstants.primarySectionColor,
          ),
        ],
      ),
    ),
  );
}