开源鸿蒙跨平台Flutter开发：基因序列比对基础：Needleman-Wunsch 算法的 Dart 实现

欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net

效果演示

测试参数：

GATTACA

GCATGCU

可以细节放大

GATTACA

GCAAGCU

一、 引言与宏观领域背景

在探索生命科学与计算科学交汇的广袤领域中，基因序列比对（Sequence Alignment）始终占据着至关重要的基石地位。自二十世纪中叶，脱氧核糖核酸（DNA）的双螺旋结构被解明以来，人类便开启了将生命物质转化为离散信息流的宏伟征程。时至今日，无论是次世代测序（Next-Generation Sequencing, NGS）技术的普及，还是对于单核苷酸多态性（SNP）、基因突变以及人类演化路径的深度研究，皆高度依赖于计算机底层提供的高效且准确的序列比对算法。

在计算机科学的视角下，DNA序列可视为由四种基础字符（A、T、C、G）构成的长字符串。所谓的"序列比对"，其本质即为通过特定的数学模型，寻找两个或多个字符串之间在结构与字符层面的最大同源性。这并非简单的字符串全等判定，因为在漫长的生物进化与遗传变异过程中，序列中不可避免地会发生碱基的替换（Substitution）、插入（Insertion）以及缺失（Deletion）。因此，构建一个能够合理评估这些突变事件、并给出最优对齐方案的算法，成为了计算生物学的首要命题。

在一众算法之中，由 Saul Needleman 与 Christian Wunsch 于 1970 年联合提出的 Needleman-Wunsch 算法（下文简称 NW 算法），无疑具有划时代的意义。该算法首次将运筹学中的"动态规划（Dynamic Programming, DP）"思想引入生物信息学，从根本上解决全局序列比对（Global Alignment）的问题。不同于后来出现的基于启发式（Heuristic）以牺牲精度换取速度的 BLAST 算法，NW 算法旨在全域空间内穷举状态，确保能够取得数学意义上的全局最优解。这使得它在处理长度相近、预期存在高度整体同源性的序列对时，依然保持着不可撼动的"黄金标准"地位。

对于致力于构建跨终端医疗与科研基础设施的开发者而言，在移动端及桌面端利用 Flutter 结合 Dart 语言复现该算法，具有深远的工程实践意义。它不仅仅是对传统 C++ 或 Python 生信工具库的一种跨平台移植，更是一种探索：如何在保证极具现代感、流畅交互的用户界面（UI）的同时，处理严密的算法推演与内存调度。在资源受限或需要实时交互的临床诊断辅助系统中，一个原生运行、无须依赖远端算力的序列比对工具，能够极大地提升科研人员的现场分析效率。本研究旨在深刻剖析 NW 算法的数学机理，并详细论述如何基于 Dart 语言，从内存分配、状态转移至历史回溯，构建一个完整的、可视化的全局比对引擎。

二、 序列比对的数学模型与动态规划思想

要精准实现 NW 算法，必须首先确立严谨的数学模型。序列比对问题的本质是在巨大的解空间中搜寻一条"成本最低"或"得分最高"的路径。在这个过程中，动态规划（Dynamic Programming）范式展现出了强大的理论生命力。

2.1 动态规划范式的核心要义

动态规划解决此类复杂问题的基础前提在于问题具备"最优子结构（Optimal Substructure）"和"重叠子问题（Overlapping Subproblems）"的特性。对于序列序列 X X X 和序列 Y Y Y，其最优比对结果必然包含了其前缀序列 X ′ X' X′ 与 Y ′ Y' Y′ 的最优比对结果。通过将一个宏大的比对任务拆解为逐个字符的对比状态，并存储每一个历史状态的最优解，算法得以避免指数级的重复计算。

2.2 打分矩阵与惩罚函数

