Skip to content

[BUG]: Title and Description Alignment for Long Content on PodcastRecorder and PodcastPlayer Screen #1087

Description

@SB2318

Requirement:

Don't blindly follow AI
Apply your Creativity

Description

On the PodcastRecorder and PodcastPlayer screens, long podcast titles and descriptions are not displayed properly. The current layout can cause text overflow, clipping, misalignment, or poor spacing when content exceeds the expected length.

The UI should gracefully handle long text while maintaining a clean and readable layout.

Navigation

Podcasts Screen → Mic →Podcast Form → Podcast Recorder Screen

Current Issues

  • Long titles may overflow or break the layout.
  • Long descriptions can appear misaligned.
  • Text wrapping behavior is inconsistent.
  • UI spacing becomes uneven for larger content.
  • Different screen sizes may exhibit different alignment issues.

Proposed Changes

Title Handling

  • Ensure podcast titles wrap correctly across multiple lines.
  • Prevent text clipping and overflow.
  • Maintain proper alignment with adjacent UI elements.

Description Handling

  • Ensure descriptions wrap naturally within the available width.
  • Maintain consistent padding and spacing.
  • Prevent overlap with action buttons, controls, or metadata.

Responsive Behavior

  • Verify layout across:

    • Small Android devices
    • Large Android devices
    • Tablets
    • Different font scaling settings

Accessibility

  • Support dynamic font sizes.
  • Ensure readability when system font scaling is enabled.

Expected Outcome

  • Long podcast titles display correctly without breaking the layout.
  • Long descriptions remain readable and properly aligned.
  • Consistent appearance across devices and screen sizes.
  • Improved overall podcast recording experience.

Acceptance Criteria

  • Long titles wrap correctly without clipping.
  • Long descriptions wrap correctly without clipping.
  • Text remains properly aligned with surrounding UI elements.
  • No overlap occurs with buttons, controls, or metadata.
  • Layout works correctly on Android and iOS devices.
  • Supports accessibility font scaling without UI breakage.

Metadata

Metadata

Assignees

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions