Graphic representation for current cycle phase

[EmmaTellblom]

Title

Add Graphical Representation of Menstrual Cycle Phases

Description

To enhance user experience and provide better insights into their menstrual cycle, I propose adding a graphical representation that visually indicates the current phase of the user's cycle. This feature will help users understand whether they are in their luteal phase, expecting their period soon, or in the follicular phase.

Objectives

• Visual Representation: Provide a clear and intuitive graphical representation of the menstrual cycle.
• Cycle Phases: Clearly indicate the different phases of the cycle (Menstruation, Follicular Phase, Ovulation and Luteal Phase).
• Current Position: Highlight the user's current position within their cycle based on their tracked data.

Cycle Phases

• Menstruation: Starts on the first day of the period.
• Follicular Phase: Begins directly after menstruation ends and ends with ovulation.
• Ovulation: Typically occurs mid-cycle and is the phase when an egg is released.
• Luteal Phase: Follows ovulation and ends when the next period begins.

User Data

• Calculate the user's current cycle day based on the latest period start date.
• Use the average cycle length and period length to predict the phases, or allow for user-defined calculations.

Graphical Elements

• Cycle Wheel/Chart: A circular or linear chart that displays the cycle phases.
• Current Day Indicator: A marker that shows the user's current day in the cycle.
• Color Coding: Different colors for each phase to enhance visual distinction.
• Phase Labels: Text labels indicating each phase (e.g., "Follicular Phase," "Ovulation," etc.).

User Interface

• Integrate the graphical representation within the main view or a dedicated section for cycle insights.
• Ensure the design is responsive and accessible for all users.

Technical Requirements

• Data Retrieval
• Graphical Rendering: Use Jetpack Compose or any suitable library for rendering the graphical elements.

Mockup/Examples

• Attach any mockups or sketches that visualize the proposed graphical representation.
• Provide examples from similar apps if applicable.

Benefits

• Helps users better understand their menstrual cycle phases.
• Provides a visual and intuitive way to track their cycle.

[EmmaTellblom]

I like the layout of this. Maybe we can do something similar but clearly mark the different phases?