为了量化不同对齐方式的优劣，我们引入基于生物学经验的打分模型。
:
两个核苷酸字符完全相同，表示在进化过程中该位点得以高度保守，赋予正向得分，例如 +1。
:
两个核苷酸字符不同，代表发生了点突变（替换），应当予以轻度的负向惩罚，例如 -1。
:
为了强行对齐而引入的占位符（通常用"-"表示），代表进化过程中发生的插入或缺失事件，由于此类突变更具破坏性，通常赋予较高的负向惩罚，例如 -1（在更复杂的模型中甚至引入仿射空位罚分）。

2.3 状态转移方程的严格表达

设定序列 A A A 长度为 M M M，序列 B B B 长度为 N N N。我们构建一个二维的状态转移矩阵 F F F，其维度为 ( M + 1 ) × ( N + 1 ) (M+1) \times (N+1) (M+1)×(N+1)。其中， F ( i , j ) F(i,j) F(i,j) 记录的是序列 A A A 的前 i i i 个字符与序列 B B B 的前 j j j 个字符达成最优比对时的极限最高得分。

定义字符匹配判别函数 S ( A i , B j ) S(A_i, B_j) S(Ai,Bj)：

S ( A i , B j ) = { MatchScore , if A i = B j MismatchScore , if A i ≠ B j S(A_i, B_j) = \begin{cases} \text{MatchScore}, & \text{if } A_i = B_j \\ \text{MismatchScore}, & \text{if } A_i \neq B_j \end{cases} S(Ai,Bj)={MatchScore,MismatchScore,if Ai=Bjif Ai=Bj

设定固定的空位罚分为 d d d。基于动态规划的思想，当前状态 F ( i , j ) F(i,j) F(i,j) 必然且仅能由其左上、左方或上方的三个紧邻前驱状态推导而来。于是，NW 算法的核心状态转移方程（Bellman Equation）可严密表示为：

F ( i , j ) = max ⁡ { F ( i − 1 , j − 1 ) + S ( A i , B j ) (对角线来源，字符对齐) F ( i − 1 , j ) + d (上方来源，序列 A 插入空位) F ( i , j − 1 ) + d (左方来源，序列 B 插入空位) F(i,j) = \max \begin{cases} F(i-1, j-1) + S(A_i, B_j) & \text{(对角线来源，字符对齐)} \\ F(i-1, j) + d & \text{(上方来源，序列 A 插入空位)} \\ F(i, j-1) + d & \text{(左方来源，序列 B 插入空位)} \end{cases} F(i,j)=max⎩ ⎨ ⎧F(i−1,j−1)+S(Ai,Bj)F(i−1,j)+dF(i,j−1)+d(对角线来源，字符对齐)(上方来源，序列 A 插入空位)(左方来源，序列 B 插入空位)

该方程彻底定义了全局比对问题在解空间中的向量场走向。由于每一个网格点的计算均依赖于其左上方三角区域内已知点的结果，故而计算机执行时，必须采用严密的从左至右、从上至下的步进扫描遍历策略。

状态方向	对应生物学意义	坐标变动
对角线转移	碱基保守匹配或点突变	( i − 1 , j − 1 ) → ( i , j ) (i-1, j-1) \to (i,j) (i−1,j−1)→(i,j)
垂直转移	序列A由于缺失引入空位	( i − 1 , j ) → ( i , j ) (i-1, j) \to (i,j) (i−1,j)→(i,j)
水平转移	序列B由于缺失引入空位	( i , j − 1 ) → ( i , j ) (i, j-1) \to (i,j) (i,j−1)→(i,j)

三、 Flutter 工程化方案探索与视图基建

在探讨底层算法实现前，有必要对整体前端架构体系进行宏观梳理。基于现代响应式 UI 框架的特性，如何将高度密集的数值运算与刷新极快的渲染管道（Render Pipeline）进行有机分离，是架构设计的重中之重。
启动并寄宿
实例化状态控制器
BioAlignmentApp
+Widget build(BuildContext context)
AlignmentWorkspace
+State createState()
_AlignmentWorkspaceState
-TextEditingController _seq1Ctrl
-TextEditingController _seq2Ctrl
-List<List<int>> _matrix
-List<Point<int>> _path
-String _align1
-String _align2
-int _finalScore
+void _runAlignment()
+Widget _buildMatrixView()
+Widget build(BuildContext context)

在此次实验性工程中，为了保持代码结构的高度内聚以及便于原理剖析，将算法引擎与视图渲染统一收拢在单文件结构中。这种设计虽然在极度庞大的商业项目中并非主流，但在聚焦单一科学算法演示时，能够最大化地减少状态传递的跨域阻力。

界面主题（ThemeData）深度定制了暗色系的基调，背景采用幽深的 Color(0xFF0F172A) 蓝色系黑，配合医疗级的青翠绿 Color(0xFF10B981) 作为主色（Primary Color）。这并非单纯的美学诉求，在生命科学软件或临床监护设备的屏幕人机交互标准中，暗色模式叠加高对比度的发光字符，能够有效降低科研工作者在长时间凝视大量序列数据时产生的视觉疲劳。

而在状态管理层面，考虑到 NW 算法在面对常规长度（数千字符以内）的序列比对时，Dart 虚拟机（Dart VM）通常能在几十毫秒内完成状态树推演，在此采用 Flutter 原生的 setState 进行局部视图重绘已完全足以应对。它直接阻断了引入诸如 BLoC 或 Riverpod 等庞大状态管理框架带来的样板代码冗余，使得对于动态规划矩阵状态追踪的逻辑更为纯粹与直观。

四、 核心模块分解（一）：二维矩阵初始化与内存规约

NW 算法在时间复杂度和空间复杂度上均呈现出 O ( M × N ) O(M \times N) O(M×N) 的严峻挑战。当序列长度扩展至千位甚至万位量级时，一个轻率的矩阵初始化行为可能瞬间触发操作系统的内存溢出（OOM）屏障。

4.1 Dart 语言中的多维数组内存分配

与其他系统级编译语言（如 C 语言中原生的连续内存区块分配）不同，Dart 中的数组（List）在处理二维结构时，实质上是一种"指向列表的列表"。这种内存模型虽然带来了极高的动态扩展弹性，但不可避免地引入了额外的对象头开销和离散的堆内存碎片。

    int rows = s1.length + 1;
    int cols = s2.length + 1;
    
    // 初始化 (M+1)*(N+1) 二维状态矩阵
    List<List<int>> mat = List.generate(rows, (i) => List.filled(cols, 0));

在上述实现中，List.generate 作为一个强大的高阶函数被调用。其外层遍历 rows 次，每一次闭包内使用 List.filled 瞬间开辟一块长度为 cols 且初值为 0 的内存切片。这种方式在规避了低效的 for 循环追加（add）操作的同时，亦有效防止了由于浅拷贝引发的多行数据内存指针相互污染的问题。

4.2 边界罚分初始化逻辑

任何动态规划问题都必须存在严密的边界条件支撑。在 NW 算法中，矩阵的第 0 行和第 0 列分别代表着"其中一条序列为空序列，而另一条序列不断延伸"的物理状态。

    // 边界条件初始化（处理与空序列比对时的持续 Gap 罚分）
    for (int i = 0; i < rows; i++) mat[i][0] = i * gapPenalty;
    for (int j = 0; j < cols; j++) mat[0][j] = j * gapPenalty;

由于要对齐一条长度为 i i i 的序列与一条空序列，唯一的方法是连续引入 i i i 个空位。因此，边界坐标 ( i , 0 ) (i, 0) (i,0) 与 ( 0 , j ) (0, j) (0,j) 的得分直接表现为线性递增的惩罚累加（如 0 , − 1 , − 2 , − 3 ... 0, -1, -2, -3 \dots 0,−1,−2,−3...）。这两排基础数据的建立，为后续所有处于内部网格的极值判定奠定了不可动摇的数学基石。

五、 核心模块分解（二）：状态转移、极值判定与计算核心

算法的中枢神经系统在于双层嵌套循环内对于每一个 mat[i][j] 网格的取值计算。此处直接体现了动态规划中对最优子结构的利用------当前位置只关心它紧邻的三个历史最优状态。

    // 动态规划：遍历填充矩阵状态
    for (int i = 1; i < rows; i++) {
      for (int j = 1; j < cols; j++) {
        // 计算三种前驱状态的得分
        int match = mat[i-1][j-1] + (s1[i-1] == s2[j-1] ? matchScore : mismatchScore);
        int delete = mat[i-1][j] + gapPenalty;
        int insert = mat[i][j-1] + gapPenalty;
        
        // 状态转移：取三者最大值
        mat[i][j] = [match, delete, insert].reduce(max);
      }
    }

在此区域，Dart 虚拟机的执行引擎正处于高强度的指令密集计算期。

1. 字符串偏移量判定 ：需要格外注意的是索引的对齐偏移。在矩阵坐标体系中，行首索引 i i i 表示序列包含 i i i 个字符，因此其对应的字符串内部物理指针必须减去 1，即 s1[i-1] 与 s2[j-1] 进行比对。
2. 三重分位推算 ：
   • match：承接左上方 [i-1][j-1] 的总分，加上当前字符的对比结果。这是一个伴随着比对进度的自然延伸。
   • delete：承接正上方 [i-1][j] 的总分，加上空位惩罚。表示抛弃了 s1 的一个字符。
   • insert：承接正左方 [i][j-1] 的总分，加上空位惩罚。表示在 s2 中强行插入了一个字符占位。
3. 聚合规约与极值提取 ：通过 Dart 语法糖 [match, delete, insert].reduce(max) 进行极其优雅的一行规约。该高阶函数会在底层遍历这三个整型变量，通过传入的标准库 max 函数，安全且确定性地返回其中的最大数值，彻底规避了编写繁琐的 if-else 嵌套逻辑，保障了代码的数学形式美。

六、 核心模块分解（三）：历史指针回溯与对齐路径拼装

若矩阵填充仅是为了获得最终比对的"总得分"，那么算法在推演至网格最右下角 mat[s1.length][s2.length] 时便已终结。然而，在生物信息学分析中，科研人员真正需要的是那条精确标注了变异、插入、缺失情况的"比对路线"。

为此，我们必须执行被称为 Traceback (历史回溯) 的逆向寻路过程。该过程本质上是一个由终局沿着最陡上升梯度逆推至起源 ( 0 , 0 ) (0,0) (0,0) 的微型状态机。
是
否
是
否
是
否
设定起始点 M(row, col)
坐标是否到达原点 (0,0)?
回溯结束，输出最终拼接字符串
M(r,c) 是否来自对角线?
S1取出字符，S2取出字符

r--, c--
M(r,c) 是否来自上方?
S1取出字符，S2置为Gap '-'

r--
S1置为Gap '-'，S2取出字符

c--

由于动态规划矩阵的建立本身就是由前驱状态累加而成，因此我们在回溯时，只需在当前节点对其紧邻的三个方向的"期望理论值"进行逆向校验。

    // 历史回溯寻路 Traceback
    String a1 = "";
    String a2 = "";
    int r = s1.length;
    int c = s2.length;
    List<Point<int>> p = [Point(r, c)]; // 存放渲染路径节点
    
    while (r > 0 || c > 0) {
      if (r > 0 && c > 0 && mat[r][c] == mat[r-1][c-1] + (s1[r-1] == s2[c-1] ? matchScore : mismatchScore)) {
        a1 = s1[r-1] + a1;
        a2 = s2[c-1] + a2;
        r--; c--;
      } else if (r > 0 && mat[r][c] == mat[r-1][c] + gapPenalty) {
        a1 = s1[r-1] + a1;
        a2 = "-" + a2;
        r--;
      } else {
        a1 = "-" + a1;
        a2 = s2[c-1] + a2;
        c--;
      }
      p.add(Point(r, c));
    }

值得深入探讨的是该逻辑树中的 判定优先级设计。当存在多条路径（例如向左走和向上走都能满足当前分值）时，NW 算法理论上允许生成多个平行且得分相同的最优解族。在当前的工业化实现中，代码强制设定了"对角线转移优先"的策略。此举不仅减少了分支歧义，而且在生物学上亦暗示了一种进化论倾向：自然界在发生微观变异时，相较于大规模的片段插入和缺失，保守的点突变更容易被遗传机制所容忍与保留。

对于字符串操作而言，Dart 中的 String 类型本质上是不可变（Immutable）的 UTF-16 字符数组。在此采用的是自右向左的逆向拼装法（例如 a1 = s1[r-1] + a1）。尽管这会在内部触发大量的微型字符串内存重分配动作，但由于回溯过程的线性特征 O ( M + N ) O(M+N) O(M+N)，以及现代 Dart 针对短字符串连接所做的引擎级别极速缓存优化，其性能损耗处于安全域值范围之内。

七、 UI 渲染与交互响应：交互式数据网格的呈现与性能调优

如何在一块有限的屏幕尺寸上，完整呈现由长达数十字甚至上百字符交织而成的浩瀚动态规划网格，是该工程界面设计最为棘手的挑战。强行采用常规的 ListView 难以处理严苛的二维对齐，而复杂的 Table 控件在面对超广角数据时，其内部刚性的布局树算法会引发灾难性的布局帧耗时（Layout Phase Spike）。

7.1 InteractiveViewer 的降维打击

经过权衡，工程摒弃了传统的约束性组件，直接采用了 InteractiveViewer 对底层的纯 Row 与 Column 堆叠组合进行包裹。

InteractiveViewer 作为 Flutter 框架下基于三维变换矩阵的高级交互容器，赋予了其子树组件无边界的自由平移与缩放（Pinch-to-Zoom）特权。它通过在视图层（View Layer）拦截手势指针（Pointer Event），并动态修改内部的 4x4 变换矩阵，使得庞大的数据网格能够在不受外部视窗（Viewport）强制裁剪干预的情况下自由伸展。

    return InteractiveViewer(
      constrained: false, // 解除子组件的强制尺寸约束
      boundaryMargin: const EdgeInsets.all(80),
      minScale: 0.1,      // 允许极度缩小以俯视全局
      maxScale: 3.0,      // 允许局部放大观测细节
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: rows,
      ),
    );

7.2 高性能网格单元渲染

对于数以百计乃至千计的单元格绘制，避免使用笨重的复合型 Widget。代码中的 _buildCell 方法严格约束了 UI 节点的深度，仅采用 Container 和 Text 两种最为原初的构建块。

更进一步，矩阵中那些被判定为属于最优回溯路径的坐标点，通过预存的 _path 集合受到特别关照。在视图组装循环中，每当探测到目标坐标位于 _path 之内，单元格便会被赋予高亮度的青色字重和带有些微透明度的背景光晕（Color(0xFF10B981).withOpacity(0.2)）。通过这种严酷且精准的条件分支映射，冰冷的数学推演路径被直接赋予了充满赛博庞克美学和医疗级庄严感的可视化实体，极大地降低了数据校验阶段的认知阻力。

八、 算法性能边界与工业化优化思路扩展

在此，必须对当前 NW 算法实现的工程边界进行严肃的审视。如前文所述，算法对于时间和空间的索取均为 O ( M N ) O(MN) O(MN)。在短序列（长度在 100 字符以内，如引物设计、特定功能结构域分析）的比对中，它的执行时间处于次毫秒级，堪称完美。

然而，若将其直接投入到分析全长达十万级乃至百万级的基因片段时（例如比对整条新冠病毒 RNA 基因组序列，其长度约 30,000 碱基），单纯的二维数组将会瞬间吞噬超过数十 GB 的堆内存（ 30000 × 30000 × 内存对齐开销 30000 \times 30000 \times \text{内存对齐开销} 30000×30000×内存对齐开销），这在移动终端乃至轻型桌面服务器上都是无法承受的灾难。

因此，面向工业界和重装生信分析，NW 算法拥有几个必然的优化延展方向：

1. 空间维度的极限降维 (Space Optimization)
   若具体场景仅仅要求取得最高得分而不要求输出具体的序列拼接路径，我们敏锐地观察状态转移方程即可发现：任何第 i i i 行状态的求值，仅仅依赖于第 i − 1 i-1 i−1 行的上一手数据。因此，庞大的二维矩阵可以被无情地坍缩并复用为两条一维数组，将其空间复杂度从 O ( M N ) O(MN) O(MN) 陡然降低至 O ( min ⁡ ( M , N ) ) O(\min(M, N)) O(min(M,N))，这是一种极其震撼的内存节约策略。
2. 分治法与 Hirschberg 算法介入
   若在极限空间约束下依然需要还原全路径，则必须引入基于分治思想（Divide and Conquer）的 Hirschberg 算法。它结合了前向计算与后向计算寻找矩阵中点，随后对问题进行递归剖分，能够在保证 O ( M N ) O(MN) O(MN) 时间消耗的前提下，以线性的 O ( M + N ) O(M+N) O(M+N) 空间成本输出完整的对齐解。
3. 局部比对（Local Alignment）的范式转移
   在广袤无垠的染色体海洋中寻找一段极短的靶向序列时，强行推行全局比对是违背科学逻辑的。对于这种"大海捞针"的问题，应当对 NW 算法的边界惩罚和负分重置机制进行修改，从而使其演进为大名鼎鼎的 Smith-Waterman (SW) 局部比对算法。

九、 结语

基因序列比对绝非单纯的数据比对游戏，而是生命历史变迁在信息维度上的深度投影。从动态规划的理论滥觞，到打分矩阵的精妙构建，再到利用现代跨端框架对数据流转的精密管控，Needleman-Wunsch 算法的 Dart 实现为我们提供了一个窥探计算生物学底层逻辑的绝佳窗口。

通过本文详尽的推演与极客级代码构建，期望能够为跨平台的数字医疗基础组件建设提供坚实的架构示范。计算没有终点，生命科学的解析也永无止境，如何让代码更加贴近生命的律动，依然是我们长久探索的终极课题。

完整源码

import 'dart:math';
import 'package:flutter/material.dart';

void main() {
  runApp(const BioAlignmentApp());
}

class BioAlignmentApp extends StatelessWidget {
  const BioAlignmentApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Needleman-Wunsch Alignment',
      debugShowCheckedModeBanner: false,
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: const Color(0xFF0F172A),
        colorScheme: const ColorScheme.dark(
          primary: Color(0xFF10B981),
          secondary: Color(0xFF3B82F6),
          surface: Color(0xFF1E293B),
        ),
      ),
      home: const AlignmentWorkspace(),
    );
  }
}

