UITableViewCell-Swipe-for-Options实战避坑清单：Cell复用、编辑模式与旋转屏的3个陷阱完整解决方案

UITableViewCell-Swipe-for-Options实战避坑清单：Cell复用、编辑模式与旋转屏的3个陷阱完整解决方案

【免费下载链接】UITableViewCell-Swipe-for-OptionsA reproduction of the iOS 7 Mail app's swipe-to-reveal options项目地址: https://gitcode.com/gh_mirrors/ui/UITableViewCell-Swipe-for-Options

UITableViewCell-Swipe-for-Options是一个复刻 iOS 7 Mail 应用"左滑显示操作选项"交互的经典开源项目，用 MIT 协议发布。很多 iOS 开发者在做 UITableView 行操作（删除、置顶、标记等）时会直接参考它的实现，但 Demo 里的代码埋了 3 个新手极易踩中的坑：Cell 复用残留、编辑模式冲突、旋转屏布局错乱。本文用清单式讲清每个陷阱的成因和官方解法。

一、项目结构速览：先认路再避坑

整个项目很小，核心实现只有 4 个文件，建议重点看新目录TLSwipeForOptionsCell/（旧目录UITableViewCell-Swipe-for-Options/是早期版本，通知名和按钮宽度参数都有差异）。

💡 核心思路一句话：Cell 内部塞了一个横向UIScrollView，滑到一半以上时自动吸附"展开"，同时通过 Delegate 通知外部控制器锁滚动、盖遮罩。

二、陷阱 1：Cell 复用导致"隔行串味"的残留菜单

⚠️现象：在列表顶部滑开某个 Cell 的菜单，快速滚动后，屏幕另一端的某一行会莫名显示着已展开的菜单，甚至文字内容都对不上。

成因：UITableView 的 Cell 是复用的。如果复用前不重置滚动位置，新 Cell 会继承旧 Cell 的contentOffset，直接以"菜单已打开"的状态出场。

✅解法：在prepareForReuse中把 contentOffset 归零（不带动画，避免闪烁）。官方实现在TLSwipeForOptionsCell/TLSwipeForOptionsCell.m（L115-L118）：

- (void)prepareForReuse { [super prepareForReuse]; [self.scrollView setContentOffset:CGPointZero animated:NO]; }

记住一条铁律：只要你在 Cell 里放了有"状态"的子视图（偏移量、选中态、定时器），prepareForReuse就必须兜底重置，这是本类项目最容易被删掉的一行代码。

三、陷阱 2：编辑模式下滑动手势不听话

⚠️现象：进入编辑模式（长按多选、滑动排序）后，Cell 的滑出按钮区域仍可能被滑出，且按钮文字在选中时异常闪现。

✅解法：官方在setEditing:animated:中做了双重处理（TLSwipeForOptionsCell/TLSwipeForOptionsCell.m，L119-L128）：

• 用self.scrollView.scrollEnabled = !self.editing关闭菜单滑动手势；
• 用self.scrollViewButtonView.hidden = editing隐藏按钮视图，修掉选中态闪烁。

同时控制器侧配合：进入编辑时主动收起所有已展开的菜单。Demo 在TLSFOC-Demo/Classes/TLTableViewController.m（L95-L99）的setEditing:里发送TLSwipeForOptionsCellShouldHideMenuNotification通知统一收菜单——这是全局收菜单的标准姿势，比逐个 Cell 操作更可靠。

四、陷阱 3：旋转屏幕后菜单布局"散架"

⚠️现象：菜单展开状态下旋转 iPhone，按钮区域错位、宽度不匹配，甚至按钮被截断。

成因：Cell 的菜单展开逻辑依赖当前 Cell 宽度计算contentSize和按钮 frame。旋转后宽度变化，但内部 scrollView 仍停留在"展开"状态，布局假设被打破。

✅解法分两步：

1. 旋转前强制收菜单：在控制器的willRotateToInterfaceOrientation:duration:中发送收起通知。Demo 实现见TLSFOC-Demo/Classes/TLTableViewController.m（L36-L41），源码注释也点明了原因——Cell 的layoutSubviews预期自身处于"关闭"状态。
2. 布局按最新宽度重算：Cell 的layoutSubviews（TLSwipeForOptionsCell/TLSwipeForOptionsCell.m，L104-L111）每次都基于self.bounds重算 scrollView、按钮区、内容区三个 frame，保证旋转后尺寸正确。

五、4 个 Demo 里藏着的小细节

除 3 大陷阱外，这些细节决定体验下限，建议直接抄作业：

• 📌用户开始拖动列表时自动收菜单：TLTableViewController.m（L103-L105）在scrollViewWillBeginDragging:里发收起通知，避免"菜单还开着、列表先跑了"的尴尬。
• 📌全局只允许一个菜单展开：cell:didShowMenu:回调中setScrollEnabled:!isShowingMenu锁住列表，并禁用其他 Cell 的用户交互（L124-L148）。
• 📌点菜单外区域收菜单：TLOverlayView重写hitTest:withEvent:，把触摸转发给展开中的 Cell，点空白处则发收起通知，见TLSwipeForOptionsCell/TLOverlayView.m。
• 📌批量删除必须倒序遍历：TLTableViewController.m（L49-L52）用NSEnumerationReverse删除数据源，否则下标会整体偏移导致删错行。

六、5 分钟上手：接入自己的项目

1. 克隆仓库：git clone https://gitcode.com/gh_mirrors/ui/UITableViewCell-Swipe-for-Options
2. 把TLSwipeForOptionsCell/下的 4 个文件加入工程，cell.delegate设为你的控制器；
3. 实现 Delegate 三个方法：cell:didShowMenu:、cellDidSelectDelete:、cellDidSelectMore:；
4. 在控制器的"滚动开始、进入编辑、旋转"三个时机发送TLSwipeForOptionsCellShouldHideMenuNotification收起菜单。

对照 Demo 工程TLSFOC-Demo/，跑一遍"滑开 → 滚动 → 进编辑 → 旋转"四条路径，全部通过即算接线成功。🎉

七、避坑清单总表

三个陷阱本质上都是同一类问题：状态生命周期管理。把"谁负责在何时收菜单"定义清楚（复用归 Cell、旋转/编辑/滚动归控制器、点击外部归覆盖层），这套 2013 年的实现至今仍是学习 UITableView 手势交互的优质范本。

【免费下载链接】UITableViewCell-Swipe-for-OptionsA reproduction of the iOS 7 Mail app's swipe-to-reveal options项目地址: https://gitcode.com/gh_mirrors/ui/UITableViewCell-Swipe-for-Options