Ground Visual (Flutter) is the cross platform frontend solution for iOS/Android/Web. It allows the user to check the latest or the trend happening on the construction site, look up the fleet information, search the document and update the account.
It is a mock project that doesn't talk to real backends.
The application condenses a collection of photos into a concise visual log, providing insights with the equipment's location range. Additionally, it presents the machine's activities in the form of a histogram.
The application simplifies photo searching for users by providing convenient filters based on date, location, and equipment. Users can easily retrieve specific photos and gain a comprehensive understanding of the equipment's performance and activities within a specific timeframe and geographical context.
The application provides a map view that allows users to check the location of the equipment and its status. Users can also check the equipment's status and location history.
The application supports multiple platforms, including iOS, Android, and web. It also provides a responsive layout that adapts to different screen sizes.
- Generate files and icons from build_runner
flutter pub get; \
flutter pub run build_runner build --delete-conflicting-outputs; \
flutter pub run flutter_launcher_icons -f flutter_launcher_icons-release.yaml; \
flutter pub run flutter_launcher_icons -f flutter_launcher_icons-debug.yaml;
- Apply for Google Map API key from Google Cloud Platform
Gogole Map API key is senstiive information and should not be committed to the repository. Make sure to untrack the file before commiting.
git update-index --skip-worktree android/keys.properties ios/Runner/Keys.swift web/.env
- Replace the Google Map API key in
keys.properties
in theandroid
directory
google_maps_api_key=YOUR_API_KEY
- Build and Install
flutter build apk --release; \
flutter install
- Replace the Google Map API key in
Keys.swift
in theios/Runner
directory
struct Keys {
static let googleMapsApiKey = "YOUR_API_KEY"
}
- Run the app
flutter run
- Replace the Google Map API key in
.env
in theweb
directory
GOOGLE_MAPS_API_KEY=YOUR_API_KEY
and then run build.dart
to update the API key in the index.html
dart build.dart
- Build and launch the web in release mode
flutter run -d chrome --release
Auto-generated by README-AI
Android
File | Summary | Module |
---|---|---|
build.gradle | This code configures the buildscript, repositories, and dependencies for a project, as well as setting the build directory and task for cleaning. | android/build.gradle |
settings.gradle | This code checks for the existence of a local.properties file, loads it, and then applies the app_plugin_loader.gradle file from the flutter SDK path specified in the local.properties file. | android/settings.gradle |
Animation
File | Summary | Module |
---|---|---|
daily_digest_decoration_animation.dart | This code creates a widget that animates the strip widgets to echo the debut of the image slide, using an AnimationController, Animation, RelativeRectTween, and Size imageSize. | lib/landing/digest/widgets/animation/daily_digest_decoration_animation.dart |
daily_digest_slide_animation.dart | This code provides an animation for a slide of an image, using the CachedNetworkImage package. It uses a TweenSequence to animate the debut of the image slide, with a zoom- in effect. It also uses the dart: math package to generate a random start position for the animation. | lib/landing/digest/widgets/animation/daily_digest_slide_animation.dart |
daily_digest_decoration_planner.dart | This code imports packages and creates a class that calculates randomized tweens for horizontal and vertical decorations. It also adjusts the start of the decorations based on the size of the benchmark and the offset. It also creates a random offset and size for the decorations. | lib/landing/digest/widgets/animation/daily_digest_decoration_planner.dart |
daily_digest_animation_controller.dart | This code creates a stateful widget called DailyDigestAnimationController which provides an animation controller with a specified duration in milliseconds and a builder function to create an animated widget. | lib/landing/digest/widgets/animation/daily_digest_animation_controller.dart |
App
File | Summary | Module |
---|---|---|
build.gradle | This code sets up the properties for an Android application, including the Flutter SDK, version code, version name, and Google Maps API key. It also applies the necessary plugins and dependencies, and sets up the build types. | android/app/build.gradle |
ground_visual_app.dart | This code imports packages and components to create a Material App with a responsive layout that displays different pages depending on the device type. | lib/app/ground_visual_app.dart |
Base.lproj
File | Summary | Module |
---|---|---|
LaunchScreen.storyboard | This code is an XML document that defines a storyboard for an iOS app. It includes a view controller with an image view, layout guides, and constraints. It also includes a placeholder for the first responder and a launch image resource. | ios/Runner/Base.lproj/LaunchScreen.storyboard |
Main.storyboard | This code is an XML document that defines a storyboard for an iOS application, with a FlutterViewController as the initial view controller. It includes deployment and plug- in identifiers, as well as layout guides and a background color for the view. | ios/Runner/Base.lproj/Main.storyboard |
Bloc
File | Summary | Module |
---|---|---|
selected_site_bloc.dart | This code imports packages and creates a bloc to take events of selecting date or period, and notify listeners about the selected date range. It also sets the selected site preference and updates the state accordingly. | lib/landing/appbar/bloc/selected_site_bloc.dart |
selected_site_event.dart | This code defines an abstract class' SelectedSiteDateTimeEvent' which is used to handle events related to selecting a site, date, and trend period. It also defines an enum' TrendPeriod' which contains the values for the trend period, and two extensions which are used to convert between the trend period and the number of days | lib/landing/appbar/bloc/selected_site_event.dart |
selected_site_state.dart | This code defines three classes that extend the abstract class SelectedSiteState. SelectedSiteEmpty is an empty state, SelectedSiteAtDate contains a site name, date, and optional chart data, and SelectedSiteAtTrend contains a site name, date range, and period. Each class has a toString() method for printing out the state. | lib/landing/appbar/bloc/selected_site_state.dart |
work_zone_bloc.dart | This code imports packages and creates a WorkZoneBloc class to control the WorkZone widget. It listens to events from the SelectedSiteBloc, DailyWorkingTimeChartBloc, and TrendWorkingTimeChartBloc and uses the WorkZoneMapViewModel and DailyChartBarConverter to search for polygons and camera positions. | lib/landing/map/bloc/work_zone_bloc.dart |
work_zone_map_viewmodel.dart | This code provides a WorkZoneMapViewModel that finds work areas given a site and time, and generates a CameraPosition and Polygon for the work area. It uses the SiteWorkZoneRepository and Cartographer to calculate the CameraPosition and Polygon. | lib/landing/map/bloc/work_zone_map_viewmodel.dart |
work_zone_state.dart | This code defines an abstract class' WorkZoneState' which contains the properties' siteName',' workZone', and' cameraPosition'. It also defines two subclasses,' WorkZoneInitial' and' WorkZonePolygons', which contain additional properties and methods for displaying a map with a default location and zoom level, and representing | lib/landing/map/bloc/work_zone_state.dart |
work_zone_event.dart | This code defines four events related to querying a work zone: SearchWorkZoneAtTime, HighlightWorkZoneOfTime, SearchWorkZoneOnDate, and SearchWorkZoneAtPeriod. Each event takes different parameters to query the work zone, such as a site, date, time, period, and filtered machines. | lib/landing/map/bloc/work_zone_event.dart |
machine_status_event.dart | This code defines two events for the MachineStatusBloc: SearchMachineStatusOnDate and SearchMachineStatueOnTrend. Both events take a siteName and a date / period as parameters and return a list of objects as props. | lib/landing/machine/bloc/machine_status_event.dart |
machine_status_bloc.dart | This code creates a MachineStatusBloc which computes the state of a machine's working time and online notification. It is a singleton which receives events from the SelectedSiteBloc and provides the same copy to the BlocBuilder. It handles events related to selecting a date or a trend period and computes the machine's status accordingly | lib/landing/machine/bloc/machine_status_bloc.dart |
machine_status_viewmodel.dart | This viewmodel provides a way to determine the UI model of the machine working hours and online status by using the MachineWorkingTimeRepository and MachineStatusCommunicator. It can get the machine status at a given date or period and returns a MachineStatusOfWorkingTimeAndOnline object. | lib/landing/machine/bloc/machine_status_viewmodel.dart |
machine_status_state.dart | This code defines two classes, MachineStatusState and MachineStatusOfWorkingTimeAndOnline, which are used to store and track the working times and online statuses of machines. The MachineStatusOfWorkingTimeAndOnline class stores the working times and online statuses of machines in two maps, and provides a toString() method to generate a | lib/landing/machine/bloc/machine_status_state.dart |
timeline_gallery_event.dart | This code defines an abstract class' TimelineGalleryEvent' which is used to create a subclass' LoadingImagesToGallery' which takes a list of' TimelineImageModel' objects and converts them into a format consumable by the Gallery. | lib/landing/timeline/gallery/bloc/timeline_gallery_event.dart |
timeline_gallery_bloc.dart | This code imports packages and creates a TimelineGalleryBloc class which converts an array of TimelineImageModel objects to GalleryItem objects to be displayed in the gallery. | lib/landing/timeline/gallery/bloc/timeline_gallery_bloc.dart |
timeline_gallery_state.dart | This code defines a TimelineGalleryState class which holds a list of GalleryItem objects, and a TimelineGalleryLoaded subclass which emits images of GalleryItem objects to be displayed in the gallery. | lib/landing/timeline/gallery/bloc/timeline_gallery_state.dart |
daily_timeline_bloc.dart | This code imports various packages and creates a DailyTimelineBloc class which controls the logic of displaying timelapse photos in a day. It listens to the SelectedSiteBloc and searches for timeline images at a given site and date. It also navigates to the timeline search page when a cell is tapped. | lib/landing/timeline/daily/bloc/daily_timeline_bloc.dart |
daily_timeline_event.dart | This code defines two events related to displaying timelapse photos in a day: SearchDailyTimelineOnDate, which searches for photos on a given date, and TapDailyTimelineCell, which is triggered when a timestamp cell is tapped. | lib/landing/timeline/daily/bloc/daily_timeline_event.dart |
daily_timeline_state.dart | This code defines the states of the DailyTimelineBloc, which is responsible for displaying timelapse photos in a day. It includes states for loading, loaded, and navigating to the timeline detail page. | lib/landing/timeline/daily/bloc/daily_timeline_state.dart |
Buttons
File | Summary | Module |
---|---|---|
date_button.dart | This code creates a DateButton widget for Flutter which displays a date or period and can invoke another widget for selecting a date or period. It includes customizable parameters such as text style, icon, and icon size. | lib/component/buttons/date_button.dart |
toggle_button.dart | This code creates a ToggleButton widget that allows users to toggle among a few options and execute an action upon selecting a new option. It has customizable parameters such as initialIndex, labels, widthPercent, and height. | lib/component/buttons/toggle_button.dart |
cancel_button.dart | This code creates a CancelButton widget for dismissing a widget without executing a cancel action, such as an alert dialog or bottom sheet. It has a minWidth of 160.0, a height of 40.0, and a primary color from the Theme.of(context).colorScheme. | lib/component/buttons/cancel_button.dart |
confirm_button.dart | This code creates a ConfirmButton widget for Flutter applications, which is a text button with a customizable text label and an action to be executed when pressed. | lib/component/buttons/confirm_button.dart |
Card
File | Summary | Module |
---|---|---|
period_sheet.dart | This code provides a PeriodSheet widget for selecting a certain period and executing an action upon selection. It includes a header tile, a text displaying the selected period, a list of selectable periods, and confirm and cancel buttons. | lib/component/card/period_sheet.dart |
calendar_period_sheet.dart | This code is a widget for selecting a certain date or date range and executing an action upon confirmation. It includes a calendar, trend period selector, and confirm / cancel buttons. | lib/component/card/calendar_period_sheet.dart |
calendar_sheet.dart | This code provides a calendar sheet widget for selecting a certain date or date range, and executing an action upon confirmation. It includes features such as a toggle button for range selection, a table calendar with customizable styles, and confirm and cancel buttons. | lib/component/card/calendar_sheet.dart |
time_range_card.dart | This code provides a widget, TimeRangeCard, which allows users to select a time range at a certain day. It includes a Confirm and Cancel button, and the ending time must be later than the starting time. | lib/component/card/time_range_card.dart |
Component
File | Summary | Module |
---|---|---|
working_time_daily_bar_chart.dart | This code is a widget for a BarChart that updates itself with data streams. It includes features such as a BarTouchData, FlTitlesData, and BarRodMagnifier, which allow users to select and highlight bars and rods, as well as view tooltips. It also includes a BlocProvider that signals a selection of date | lib/landing/chart/date/component/working_time_daily_bar_chart.dart |
working_time_daily_embedded_background.dart | This code creates a widget that provides a linear gradient background from transparent to solid, used together with embedded content. | lib/landing/chart/date/component/working_time_daily_embedded_background.dart |
bar_rod_magnifier.dart | This code provides a function to highlight a bar rod in a Bar Chart by changing its width, height, and color. It iterates through the group data to find the bar rod with the matching group i d and rod i d, and then applies the changes to the found bar rod. | lib/landing/chart/component/bar_rod_magnifier.dart |
working_time_chart.dart | This code displays the working time of a day or a period using BlocBuilder and Flutter widgets. It uses the SelectedSiteBloc and DailyWorkingTimeChartBloc to display the WorkingTimeDailyChart, and the TrendWorkingTimeChartBloc to display the WorkingTimeTrendChart. | lib/landing/chart/component/working_time_chart.dart |
bar_rod_transformer.dart | This code provides an extension to the List < BarChartGroupData > class to iterate through groups and rods, and then apply a transformation to each or selected rods. | lib/landing/chart/component/bar_rod_transformer.dart |
bar_rod_measurement.dart | This code imports packages and mixins to set the width of the bar rod for both the daily and trend bar charts. It also sets the space between the bars in the chart. | lib/landing/chart/component/bar_rod_measurement.dart |
working_time_embedded_chart.dart | This code displays the working time of a day or a period embedded inside the map card. It imports packages from Flutter and Flutter Bloc, and contains two BlocBuilders to build the WorkingTimeDailyChart and WorkingTimeTrendChart. | lib/landing/chart/component/working_time_embedded_chart.dart |
chart_section_with_title.dart | This code provides a widget that generates a chart section with a title, either in a compact or normal mode. It includes a function to generate the chart section with a title, two functions to generate the chart section with a title in either compact or normal mode, and a function to generate the title. | lib/landing/chart/component/chart_section_with_title.dart |
bar_rod_palette.dart | This code provides a BarRodPalette class which allows for the coloring of bar rod stack items with dark and light colors, using the color scheme of the current context. The colorBarRod method is used to copy the rod data and color the stack items accordingly. | lib/landing/chart/component/bar_rod_palette.dart |
digest_working_time_composite_content.dart | This code imports two packages and creates a widget that embeds a digest and chart inside a map card. The digest is placed at the top portion of the embedded content, and the chart is placed at the bottom portion. The widget is stateless and takes two parameters for the aspect ratios of the digest and chart cards. | lib/landing/body/component/digest_working_time_composite_content.dart |
timeline_image_builder.dart | This code provides a mixin to build widgets of an image cell on a timeline. It allows for stamping the image if the status is idling or stationary, and outlining the image if it is highlighted. It also allows for labels to be added to the top left of the image. The image can be either a raster or SVG | lib/landing/timeline/component/timeline_image_builder.dart |
scrollable_view_cursor.dart | This code creates a ScrollableViewCursor widget that is used to control the movement of a timelapse ListView, as well as reflect the movement of the ListView. It includes a SliderTheme that is used to customize the look of the Slider. | lib/landing/timeline/component/scrollable_view_cursor.dart |
Components
File | Summary | Module |
---|---|---|
timeline_photo_downloader.dart | This code displays a row of a machine avatar and a button with an icon and label that shows the number of photos available for download. | lib/landing/timeline/search/components/timeline_photo_downloader.dart |
timeline_sheet_header.dart | This widget provides a header section for the timeline search result sheet, displaying a divider and the number of results. It is built using the Flutter and Flutter Bloc packages. | lib/landing/timeline/search/components/timeline_sheet_header.dart |
timeline_search_filter.dart | This code creates a widget that allows users to refine their search query to certain machines by selecting them from a list. It returns the new filtered machine in the pop result. | lib/landing/timeline/search/components/timeline_search_filter.dart |
search_filter_button.dart | This code creates a SearchFilterButton widget which invokes a callback function when tapped. It also superimposes an indicator on top of the button if provided. | lib/landing/timeline/search/components/search_filter_button.dart |
timeline_visual_search_bar.dart | This code creates a TimelineVisualSearchBar widget which displays the current search query of a site name and date time string. It transitions to the edit mode after tapping the search bar, or transitions to the filter mode after tapping the filter button. | lib/landing/timeline/search/components/timeline_visual_search_bar.dart |
timeline_search_photo_viewer.dart | This code builds a widget for displaying an image and its associated annotations and actions for a selected time period. It includes functions for navigating to a gallery view and opening a gallery dialog, as well as a function for building the image cell widget. | lib/landing/timeline/search/components/timeline_search_photo_viewer.dart |
timeline_edit_search_bar.dart | This widget allows users to edit the date and time in the search query, and transitions to the visual or filter mode after the respective actions. It contains a header with an exit button and a filter button, and a body with date and time edit buttons. | lib/landing/timeline/search/components/timeline_edit_search_bar.dart |
Composite
File | Summary | Module |
---|---|---|
work_zone_composite_card.dart | This code creates a composite widget with a map as the background and an embedded widget at the bottom. It adds bottom padding based on the height of the embedded widget, so that the center of the map moves accordingly. | lib/landing/body/mobile/composite/work_zone_composite_card.dart |
Config
File | Summary | Module |
---|---|---|
Environment.dart | This code creates a function that takes two parameters, a string and a number, and returns a string with the number of characters specified by the number parameter. | lib/config/Environment.dart |
This code creates a function that takes a string and a number as parameters and returns a string with the specified number of characters. |
Converter
File | Summary | Module |
---|---|---|
daily_chart_bar_converter.dart | This code provides a DailyChartBarConverter class which can be used to convert between a DateTime and a groupId and rodId, which represent a point on a daily chart. It also provides methods to calculate the number of groups and rods per day. | lib/landing/chart/converter/daily_chart_bar_converter.dart |
trend_chart_bar_converter.dart | This code provides a TrendChartBarConverter class which computes the DateTime given the groupId and rodId on a trend chart. It imports the dart_date and flutter packages, as well as the selected_site_bloc and injectable packages. It also contains a numOfGroup and daysPerGroup method which | lib/landing/chart/converter/trend_chart_bar_converter.dart |
Daily
File | Summary | Module |
---|---|---|
daily_working_time_chart_state.dart | This code defines a state for a daily working time chart bloc that reflects the loading status of the daily working time and the image corresponding to the touched rod bar. It includes two classes, DailyWorkingTimeDataLoading and DailyWorkingTimeDataLoaded, which indicate the loading in progress and the finish loading of the daily working time data, respectively | lib/landing/chart/bloc/daily/daily_working_time_chart_state.dart |
daily_working_time_chart_event.dart | This code defines two events related to the Daily Working Time Chart: SearchWorkingTimeOnDate and SelectDailyChartBarRod. SearchWorkingTimeOnDate searches for working time data on a given date and site, while SelectDailyChartBarRod selects a bar rod on the daily chart with group and rod information, including site and date information. | lib/landing/chart/bloc/daily/daily_working_time_chart_event.dart |
daily_working_time_chart_bloc.dart | This code imports packages and creates a DailyWorkingTimeChartBloc class which takes events of touching a bar rod on the date chart and emits state of corresponding images, group and rod i d. It also listens to the SelectedSiteBloc and PlayDigestBloc to update the state accordingly. | lib/landing/chart/bloc/daily/daily_working_time_chart_bloc.dart |
Date
File | Summary | Module |
---|---|---|
working_time_daily_chart_viewmodel.dart | This code generates a data model to display a daily chart based on a given configuration. It uses the Random and Math libraries to generate working and idling times for each rod, and creates a BarChartRodData object for each rod. It also generates tooltips and bottom titles for the chart. | lib/landing/chart/date/working_time_daily_chart_viewmodel.dart |
working_time_daily_chart.dart | This widget displays the working and idling time at a date, and can be displayed as a card or embedded in the map card. It uses a Card widget with an AspectRatio and BlocBuilder to build a Stack with a background and foreground. The foreground uses a LayoutBuilder to create a WorkingTimeDailyBarChart with a | lib/landing/chart/date/working_time_daily_chart.dart |
working_time_daily_chart_shimmer.dart | This code imports packages and creates a widget that displays a shimmer animation while fetching data for a WorkingTimeDailyChart. It uses a Card widget with a Stack of Positioned widgets to create the animation, and a Random object to generate the animation's height. | lib/landing/chart/date/working_time_daily_chart_shimmer.dart |
Di
File | Summary | Module |
---|---|---|
di.dart | This code configures injection for the GetIt package, allowing for the injection of dependencies into the application. | lib/di/di.dart |
app_module.dart | This code imports the Fluro and Routes packages, and uses the Injectable module to configure the app router and StreamingSharedPreferences instance. | lib/di/app_module.dart |
Dialog
File | Summary | Module |
---|---|---|
decorated_dialog.dart | This code creates a DecoratedDialog widget that allows for customization of an icon at the header of the Dialog. It includes a title, description, and an OK button to close the Dialog. The widget is designed with a rounded rectangle border, a surface color, and a box shadow. | lib/component/dialog/decorated_dialog.dart |
dialog_config.dart | This mixin provides a configuration for a web dialog, setting the width to 600 and the height to 700. | lib/component/dialog/dialog_config.dart |
Drawing
File | Summary | Module |
---|---|---|
clip_shadow_path.dart | This code provides a widget, ClipShadowPath, which adds a boxShadow to a ClipPath. It uses a CustomPainter to draw the shadow and a CustomClipper to clip the path. | lib/component/drawing/clip_shadow_path.dart |
Extensions
File | Summary | Module |
---|---|---|
scoped.dart | This code uses the ScopingFunctions extension to add the' let' and' also' functions to a generic type. It then uses these functions to add a key- value pair to a Map, and to get the number of keys in the Map. | lib/extensions/scoped.dart |
collection.dart | This code defines an extension on Iterable objects that provides methods for retrieving elements from the Iterable, mapping elements, and mapping elements with their indices. It also provides a method for returning null if the Iterable is empty or the requested element is out of bounds. | lib/extensions/collection.dart |
stream_logger.dart | This code provides two extensions, StreamLog and FutureLog, which allow for logging of events and values for Streams and Futures respectively. The logging includes listening, events, done, cancelled, and errors. | lib/extensions/stream_logger.dart |
date.dart | This code imports the' dart_date' and' flutter / material' packages, and provides two extensions to the DateTime and DateTimeRange classes. The ToString extension provides methods to convert DateTime objects to strings in various formats, such as' Today',' MMM dd', and' MMM dd, yyyy | lib/extensions/date.dart |
color.dart | This code provides an extension to the Flutter Color class, allowing it to be converted to the Charts_flutter Color class for use in charts. | lib/extensions/color.dart |
Fleet
File | Summary | Module |
---|---|---|
fleet_page_body.dart | This code creates a FleetHomePage widget that displays a calendar dialog when a button is pressed. The calendar dialog is created using the CalendarSheet widget from the groundvisual_flutter package, which is imported along with the dart_date and flutter packages. The calendar dialog allows the user to select a date, which is then passed | lib/fleet/fleet_page_body.dart |
Flutter
File | Summary | Module |
---|---|---|
Debug.xcconfig | This code includes two xcconfig files, " Pods-Runner.debug.xcconfig " and " Generated.xcconfig ", which provide configuration settings for the Pods- Runner target in a debug environment. | ios/Flutter/Debug.xcconfig |
Release.xcconfig | This code includes two configuration files, " Pods-Runner.release.xcconfig " and " Generated.xcconfig ", which provide settings and parameters for a project's build process. | ios/Flutter/Release.xcconfig |
AppFrameworkInfo.plist | This code is an XML file containing a Property List( plist) that defines the development region, executable, identifier, version, signature, and minimum operating system version for an application. | ios/Flutter/AppFrameworkInfo.plist |
Images
File | Summary | Module |
---|---|---|
timeline_search_images_bloc.dart | This code imports packages and creates a Bloc that takes in search criteria and outputs a list of TimelineImageModel images. It also includes a function to navigate to a gallery page with the images. | lib/landing/timeline/search/bloc/images/timeline_search_images_bloc.dart |
timeline_search_images_state.dart | This code defines a timeline search images bloc that searches for images of TimelineImageModel that match a query. It emits default images at the beginning, emits images after the search query returns, and highlights an image among the search query returns. | lib/landing/timeline/search/bloc/images/timeline_search_images_state.dart |
timeline_search_images_event.dart | This code defines events related to displaying timelapse photos on a detail page. The events include searching for photos on a given date, highlighting an image, and navigating to a gallery when an image is tapped. | lib/landing/timeline/search/bloc/images/timeline_search_images_event.dart |
Landing
File | Summary | Module |
---|---|---|
landing_home_page.dart | This code imports packages and creates a LandingHomePage class that orchestrates the creation of Blocs used for widgets on the page. It also creates a LandingHomePageBlocComponent class that provides a single instance of the Blocs. | lib/landing/landing_home_page.dart |
Lib
File | Summary | Module |
---|---|---|
main.dart | This code imports the necessary packages and sets up the system UI overlay style before configuring the injection and running the GroundVisualApp. | lib/main.dart |
Machine_status
File | Summary | Module |
---|---|---|
machine_avatar.dart | This code imports packages and components to create a MachineAvatar widget which displays a machine label with an indication of its online status. The status is determined by a stream which reflects the machine's status in real time. | lib/component/machine_status/machine_avatar.dart |
machine_offline_indication.dart | This code creates a widget that displays an offline indication with a warning message for how long the machine has been offline. It includes a shadow, an offline warning, and a text label with an ellipsis. | lib/component/machine_status/machine_offline_indication.dart |
machine_online_indication.dart | This code creates a MachineOnlineIndication widget which is used to indicate that a machine is online and can send and receive messages. It is positioned at the right bottom corner of the screen and has a shadow effect. It also has a shimmer effect when the shimming parameter is set to true. | lib/component/machine_status/machine_online_indication.dart |
machine_label.dart | This code creates a MachineLabel widget which displays a machine name and online status. It is a StatelessWidget with a Stack containing a shadow and foreground ClipOval. The foreground ClipOval contains the machine name and online status, and is styled according to the Theme of the BuildContext. | lib/component/machine_status/machine_label.dart |
Map
File | Summary | Module |
---|---|---|
work_zone_map_card.dart | This code imports packages and creates a card widget that uses Google Maps to display work zones at a given date or period. It also animates the camera position to the given work zone. | lib/landing/map/work_zone_map_card.dart |
cartographer.dart | This class provides methods to compute the zoom level and focus of a given region or construction zone. It uses the' dart: math' library to calculate the distance between two points, the circumference of a region, and the zoom level based on the circumference. | lib/landing/map/cartographer.dart |
timeline_workzone_map_mixin.dart | This code provides a mixin for displaying a [ WorkZoneMap ] in the timeline search pages, and reacting to [ WorkZoneBloc ] updates such as refreshing based on [ WorkZonePolygons ]'s [ cameraPosition ] and [ workZone ]. | lib/component/map/timeline_workzone_map_mixin.dart |
workzone_map.dart | This code creates a stateful widget that uses Google Maps to show a work zone of polygons. It also includes features such as a camera position, highlighted work zones, and a map controller. Additionally, the code includes a dark and light map style that is set based on the platform brightness. | lib/component/map/workzone_map.dart |
Messenger
File | Summary | Module |
---|---|---|
machine_status_communicator.dart | This code provides a MachineStatusCommunicatorImpl class which queries the online status of a machine by establishing a realtime beacon or querying the database for the last time the device was online. It also provides a 4 second delay and a switch statement to check for a specific machine. | lib/messenger/machine_status_communicator.dart |
Mobile
File | Summary | Module |
---|---|---|
landing_page_mobile_header.dart | This code imports three packages and creates a SliverAppBar widget for a mobile header with a flexible space, title padding, and a background color. | lib/landing/appbar/mobile/landing_page_mobile_header.dart |
landing_page_body.dart | This code builds the body of a landing page for a mobile app, consisting of three widgets: WorkZoneCompositeCard, DailyTimeline, and MachineWorkingTimeList. Depending on the SelectedSiteState, the WorkZoneCompositeCard widget will display either a DigestWorkingZoneCompositeContent or a WorkingTimeEmbedded | lib/landing/body/mobile/landing_page_body.dart |
timeline_gallery_mobile_view.dart | This code builds a mobile view for a timeline gallery, which displays a zoomable image in full screen and allows the user to scroll to the image of their choice. It also includes an app bar with customizable actions. | lib/landing/timeline/gallery/mobile/timeline_gallery_mobile_view.dart |
timeline_search_mobile_page.dart | This code imports various packages and creates a class, _ TimelineSearchMobilePageState, which builds a search page optimized for mobile layout. It includes a Google Map, a search bar, and a list of images. The list of images is scrollable and the page will highlight the image that is at least half visible. | lib/landing/timeline/search/mobile/timeline_search_mobile_page.dart |
timeline_mobile_search_bar.dart | This code creates a widget, TimelineMobileSearchBar, which allows users to specify a date and time range for a search query. It transitions between visual and search edit mode, displaying the current search query in visual mode and allowing users to edit the query in search edit mode. It also allows users to filter the search query by machine details. | lib/landing/timeline/search/mobile/timeline_mobile_search_bar.dart |
root_home_mobile_page.dart | This code creates a mobile layout of the root home page that maintains portrait mode. It includes a PersistentTabController, a BlocProvider, and four screens: LandingHomePage, FleetHomePage, a placeholder for the Document Page, and a placeholder for the Account Page. | lib/app/mobile/root_home_mobile_page.dart |
Mode
File | Summary | Module |
---|---|---|
portrait_mode_mixin.dart | This code provides two mixins to enable portrait- only mode application- wide or on a specific screen. The mixins must be used in the main app widget or a specific screen, respectively, and the build and dispose methods must be called to enable and disable the portrait- only mode. | lib/component/mode/portrait_mode_mixin.dart |
Model
File | Summary | Module |
---|---|---|
digest_image_model.dart | This class provides a model for displaying a digest slide show, containing the current image, the next image, and the time. It also provides a boolean value to check if the model is empty. | lib/landing/digest/model/digest_image_model.dart |
highlighted_bar.dart | This class defines the attributes of a highlighted bar, including the group ID, rod ID, site name, and time. | lib/landing/chart/model/highlighted_bar.dart |
machine_working_time_by_site.dart | This code provides a model for a JSON response containing a list of machines working hours at a site, including the start and end date, duration in seconds, and the machine's working and idling time in seconds. | lib/landing/machine/model/machine_working_time_by_site.dart |
gallery_item.dart | This class provides a model for displaying items in a gallery, with required parameters for a tag and image name, and optional parameters for whether the image is an SVG and a status label. | lib/landing/timeline/model/gallery_item.dart |
Models
File | Summary | Module |
---|---|---|
machine_unit_working_time.dart | This code creates a data model that represents the working and idling time in a certain duration. It includes functions to convert the duration, working, and idling times into hours and formatted hours. It also implements the Equatable class to compare the properties of the model. | lib/models/machine_unit_working_time.dart |
image_resolution.dart | This code imports the' dart: ui' library and defines an enum of image resolutions, along with an extension to get the size of each resolution. | lib/models/image_resolution.dart |
machine_online_status.dart | This code imports packages and creates a data model for a machine's online status, including an enum for the status and a DateTime for when it has been offline. It also includes a method to format the offline time into a string. | lib/models/machine_online_status.dart |
machine_detail.dart | This code defines a class, MachineDetail, which stores basic information about a machine, such as its unique identifier, model, year, brand, and optional nickname. It also provides a method to get the model and year as a single string. | lib/models/machine_detail.dart |
site_work_records.dart | This code defines two models, SiteConstructionZone and UnitConstructionZone, which represent the construction zone of a site over some time. The models are used to serialize and deserialize data from JSON. | lib/models/site_work_records.dart |
image_downloading_model.dart | This code creates a class, ImageDownloadingModel, which stores information about images from a machine, including the machine's ID, the time range of the images, the number of images, and the resolution of the images. | lib/models/image_downloading_model.dart |
zone.dart | This code provides a set of classes and extensions to represent a construction zone composed of multiple regions, each of which is a convex hull of LatLng points. It also provides a set of methods to convert between LatLng points, Regions, and ConstructionZones. | lib/models/zone.dart |
timeline_image_model.dart | This code defines two enums, MachineStatus and MachineActivity, and an extension for each to parse the enum to a string. It also defines a class, TimelineImageModel, which contains the timestamp, working status, and activities of an image. The class also contains a method to get the time string and activity labels. | lib/models/timeline_image_model.dart |
Play
File | Summary | Module |
---|---|---|
daily_digest_viewmodel.dart | This code provides a viewmodel for retrieving cover and digest images, which is stateful and increments the cursor after an image retrieval. It also includes a _ Cursor class to maintain the position of the current image position and reset after reaching the end. | lib/landing/digest/bloc/play/daily_digest_viewmodel.dart |
play_digest_bloc.dart | This code is a Bloc for playing a series of images with a certain interval. It imports various packages and libraries to create a PlayDigestBloc class that listens to a SelectedSiteBloc and processes the selected site state. It also contains a _ playDigestImagePeriodicallyAfterResume method that plays the images after | lib/landing/digest/bloc/play/play_digest_bloc.dart |
play_digest_event.dart | This code defines three events for the PlayDigestBloc: PlayDigestResume, PlayDigestPause, and PlayDigestInitPlayer. Each event takes a site name and date as parameters and extends the PlayDigestEvent class. | lib/landing/digest/bloc/play/play_digest_event.dart |
play_digest_state.dart | This code defines the states of the PlayDigestBloc, which is used to control the playing of a collage of cover images. It includes the PlayDigestInit state, the PlayDigestPausePlaying state which pauses the playing and shows the collage of cover images, the PlayDigestBuffering state which indicates the progress | lib/landing/digest/bloc/play/play_digest_state.dart |
Query
File | Summary | Module |
---|---|---|
timeline_search_query_event.dart | This code defines an abstract class' TimelineSearchQueryEvent' and three subclasses that extend it. Each subclass updates a different aspect of the timeline search query, such as the date range, time range, and selected machines. | lib/landing/timeline/search/bloc/query/timeline_search_query_event.dart |
timeline_search_query_state.dart | This code defines two classes, TimelineSearchQueryInitial and TimelineSearchQueryUpdate, which are used to store and manipulate data related to a timeline search query. The classes contain properties such as dateTimeRange, siteName, filteredMachines, startTime, endTime, and timeRangeEdited. The classes also contain methods to get dateString | lib/landing/timeline/search/bloc/query/timeline_search_query_state.dart |
timeline_search_query_bloc.dart | This code imports packages and creates a TimelineSearchQueryBloc class which stores user search query and enables / disables search criteria as needed. | lib/landing/timeline/search/bloc/query/timeline_search_query_bloc.dart |
Repositories
File | Summary | Module |
---|---|---|
timeline_images_repository.dart | This code provides a repository for fetching a list of TimelineImageModel objects for a group of machines in a given period at a specified site or zone. It also provides mock images and machine statuses and activities for testing purposes. | lib/repositories/timeline_images_repository.dart |
machine_working_time_service.dart | This code provides a MachineWorkingTimeServiceImpl class that fetches the machine working time at a site from the backend using the rootBundle and json.decode methods. It also provides two methods to get the machine working time of recent or a specific date. | lib/repositories/machine_working_time_service.dart |
site_workzone_repository.dart | This code imports packages and creates a repository to provide work zone information at specific times, dates, or over a period of time. It also defines functions to get work zone information for specific sites. | lib/repositories/site_workzone_repository.dart |
current_selected_site.dart | This code provides an implementation of the CurrentSelectedSite abstract class, which allows for the storage and retrieval of a selected site value using StreamingSharedPreferences. It provides methods for setting, getting, and streaming the value. | lib/repositories/current_selected_site.dart |
site_workzone_service.dart | This code provides a service to get the work zone for a specific time, date, or over a period. It imports necessary packages and libraries, and implements the SiteWorkZoneService abstract class. It also provides a method to select a random zone from a JSON collection. | lib/repositories/site_workzone_service.dart |
machine_detail_repository.dart | This code provides a MachineDetailRepositoryImpl class which implements the MachineDetailRepository abstract class. It contains a getMachineDetail() method which takes a machine unique identifier( muid) as an argument and returns a MachineDetail object with the corresponding muid, model, year, manufacturer, and serial number. | lib/repositories/machine_detail_repository.dart |
machine_working_time_repository.dart | This repository provides a way to manage the working time of machines at a site, either by date or period. It uses the MachineWorkingTimeService to fetch the machine working time and converts it to a UnitWorkingTime object. It is implemented as a singleton to avoid duplicated network calls. | lib/repositories/machine_working_time_repository.dart |
Root
File | Summary | Module |
---|---|---|
build.dart | This code imports the' dart: io' and' package: dotenv / dotenv.dart' packages, loads environment variables from a'.env' file, retrieves a Google Maps API key, reads a' index.html' file, replaces a placeholder with the API key, and writes the updated file. | build.dart |
Router
File | Summary | Module |
---|---|---|
routes.dart | This code registers routes and their destinations for a FluroRouter, allowing for navigation between different pages in a Flutter application. | lib/router/routes.dart |
placeholder_navigation_page.dart | This code imports the' package: flutter / material.dart' and' package: groundvisual_flutter / router / bottom_navigation.dart' packages and creates a PlaceholderWidget class which builds a Scaffold widget with an AppBar, Container, and Center widgets. The Container widget contains a Column | lib/router/placeholder_navigation_page.dart |
route_handlers.dart | This code imports packages and creates handlers for a mobile, tablet, and web page. It also creates BlocProviders for the WorkZoneBloc, TimelineSearchImagesBloc, and TimelineSearchQueryBloc. The handlers are used to create the RootHomeMobilePage, RootHomeTabletPage, TimelineSearchMobilePage, Timeline | lib/router/route_handlers.dart |
bottom_navigation.dart | This code implements a persistent bottom navigation bar in Flutter, which keeps the bottom navigation visible when navigating to another route and allows for the navigation to go back until the first page of the tab. It also includes an extension to assign icons and names to the tabs. | lib/router/bottom_navigation.dart |
Runner
File | Summary | Module |
---|---|---|
Keys.swift | This code creates a struct called Keys which contains a static constant called googleMapsApiKey that stores a string value of " YOUR_API_KEY ". | ios/Runner/Keys.swift |
Runner-Bridging-Header.h | This code imports the GeneratedPluginRegistrant.h header file, which is used to register plugins with the Flutter engine. | ios/Runner/Runner-Bridging-Header.h |
AppDelegate.swift | This code imports UIKit, Flutter, and GoogleMaps, and sets up an AppDelegate class to handle the application launch. It also provides instructions for obtaining a Google Maps API key and enabling the iOS SDK API. Finally, it registers the generated plugin with the AppDelegate. | ios/Runner/AppDelegate.swift |
Info.plist | This code is an XML Property List file that contains a dictionary of keys and values used to configure a Flutter application. It includes settings for the development language, executable name, bundle identifier, supported interface orientations, and more. | ios/Runner/Info.plist |
Runner.xcodeproj
File | Summary | Module |
---|---|---|
project.pbxproj | Error generating file summary. | ios/Runner.xcodeproj/project.pbxproj |
Selection
File | Summary | Module |
---|---|---|
date_or_trend_selection_button.dart | This code imports packages and builds a widget that allows users to select a date or trend period for a given site. It displays a button with the current selection, and when clicked, opens a bottom sheet with a calendar to select a date or trend period. | lib/landing/appbar/component/selection/date_or_trend_selection_button.dart |
date_selection_button.dart | This code provides a DateSelectionButton widget which allows users to select a date to display information about the current site. It resets to today when toggling between sites or between date and trend, and updates the SelectedSiteBloc when a new date is selected. | lib/landing/appbar/component/selection/date_selection_button.dart |
trend_period_selection_button.dart | This code provides a widget that allows the user to select a period to display information about a selected site. It selects the last 7 days by default and resets to last 7 days when toggling between sites or between date and trend. When a new period is selected, it updates the SelectedSiteBloc. | lib/landing/appbar/component/selection/trend_period_selection_button.dart |
Site
File | Summary | Module |
---|---|---|
site_dropdown_list.dart | This code creates a dropdown list of four sites( M51, Cresent Blvd, Kensington, Penton Rise) with an icon and text style that is responsive to the device's screen size. When a new site is selected, the BlocProvider is used to update the selected site. | lib/landing/appbar/component/site/site_dropdown_list.dart |
Sliver
File | Summary | Module |
---|---|---|
sliver_appbar_body.dart | This code creates a SliverAppBarContainer widget with a Column child containing an Expanded widget and a Row widget. The Row widget contains a SiteDropDownList and a DayOrTrendSelectionButton. | lib/landing/appbar/mobile/sliver/sliver_appbar_body.dart |
sliver_appbar_container.dart | This code creates a SliverAppBarContainer widget which allows for the expansion and collapse of the app bar content when swiping up or down. It also has an optional parameter which allows the content to stay visible when collapsed. | lib/landing/appbar/mobile/sliver/sliver_appbar_container.dart |
Tablet
File | Summary | Module |
---|---|---|
landing_page_tablet_header.dart | This code builds an AppBar for a landing home page with site and date selections. It includes a SiteDropDownList, DateTrendToggle, and DayOrTrendSelectionButton. | lib/landing/appbar/tablet/landing_page_tablet_header.dart |
landing_page_body.dart | This code imports packages and creates a stateful widget for the tablet version of the Landing Home Page body, which divides itself horizontally into a map zone and an information zone. It contains components such as a digest working time composite content, a daily timeline, and a machine working time list. | lib/landing/body/tablet/landing_page_body.dart |
timeline_tablet_search_bar.dart | This code provides a widget for displaying and editing the date, date range and time range of a search query. It includes a back button, text for the site name, date and time buttons, a vertical divider, a search filter button, and a dialog for selecting the date range and time range. It also updates the work zone map | lib/landing/timeline/search/tablet/timeline_tablet_search_bar.dart |
timeline_search_tablet_page.dart | This code imports packages and creates a stateful widget for a tablet layout search page optimized for displaying images. It includes a Google Map controller, an item positions listener, and a timeline search bar. It also includes a BlocConsumer and a ScrollablePositionedList to display the images. | lib/landing/timeline/search/tablet/timeline_search_tablet_page.dart |
root_home_tablet_page.dart | This code creates a tablet layout of the root home page, which includes a LandingHomePage, FleetHomePage, and two placeholder pages. It also provides a PersistentTabController to manage the navigation between the pages. | lib/app/tablet/root_home_tablet_page.dart |
Test
File | Summary | Module |
---|---|---|
widget_test.dart | This code tests a Flutter widget using the WidgetTester utility to perform interactions such as taps and scrolls, and to verify widget properties. It verifies that the counter starts at 0 and increments when the' +' icon is tapped. | test/widget_test.dart |
Theme
File | Summary | Module |
---|---|---|
app_theme.dart | This code defines the color and font of the Ripple Design System( RDS) for both light and dark mode, including the color scheme, app bar theme, bottom app bar theme, card theme, icon theme, and text theme. | lib/component/theme/app_theme.dart |
Title
File | Summary | Module |
---|---|---|
sliver_appbar_title.dart | This code creates a SliverAppBarTitle widget that displays the name of the selected site depending on the state of the SelectedSiteBloc. | lib/landing/appbar/mobile/title/sliver_appbar_title.dart |
Toggle
File | Summary | Module |
---|---|---|
day_trend_toggle.dart | This code provides a toggle button widget that allows users to switch between displaying information about a site on a certain date or within a certain period, such as the last 7 days. It imports packages for Flutter, Bloc, Date, and Responsive Builder to enable this functionality. | lib/landing/appbar/component/toggle/day_trend_toggle.dart |
Trend
File | Summary | Module |
---|---|---|
working_time_trend_chart.dart | This code imports packages and creates a widget that displays the working and idling time during a certain period. It includes a bar chart with a magnifier, palette, transformer, and measurement. It also includes a tooltip and touch callback that signals the date and time selection. | lib/landing/chart/trend/working_time_trend_chart.dart |
working_time_trend_chart_viewmodel.dart | This code provides a view model for a trend chart that displays working and idling time for a given period. It imports necessary packages and libraries, generates data models, and creates bottom titles, tooltips, and bar rods. | lib/landing/chart/trend/working_time_trend_chart_viewmodel.dart |
working_time_trend_chart_shimmer.dart | This code imports packages and creates a shimmer widget to display before trend data is available. The widget is a card with a row of bars whose number depends on the period, and the height of the bars is randomly generated. | lib/landing/chart/trend/working_time_trend_chart_shimmer.dart |
trend_working_time_chart_state.dart | This code defines two states for the TrendWorkingTimeChartState class, TrendWorkingTimeDataLoading and TrendWorkingTimeDataLoaded, which reflect the loading of trend working time data and the completion of loading, respectively. It also provides methods to copy and transform the data. | lib/landing/chart/bloc/trend/trend_working_time_chart_state.dart |
trend_working_time_chart_event.dart | This code defines two events for the TrendWorkingTimeChart bloc: SearchWorkingTimeOnTrend and SelectTrendChartBarRod. SearchWorkingTimeOnTrend searches for working time data with a given site name and period, while SelectTrendChartBarRod selects a bar rod on the trend chart with group and rod information, including site, date range | lib/landing/chart/bloc/trend/trend_working_time_chart_event.dart |
trend_working_time_chart_bloc.dart | This code imports packages and creates a TrendWorkingTimeChartBloc class which takes events of touching a bar rod on the trend chart and emits state of corresponding images, group and rod i d. It also listens to the SelectedSiteBloc and searches for working time on the trend. | lib/landing/chart/bloc/trend/trend_working_time_chart_bloc.dart |
Web
File | Summary | Module |
---|---|---|
index.html | This code sets up the HTML document for a Flutter project, including setting the base path, meta tags, icons, and a Google Maps API key. It also includes a service worker script and a main.dart.js script. | web/index.html |
landing_page_web_header.dart | This code builds an AppBar for the landing home page on web with site and date selections, including a logo, a SiteDropDownList, a DateTrendToggle, and a DayOrTrendSelectionButton. | lib/landing/appbar/web/landing_page_web_header.dart |
timeline_gallery_web_view.dart | This code imports packages and creates a stateful widget that displays images in a full screen gallery optimized for web, with no zoom or animation. It also includes a header with title and actions, and arrows to navigate between images. | lib/landing/timeline/gallery/web/timeline_gallery_web_view.dart |
timeline_search_web_page.dart | This code imports packages and creates a StatefulWidget for a web page optimized for searching images. It includes a search bar, a map, and a list of images. The page highlights the item with the mouse hover over. | lib/landing/timeline/search/web/timeline_search_web_page.dart |
Widget
File | Summary | Module |
---|---|---|
daily_timeline.dart | This code creates a DailyTimeline widget which displays a list of sampled timelapse images within a day. It includes a ScrollableViewCursor to move the timeline cursor and a TimelineImages widget to display the images. | lib/landing/timeline/daily/widget/daily_timeline.dart |
timeline_images.dart | This code displays a timeline of timelapse images with their timestamps. It imports packages such as' package: flutter / material.dart',' package: flutter_bloc / flutter_bloc.dart', and' package: shimmer / shimmer.dart' to build the timeline. | lib/landing/timeline/daily/widget/timeline_images.dart |
Widgets
File | Summary | Module |
---|---|---|
daily_digest_collage_cover.dart | This code displays a collage of images before playing a digest. It supports 4 or 5 images and uses the CachedNetworkImage package to display them. | lib/landing/digest/widgets/daily_digest_collage_cover.dart |
daily_digest_play_button.dart | This code provides a widget for playing or pausing a digest stream, and shows a circular progress indicator when downloading the image. It also includes a play button with an icon and color scheme based on the current theme. | lib/landing/digest/widgets/daily_digest_play_button.dart |
daily_digest_slide_show.dart | This code displays a digest of daily activity with animation, using a card with a rounded rectangle border, a stack of widgets, and an aspect ratio. The widgets used are DailyDigestCollageCover, DailyDigestSlidePlaying, and DailyDigestPlayButton. | lib/landing/digest/widgets/daily_digest_slide_show.dart |
daily_digest_slide_playing.dart | This code provides a widget for animating the sliding in of the next digest image, and pausing when touching anywhere on the image. It uses the CachedNetworkImage package to display the image, and the Flutter Bloc package to manage the animation state. It also uses the DailyDigestDecorationPlanner to animate decorations on | lib/landing/digest/widgets/daily_digest_slide_playing.dart |
machine_working_time_bar_chart.dart | This code creates a bar chart to display the working and idling time for a machine, with one domain and one tick on the x axis. It uses the' package: charts_flutter / flutter.dart' and' package: flutter / material.dart' packages, as well as' package: ground | lib/landing/machine/widgets/machine_working_time_bar_chart.dart |
machine_working_time_list.dart | This widget displays a list of machines and their working hours and online status, with a legend to indicate working and idling times. It includes a MachineAvatar and MachineWorkingTimeChart to display the data. | lib/landing/machine/widgets/machine_working_time_list.dart |
timeline_gallery_actions.dart | This mixin provides helper functions to build the title and action buttons for a gallery. It includes functions to build the title content, build action buttons, and build icons only. It also includes a function to get the style of the buttons. | lib/landing/timeline/gallery/widgets/timeline_gallery_actions.dart |
timeline_gallery_view_builder.dart | This code mixin builds a photo item in a gallery, capable of building either a SVG or an image asset. It also provides a default item if the item is not found. It sets the initial, min, and max scale of the item, as well as the hero attributes. | lib/landing/timeline/gallery/widgets/timeline_gallery_view_builder.dart |