class AlignmentWorkspace extends StatefulWidget {
  const AlignmentWorkspace({super.key});

  @override
  State<AlignmentWorkspace> createState() => _AlignmentWorkspaceState();
}

class _AlignmentWorkspaceState extends State<AlignmentWorkspace> {
  // 默认提供两条典型的短核酸序列作为演示数据
  final TextEditingController _seq1Ctrl = TextEditingController(text: 'GATTACA');
  final TextEditingController _seq2Ctrl = TextEditingController(text: 'GCATGCU');

  // DP 矩阵、回溯路径与比对结果存储
  List<List<int>>? _matrix;
  List<Point<int>>? _path;
  String _align1 = '';
  String _align2 = '';
  int _finalScore = 0;

  // 经典打分模型参数
  final int matchScore = 1;
  final int mismatchScore = -1;
  final int gapPenalty = -1;

  /// 执行 Needleman-Wunsch 全局比对算法
  void _runAlignment() {
    String s1 = _seq1Ctrl.text.toUpperCase().trim();
    String s2 = _seq2Ctrl.text.toUpperCase().trim();
    
    if (s1.isEmpty || s2.isEmpty) return;

    int rows = s1.length + 1;
    int cols = s2.length + 1;
    
    // 初始化 (M+1)*(N+1) 二维状态矩阵
    List<List<int>> mat = List.generate(rows, (i) => List.filled(cols, 0));
    
    // 边界条件初始化（处理与空序列比对时的持续 Gap 罚分）
    for (int i = 0; i < rows; i++) mat[i][0] = i * gapPenalty;
    for (int j = 0; j < cols; j++) mat[0][j] = j * gapPenalty;
    
    // 动态规划：遍历填充矩阵状态
    for (int i = 1; i < rows; i++) {
      for (int j = 1; j < cols; j++) {
        // 计算三种前驱状态的得分
        int match = mat[i-1][j-1] + (s1[i-1] == s2[j-1] ? matchScore : mismatchScore);
        int delete = mat[i-1][j] + gapPenalty;
        int insert = mat[i][j-1] + gapPenalty;
        // 状态转移：取三者最大值
        mat[i][j] = [match, delete, insert].reduce(max);
      }
    }
    
    // Traceback：从右下角向左上角进行历史回溯寻路
    String a1 = "";
    String a2 = "";
    int r = s1.length;
    int c = s2.length;
    List<Point<int>> p = [Point(r, c)];
    
    while (r > 0 || c > 0) {
      // 优先判定是否由对角线（匹配或错配）转移而来
      if (r > 0 && c > 0 && mat[r][c] == mat[r-1][c-1] + (s1[r-1] == s2[c-1] ? matchScore : mismatchScore)) {
        a1 = s1[r-1] + a1;
        a2 = s2[c-1] + a2;
        r--;
        c--;
      } 
      // 否则判断是否是由上方（序列1产生Gap）转移而来
      else if (r > 0 && mat[r][c] == mat[r-1][c] + gapPenalty) {
        a1 = s1[r-1] + a1;
        a2 = "-" + a2;
        r--;
      } 
      // 否则必然是由左方（序列2产生Gap）转移而来
      else {
        a1 = "-" + a1;
        a2 = s2[c-1] + a2;
        c--;
      }
      p.add(Point(r, c));
    }
    
    // 通知 UI 树刷新
    setState(() {
      _matrix = mat;
      _path = p;
      _align1 = a1;
      _align2 = a2;
      _finalScore = mat[s1.length][s2.length];
    });
  }

