generateFigmaUi static method

String generateFigmaUi(Map<String, dynamic> frameNode, String className)

Entry point for generating the UI part of the Figma screen

Implementation

static String generateFigmaUi(Map<String, dynamic> frameNode, String className) {
  final children = frameNode['children'] as List<dynamic>? ?? [];

  // 1. Separate Bottom Navigation if present (using relative coordinates)
  final frameBox = frameNode['absoluteBoundingBox'];
  final frameY = frameBox?['y'] ?? 0.0;
  final frameHeight = frameBox?['height'] ?? 812.0;

  Map<String, dynamic>? navNode;
  final otherChildren = <dynamic>[];

  for (final child in children) {
    final box = child['absoluteBoundingBox'];
    final name = child['name'].toString().toLowerCase();
    final relativeY = (box?['y'] ?? 0.0) - frameY;

    // Only consider it a nav bar if it's at the very bottom AND named like a nav/bar
    if (box != null &&
        relativeY > frameHeight * 0.85 &&
        (name.contains('nav') || name.contains('tab bar') || name.contains('bottom'))) {
      if (navNode == null) {
        navNode = child;
        continue;
      }
    }
    otherChildren.add(child);
  }

  final bodyContent = otherChildren.map((child) => _parseNode(child)).where((e) => e.isNotEmpty).join('\n');
  final backgroundColor = _parseColor(frameNode['backgroundColor']);
  final navContent = navNode != null ? _parseNode(navNode) : 'null';

  return '''
  CustomBody(
    title: "${frameNode['name']}",
    isLoading: isLoading,
    backgroundColor: $backgroundColor,
    bottomNavigationBar: $navContent,
    child: SingleChildScrollView(
      child: Padding(
        padding: EdgeInsets.all(20.sp),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            $bodyContent
          ],
        ),
      ),
    ),
  )''';
}