Feature 4.3 Juan David Salguero & ________ - ISIS3510-MOBILE-T34/T34-Wiki-SpendiQ GitHub Wiki

New Feature: Detailed Graph View with Time Frame Persistence

Overview

We have implemented a new feature in our application: a Detailed Graph View that allows users to explore their financial data in more depth. This view provides an interactive chart with customizable time frames and additional insights into the user’s financial trends.

Key Features

  • Interactive Chart: Users can select different time frames to view their balance over time.
  • Time Frame Persistence: The selected time frame is remembered across sessions using local storage, enhancing user experience by recalling their preferences.
  • Additional Insights: The view displays key financial metrics such as Total Balance Change and Average Daily Balance, each presented in separate cards for clarity.

Detailed Description

1. Detailed Graph View

The Detailed Graph View is a new interface that presents a detailed line chart of the user’s balance over time, along with additional financial insights.

Time Frame Picker

  • Implementation: A picker control allows users to select from various time frames (e.g., “1 Day”, “1 Week”, “1 Month”, etc.).
  • Persistence with Local Storage: The selected time frame is saved using local storage (UserDefaults), so when the user returns to the view, their last selected time frame is automatically loaded.

Interactive Chart

  • Implementation: Utilizes SwiftUI’s Chart framework to display a line chart of the user’s balance.
  • Customization: The chart updates based on the selected time frame, fetching data accordingly.
  • Axis Formatting: Customizes the X and Y axes for better readability, including date formatting and currency formatting without scientific notation.

2. Insights View

This subview presents additional financial insights to the user, with each insight displayed in its own card for better visual separation.

  • Total Balance Change: Shows the change in balance over the selected time frame, including the date range.
  • Average Daily Balance: Calculates and displays the average daily balance over the selected period.

3. Reusable Card View

A reusable component for displaying content within a card-like UI element, ensuring consistent styling and layout across different insights.

How It Enhances the Application

  • Improved Data Visualization: Provides users with a detailed and interactive way to visualize their financial data over various periods.
  • User Personalization: Remembers user preferences for time frames, making the app more user-friendly.
  • Actionable Insights: Offers key financial metrics that can help users make informed decisions about their finances.

Implementation Details

Persistence with Local Storage

  • Purpose: To store the user’s selected time frame so that it persists between sessions.
  • Usage: Reading from and writing to UserDefaults is done whenever the user changes the time frame.

Data Fetching and Formatting

  • BalanceViewModel: Fetches and processes transaction data based on the selected time frame.
  • Date and Currency Formatting: Ensures dates and amounts are displayed in a user-friendly format, avoiding scientific notation and improving readability.

Conclusion

This new feature significantly enhances the user’s ability to interact with and understand their financial data within the application. By providing a detailed graph view with time frame persistence and additional insights, we offer a more personalized and informative experience that can help users make better financial decisions.

NOTE: UI is yet to be upgraded and enhanced for better user experience

image