Codex 不能读取 Figma 文件链接，只能接收：截图 + Figma 标注参数清单，再输出 OC 代码。 产出：纯代码 UI，无 Storyboard / Xib，适合你 Flutter 项目里的 iOS 原生页面（MethodChannel 页面）

一、Figma 先提取全部开发数据

1. 选中页面元素 → 右侧【Inspect 检查】

复制每一项：

• X、Y、width、height（单位 pt，375pt 设计稿）
• Fill 背景色十六进制 #xxxxxx
• Font：字号、字重、颜色
• Corner radius 圆角
• 边框、阴影参数

2. 导出 iOS 切图

选中图片 → Inspect → Export 导出选项：

格式 PNG，倍数：@2x、@3x

命名：英文小写，无中文空格，例：btn_meditate 导入 Xcode → Assets.xcassets → 新建 Image Set，分别拖入 @2x、@3x。

二、Codex / Cursor OC 专用万能提示词（直接复制）

你是资深iOS Objective‑C工程师。

硬性约束：

1、只输出 Objective‑C UIKit代码，禁止任何Swift；

2、ARC自动内存管理，最低部署iOS15+；

3、纯代码构建UI，禁止Storyboard、Xib；

4、优先AutoLayout布局，不要大量硬编码frame坐标；

5、色值、尺寸严格按照下面Figma标注；

6、图片资源已经放到Xcode Assets.xcassets；

7、代码添加中文注释，空值防护；

8、输出完整 .h 和 .m 文件；

9、最后列出图片清单、运行注意事项。

===== Figma标注数据 =====

页面名称：冥想首页

背景色：#F7F9FC

1、UILabel 标题

    X:20, Y:90, width:335, height:44

    text: 正念冥想

    字体：系统粗体 28pt，文字颜色:#1A1A1A

2、UIButton 开始按钮

    X:20, Y:420, width:335, height:56

    背景色:#5271FF，圆角半径:28

    按钮文字：开始冥想，白色，字号18

    点击事件：打印日志

图片资源列表：

btn_meditate

三、Cursor 编辑器本地操作步骤（最推荐）

1. Cursor 打开你的 Flutter iOS 项目文件夹
2. 打开文件：ios/Runner/ViewController.m
3. 侧边 AI 输入上面提示词，同时上传 Figma 页面截图
4. AI 直接在当前文件生成 OC UI 代码
5. 保存 → 打开 Xcode 编译调试

Cursor 快捷精简指令（选中.m文件直接发）

只用Objective‑C，UIKit纯代码，AutoLayout，不要xib/storyboard。

参考截图生成冥想首页。

背景色 #F7F9FC，标题文字"正念冥想"，底部蓝色圆角按钮。

图片资源名称 btn_meditate。按钮添加点击事件。

四、一份生成出来的成品 OC 示例代码

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    self.view.backgroundColor = [self colorWithHexString:@"#F7F9FC"];

    [self buildUI];

}

- (void)buildUI{

    //标题

    UILabel *titleLabel = [[UILabel alloc]init];

    titleLabel.text = @"正念冥想";

    titleLabel.font = [UIFont boldSystemFontOfSize:28];

    titleLabel.textColor = [self colorWithHexString:@"#1A1A1A"];

    titleLabel.translatesAutoresizingMaskIntoConstraints = NO;

    [self.view addSubview:titleLabel];

    

    //按钮

    UIButton *startBtn = [UIButton buttonWithType:UIButtonTypeSystem];

    [startBtn setTitle:@"开始冥想" forState:UIControlStateNormal];

    startBtn.titleLabel.font = [UIFont systemFontOfSize:18];

    [startBtn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

    startBtn.backgroundColor = [self colorWithHexString:@"#5271FF"];

    startBtn.layer.cornerRadius = 28;

    startBtn.translatesAutoresizingMaskIntoConstraints = NO;

    [startBtn addTarget:self action:@selector(startClick:) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:startBtn];

    

    //AutoLayout约束

    [NSLayoutConstraint activateConstraints:@[

        titleLabel.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor constant:20,

        titleLabel.topAnchor constraintEqualToAnchor:self.view.topAnchor constant:90,

        titleLabel.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor constant:-20,

        

        startBtn.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor constant:20,

        startBtn.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor constant:-20,

        startBtn.topAnchor constraintEqualToAnchor:titleLabel.bottomAnchor constant:200,

        startBtn.heightAnchor constraintEqualToConstant:56,

    ]];

}

-(void)startClick:(UIButton *)sender{

    NSLog(@"点击了开始冥想按钮");

}

//十六进制颜色工具

-(UIColor *)colorWithHexString:(NSString *)hex{

    NSString *cString = [[hex stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]] uppercaseString];

    if ([cString hasPrefix:@"#"]) cString = [cString substringFromIndex:1];

    unsigned int rgbValue = 0;

    NSScanner *scanner = [NSScanner scannerWithString:cString];

    [scanner scanHexInt:&rgbValue];

    return [UIColor colorWithRed:((rgbValue & 0xFF0000) >> 16)/255.0 green:((rgbValue & 0xFF00) >> 8)/255.0 blue:(rgbValue & 0xFF)/255.0 alpha:1.0];

}

@end

五、生成 UI 后对接 Flutter‑MethodChannel 追加提示词

在当前ViewController.m添加Flutter MethodChannel通道，通道名称 com.meditation/page,

点击开始冥想按钮，发送回调通知给Flutter Dart端。