  /// 构建单个矩阵单元格视图
  Widget _buildCell(String text, {Color color = Colors.white, bool isBold = false, Color bgColor = Colors.transparent}) {
    return Container(
      width: 48,
      height: 48,
      margin: const EdgeInsets.all(2),
      decoration: BoxDecoration(
        color: bgColor,
        border: Border.all(color: color.withOpacity(0.3)),
        borderRadius: BorderRadius.circular(6),
      ),
      alignment: Alignment.center,
      child: Text(
        text, 
        style: TextStyle(
          color: color, 
          fontWeight: isBold ? FontWeight.bold : FontWeight.normal,
          fontSize: 16,
        )
      ),
    );
  }

  /// 渲染大型动态规划网格视图
  Widget _buildMatrixView() {
    if (_matrix == null) {
      return const Center(
        child: Text(
          '请在上方输入核酸序列并点击运行比对', 
          style: TextStyle(color: Colors.white54, fontSize: 18)
        )
      );
    }

    String s1 = _seq1Ctrl.text.toUpperCase().trim();
    String s2 = _seq2Ctrl.text.toUpperCase().trim();
    List<Widget> rows = [];
    
    // 构建表头行 (X轴代表 Sequence B)
    List<Widget> headerCells = [ _buildCell(''), _buildCell('ε', color: Colors.blueGrey) ];
    for (int j = 0; j < s2.length; j++) {
      headerCells.add(_buildCell(s2[j], color: Colors.amberAccent, isBold: true));
    }
    rows.add(Row(mainAxisSize: MainAxisSize.min, children: headerCells));
    
    // 构建矩阵数据行 (Y轴包含 Sequence A 表头与内部数据)
    for (int i = 0; i <= s1.length; i++) {
      List<Widget> cells = [];
      if (i == 0) {
        cells.add(_buildCell('ε', color: Colors.blueGrey));
      } else {
        cells.add(_buildCell(s1[i-1], color: Colors.amberAccent, isBold: true));
      }
      
      for (int j = 0; j <= s2.length; j++) {
        // 判断当前坐标是否处于回溯路径中
        bool isPath = _path != null && _path!.contains(Point(i, j));
        cells.add(_buildCell(
          _matrix![i][j].toString(), 
          color: isPath ? const Color(0xFF10B981) : Colors.white70,
          isBold: isPath,
          bgColor: isPath ? const Color(0xFF10B981).withOpacity(0.2) : const Color(0xFF1E293B),
        ));
      }
      rows.add(Row(mainAxisSize: MainAxisSize.min, children: cells));
    }
    
    return InteractiveViewer(
      constrained: false,
      boundaryMargin: const EdgeInsets.all(80),
      minScale: 0.1,
      maxScale: 3.0,
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: rows,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Needleman-Wunsch Alignment Matrix', style: TextStyle(fontWeight: FontWeight.bold)),
        backgroundColor: const Color(0xFF0F172A),
        elevation: 0,
      ),
      body: Column(
        children: [
          // 顶部：控制面板与序列输入源
          Container(
            padding: const EdgeInsets.all(24),
            decoration: const BoxDecoration(
              color: Color(0xFF1E293B),
              border: Border(bottom: BorderSide(color: Colors.white10))
            ),
            child: Column(
              children: [
                Row(
                  children: [
                    Expanded(
                      child: TextField(
                        controller: _seq1Ctrl,
                        style: const TextStyle(letterSpacing: 2, fontFamily: 'monospace'),
                        decoration: const InputDecoration(
                          labelText: 'Sequence A (Y轴)',
                          border: OutlineInputBorder(),
                        ),
                      ),
                    ),
                    const SizedBox(width: 20),
                    Expanded(
                      child: TextField(
                        controller: _seq2Ctrl,
                        style: const TextStyle(letterSpacing: 2, fontFamily: 'monospace'),
                        decoration: const InputDecoration(
                          labelText: 'Sequence B (X轴)',
                          border: OutlineInputBorder(),
                        ),
                      ),
                    ),
                    const SizedBox(width: 20),
                    ElevatedButton.icon(
                      onPressed: _runAlignment,
                      icon: const Icon(Icons.hub),
                      label: const Text('执行全局比对', style: TextStyle(fontSize: 16)),
                      style: ElevatedButton.styleFrom(
                        padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 32),
                        backgroundColor: const Color(0xFF10B981),
                        foregroundColor: Colors.white,
                      ),
                    )
                  ],
                ),
              ],
            ),
          ),
          
          // 中部：极具极客风格的矩阵可视化区域
          Expanded(
            child: Container(
              color: const Color(0xFF0F172A),
              width: double.infinity,
              child: _buildMatrixView(),
            ),
          ),
          
          // 底部：最终比对结果呈现区
          if (_path != null)
            Container(
              padding: const EdgeInsets.all(32),
              decoration: const BoxDecoration(
                color: Color(0xFF1E293B),
                border: Border(top: BorderSide(color: Colors.white10))
              ),
              width: double.infinity,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    children: [
                      const Icon(Icons.check_circle_outline, color: Colors.amberAccent),
                      const SizedBox(width: 12),
                      Text(
                        'NW 全局比对最终得分: $_finalScore', 
                        style: const TextStyle(fontSize: 22, fontWeight: FontWeight.bold, color: Colors.amberAccent)
                      ),
                    ],
                  ),
                  const SizedBox(height: 24),
                  Container(
                    padding: const EdgeInsets.all(16),
                    decoration: BoxDecoration(
                      color: Colors.black26,
                      borderRadius: BorderRadius.circular(8),
                      border: Border.all(color: Colors.white12)
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text('Seq A : $_align1', style: const TextStyle(fontSize: 24, letterSpacing: 8, fontFamily: 'monospace', color: Colors.white)),
                        const SizedBox(height: 12),
                        Text('Seq B : $_align2', style: const TextStyle(fontSize: 24, letterSpacing: 8, fontFamily: 'monospace', color: Colors.white)),
                      ],
                    ),
                  )
                ],
              ),
            )
        ],
      ),
    );
  }
}