skills.rest
Envy-7z
Envy-7zCOMMUNITY
Explore all skills by this author →
GitHub

flutter-ui-fix-from-qa

Adjust Flutter widget padding, spacing, and alignment from QA feedback.

Updated Mar 5, 2026
Search Tags:#layout#qa#flutter#spacing#padding#ui fix
One-click install
npx skills add https://github.com/Envy-7z/mobile-agent-skillpack --skill flutter-ui-fix-from-qa
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: flutter-ui-fix-from-qa
Source: https://github.com/Envy-7z/mobile-agent-skillpack/tree/main/skills/flutter-ui-fix-from-qa
Command: npx skills add https://github.com/Envy-7z/mobile-agent-skillpack --skill flutter-ui-fix-from-qa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the challenge of precisely aligning Flutter UI elements with Quality Assurance (QA) feedback, ensuring visual consistency without unnecessary code changes.

Core Features & Use Cases

  • Precise UI Adjustment: Modifies padding, spacing, alignment, and divider constraints to match visual specifications.
  • Minimalist Refactoring: Focuses solely on the necessary UI changes, avoiding broader code refactoring.
  • Design Token Adherence: Prioritizes the use of existing design system tokens and constants.
  • Use Case: A QA engineer reports that a button has too much padding. This Skill can quickly adjust the button's padding to match the design spec without altering the button's functionality or surrounding widgets.

Quick Start

Use the flutter-ui-fix-from-qa skill to adjust the spacing around the login button to match the provided QA screenshot.

Frequently Asked Questions about flutter-ui-fix-from-qa

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix Flutter UI layout issues reported by QA?▼

To fix Flutter UI layout issues from QA feedback, adjust widget properties like padding, spacing, and alignment to match visual specs. This approach ensures visual fidelity by making minimal, targeted changes without unnecessary refactoring.

What is the best way to adjust Flutter padding and spacing to match a screenshot?▼

The best way to adjust Flutter padding and spacing is modifying specific widget constraints to match the provided screenshot. This process prioritizes adhering to existing design system tokens and avoids introducing magic numbers.

Can I fix Flutter alignment issues without refactoring the entire widget tree?▼

Yes, you can fix Flutter alignment issues without broad refactoring by applying minimalist adjustments to targeted widget properties. This ensures visual consistency while leaving the surrounding widgets and functionality intact.

Does fixing Flutter UI spacing require hardcoding magic numbers?▼

No, fixing Flutter UI spacing does not require hardcoding magic numbers. The process adheres to existing design system tokens and constants to maintain visual consistency across the application.

When should I not use targeted widget property changes for UI fixes?▼

You should not use targeted property changes when the QA feedback indicates structural flaws or missing functionality rather than visual discrepancies. This approach is strictly for correcting padding, spacing, and alignment to match specs.

Related Skills

Explore More Software Engineering Skills→
joi-fairsharejoi-fairshare
1

design-mockup-web

Generate responsive HTML mockups from design tokens and specifications.

Community
Advanced
telum-aitelum-ai
2

visual-testing-mobile-flutter

Automate Flutter visual regression testing with Golden Tests, Alchemist, and Fastlane.

Official
Intermediate
HarishwarriorHarishwarrior
58

flutter-tester

Guide Flutter developers in creating, writing, and analyzing unit, widget, and integration tests.

Community
Basic
soq123soq123

recreate-screenshot

Reproduce a UI screen from a screenshot with pixel-perfect fidelity.

Community
Intermediate