2

keyBoard/Class/Me/V/KBMyKeyboardCell.h

@@ -0,0 +1,24 @@
+//
+//  KBMyKeyboardCell.h
+//  keyBoard
+//
+//  自定义键盘截图页的标签 Cell（带表情、文案、右上角删除圆点）。
+//  使用 Masonry 约束，支持根据文案动态计算宽度。
+//
+
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface KBMyKeyboardCell : UICollectionViewCell
+
+/// 配置展示内容
+- (void)configEmoji:(NSString *)emoji title:(NSString *)title;
+
+/// 根据文案计算自适应尺寸（高度固定，宽度随文本变化）
++ (CGSize)sizeForEmoji:(NSString *)emoji title:(NSString *)title;
+
+@end
+
+NS_ASSUME_NONNULL_END
+

keyBoard/Class/Me/V/KBMyKeyboardCell.m

@@ -0,0 +1,161 @@
+//
+//  KBMyKeyboardCell.m
+//  keyBoard
+//
+//  截图页标签样式 cell，实现：
+//  - 左侧 Emoji，中间标题；
+//  - 右上角小圆点（减号），用于删除编辑态展示；
+//  - 白底圆角，阴影/描边轻微以贴近设计；
+//  - 暴露 +sizeForEmoji:title: 以便外部根据文本动态决定 item 宽度。
+//
+
+#import "KBMyKeyboardCell.h"
+
+@interface KBMyKeyboardCell ()
+@property (nonatomic, strong) UIView *coverView;   // 左侧表情
+
+@property (nonatomic, strong) UILabel *emojiLabel;   // 左侧表情
+@property (nonatomic, strong) UILabel *titleLabel;   // 标题
+@property (nonatomic, strong) UIView  *minusBadge;   // 右上角减号圆点
+@property (nonatomic, strong) UILabel *minusLabel;   // 减号
+@end
+
+@implementation KBMyKeyboardCell
+
+- (instancetype)initWithFrame:(CGRect)frame {
+    if (self = [super initWithFrame:frame]) {
+        self.contentView.backgroundColor = [UIColor clearColor];
+
+        // 轻微阴影，让卡片更立体
+        self.layer.shadowColor = [UIColor colorWithWhite:0 alpha:0.08].CGColor;
+        self.layer.shadowOpacity = 1.0;
+        self.layer.shadowOffset = CGSizeMake(0, 2);
+        self.layer.shadowRadius = 6;
+
+        [self.contentView addSubview:self.coverView];
+
+        [self.coverView addSubview:self.emojiLabel];
+        [self.coverView addSubview:self.titleLabel];
+        [self.contentView addSubview:self.minusBadge];
+        [self.minusBadge addSubview:self.minusLabel];
+
+        [self.coverView mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.bottom.left.equalTo(self.contentView).offset(0);
+            make.height.mas_equalTo(36);
+        }];
+        
+        // Masonry 布局：左右 12 内边距，高度固定由外部控制
+        [self.emojiLabel mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.left.equalTo(self.coverView).offset(12);
+            make.centerY.equalTo(self.coverView);
+        }];
+        [self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.left.equalTo(self.emojiLabel.mas_right).offset(8);
+            make.centerY.equalTo(self.coverView);
+            make.right.lessThanOrEqualTo(self.coverView).offset(-12);
+        }];
+
+        // 右上角删除圆点（展示用），默认显示；如需编辑态控制，可对其 hidden 做处理
+        [self.minusBadge mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.width.height.mas_equalTo(11);
+            make.top.equalTo(self.contentView).offset(0);
+            make.right.equalTo(self.contentView).offset(0);
+        }];
+        [self.minusLabel mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.center.equalTo(self.minusBadge);
+        }];
+    }
+    return self;
+}
+
+- (void)prepareForReuse {
+    [super prepareForReuse];
+    self.emojiLabel.text = @"";
+    self.titleLabel.text = @"";
+}
+
+- (void)configEmoji:(NSString *)emoji title:(NSString *)title {
+    // 配置 UI 文案（为空补空串，避免计算崩溃）
+    self.emojiLabel.text = emoji ?: @"";
+    self.titleLabel.text = title ?: @"";
+}
+
++ (CGSize)sizeForEmoji:(NSString *)emoji title:(NSString *)title {
+    // 固定高度 44，宽度 = 左右内边距(12+12) + Emoji 宽(按 20 号字估算) + 间距(8) + 文案宽
+    UIFont *emojiFont = [UIFont systemFontOfSize:20];
+    UIFont *titleFont = [UIFont systemFontOfSize:16 weight:UIFontWeightSemibold];
+
+    CGFloat emojiW = 0;
+    if (emoji.length > 0) {
+        CGSize s = [emoji sizeWithAttributes:@{NSFontAttributeName:emojiFont}];
+        emojiW = ceil(s.width);
+    } else {
+        emojiW = 0; // 没有表情则不占宽
+    }
+
+    CGFloat textW = 0;
+    if (title.length > 0) {
+        CGSize s = [title sizeWithAttributes:@{NSFontAttributeName:titleFont}];
+        textW = ceil(s.width);
+    }
+
+    CGFloat width = 12 + emojiW + (emojiW > 0 ? 8 : 0) + textW + 12;
+    CGFloat minW = 84;  // 最小宽保证视觉
+    CGFloat maxW = UIScreen.mainScreen.bounds.size.width - 16 * 2; // 不超过屏幕可视宽
+    width = MAX(minW, MIN(width, maxW));
+    return CGSizeMake(width, 41.0);
+}
+
+#pragma mark - Lazy
+
+- (UILabel *)emojiLabel {
+    if (!_emojiLabel) {
+        _emojiLabel = [UILabel new];
+        _emojiLabel.font = [UIFont systemFontOfSize:20];
+        _emojiLabel.text = @"😀"; // 默认
+    }
+    return _emojiLabel;
+}
+
+- (UILabel *)titleLabel {
+    if (!_titleLabel) {
+        _titleLabel = [UILabel new];
+        _titleLabel.font = [UIFont systemFontOfSize:16 weight:UIFontWeightSemibold];
+        _titleLabel.textColor = [UIColor colorWithHex:0x1B1F1A];
+    }
+    return _titleLabel;
+}
+
+- (UIView *)minusBadge {
+    if (!_minusBadge) {
+        _minusBadge = [UIView new];
+        _minusBadge.backgroundColor = [UIColor colorWithHex:KBColorValue];
+        _minusBadge.layer.cornerRadius = 5.5;
+        _minusBadge.layer.masksToBounds = YES;
+    }
+    return _minusBadge;
+}
+
+- (UILabel *)minusLabel {
+    if (!_minusLabel) {
+        _minusLabel = [UILabel new];
+        _minusLabel.text = @"-";
+        _minusLabel.textColor = [UIColor whiteColor];
+        _minusLabel.font = [UIFont systemFontOfSize:12 weight:UIFontWeightBold];
+        _minusLabel.textAlignment = NSTextAlignmentCenter;
+    }
+    return _minusLabel;
+}
+
+- (UIView *)coverView{
+    if (!_coverView) {
+        _coverView = [[UIView alloc] init];
+        _coverView.backgroundColor = [UIColor whiteColor];
+        _coverView.layer.cornerRadius = 4;
+        _coverView.layer.masksToBounds = true;
+    }
+    return _coverView;
+}
+
+@end
+

keyBoard/Class/Me/VC/KBMyKeyBoardVC.h

@@ -0,0 +1,16 @@
+//
+//  KBMyKeyBoardVC.h
+//  keyBoard
+//
+//  Created by Mac on 2025/11/10.
+//
+
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface KBMyKeyBoardVC : UIViewController
+
+@end
+
+NS_ASSUME_NONNULL_END

keyBoard/Class/Me/VC/KBMyKeyBoardVC.m

@@ -0,0 +1,240 @@
+//
+//  KBMyKeyBoardVC.m
+//  keyBoard
+//
+//  Created by Mac on 2025/11/10.
+//
+
+#import "KBMyKeyBoardVC.h"
+#import "BMLongPressDragCellCollectionView.h"
+#import "UICollectionViewLeftAlignedLayout.h"
+#import "KBMyKeyboardCell.h"
+
+/// 复用标识
+static NSString * const kKBMyKeyboardCellId = @"kKBMyKeyboardCellId";
+
+/// 截图页 - 自定义键盘管理
+/// 要点：
+/// 1）使用 BMLongPressDragCellCollectionView 支持长按拖拽排序；
+/// 2）cell 宽度根据文案自适应；
+/// 3）全部使用 Masonry 进行布局，并采用懒加载创建控件；
+@interface KBMyKeyBoardVC () <BMLongPressDragCellCollectionViewDelegate, BMLongPressDragCellCollectionViewDataSource>
+
+// UI
+@property (nonatomic, strong) UIView *sheetView;              // 底部白色容器（圆角）
+@property (nonatomic, strong) BMLongPressDragCellCollectionView *collectionView; // 可拖拽的列表
+@property (nonatomic, strong) UIButton *saveButton;           // 保存按钮
+
+// 数据源（必须是二维数组，库内部会在拖动时直接调整顺序）
+@property (nonatomic, strong) NSMutableArray<NSMutableArray<NSDictionary *> *> *dataSourceArray; // {emoji,title}
+
+@end
+
+@interface KBMyKeyBoardVC ()
+
+@end
+
+@implementation KBMyKeyBoardVC
+
+- (void)viewDidLoad {
+    [super viewDidLoad];
+    self.view.backgroundColor = [UIColor colorWithHex:0xF6F8F9];
+    self.navigationController.title = @"My KeyBoard";
+    // 布局视图
+    [self.view addSubview:self.sheetView];
+    [self.sheetView addSubview:self.collectionView];
+    [self.view addSubview:self.saveButton];
+
+
+    [self.sheetView mas_makeConstraints:^(MASConstraintMaker *make) {
+        make.left.right.equalTo(self.view);
+        make.top.equalTo(self.view).offset(KB_NAV_TOTAL_HEIGHT + 60);
+        make.bottom.equalTo(self.view).offset(16);
+    }];
+
+    [self.collectionView mas_makeConstraints:^(MASConstraintMaker *make) {
+        make.left.right.top.equalTo(self.sheetView);
+        make.bottom.equalTo(self.saveButton.mas_top).offset(-15);
+    }];
+
+    [self.saveButton mas_makeConstraints:^(MASConstraintMaker *make) {
+        make.left.right.equalTo(self.view).insets(UIEdgeInsetsMake(0, 24, 0, 24));
+        make.bottom.equalTo(self.view.mas_safeAreaLayoutGuideBottom).offset(-12);
+        make.height.mas_equalTo(50);
+    }];
+
+    // 初始数据
+    [self buildDefaultData];
+}
+
+- (void)viewWillAppear:(BOOL)animated {
+    [super viewWillAppear:animated];
+    // 隐藏系统导航栏
+//    [self.navigationController setNavigationBarHidden:YES animated:animated];
+}
+
+- (void)viewWillDisappear:(BOOL)animated {
+    [super viewWillDisappear:animated];
+//    if (self.isMovingFromParentViewController || self.isBeingDismissed) {
+//        [self.navigationController setNavigationBarHidden:NO animated:animated];
+//    }
+}
+
+
+
+#pragma mark - Data
+
+/// 构造示例数据（二维数组，仅 1 个 section）
+- (void)buildDefaultData {
+    NSArray *arr = @[ 
+        @{@"emoji":@"😊", @"title":@"Humor"},
+        @{@"emoji":@"😄", @"title":@"Jokes"},
+        @{@"emoji":@"🥰", @"title":@"Love"},
+        @{@"emoji":@"🤔", @"title":@"Thinking"},
+        @{@"emoji":@"🔥", @"title":@"Hot"},
+        @{@"emoji":@"🎉", @"title":@"Celebrate"},
+        @{@"emoji":@"🧠", @"title":@"Brainstorm"},
+        @{@"emoji":@"🐱", @"title":@"Cats"},
+        @{@"emoji":@"😂", @"title":@"LOL"},
+        @{@"emoji":@"📸", @"title":@"Photography"},
+        @{@"emoji":@"🌟", @"title":@"Star"},
+        @{@"emoji":@"🍀", @"title":@"Lucky"},
+        @{@"emoji":@"📚", @"title":@"Knowledge"},
+        @{@"emoji":@"🎵", @"title":@"Music"},
+        @{@"emoji":@"🚀", @"title":@"Launch"},
+        @{@"emoji":@"😊", @"title":@"Humor"},
+        @{@"emoji":@"😄", @"title":@"Jokes"},
+        @{@"emoji":@"🥰", @"title":@"Love"},
+        @{@"emoji":@"🤔", @"title":@"Thinking"},
+        @{@"emoji":@"🔥", @"title":@"Hot"},
+        @{@"emoji":@"🎉", @"title":@"Celebrate"},
+        @{@"emoji":@"🧠", @"title":@"Brainstorm"},
+        @{@"emoji":@"🐱", @"title":@"Cats"},
+        @{@"emoji":@"😂", @"title":@"LOL"},
+        @{@"emoji":@"📸", @"title":@"Photography"},
+        @{@"emoji":@"🌟", @"title":@"Star"},
+        @{@"emoji":@"🍀", @"title":@"Lucky"},
+        @{@"emoji":@"📚", @"title":@"Knowledge"},
+        @{@"emoji":@"🎵", @"title":@"Music"},
+        @{@"emoji":@"🚀", @"title":@"Launch"},
+        @{@"emoji":@"😊", @"title":@"Humor"},
+        @{@"emoji":@"😄", @"title":@"Jokes"},
+        @{@"emoji":@"🥰", @"title":@"Love"},
+        @{@"emoji":@"🤔", @"title":@"Thinking"},
+        @{@"emoji":@"🔥", @"title":@"Hot"},
+        @{@"emoji":@"🎉", @"title":@"Celebrate"},
+        @{@"emoji":@"🧠", @"title":@"Brainstorm"},
+        @{@"emoji":@"🐱", @"title":@"Cats"},
+        @{@"emoji":@"😂", @"title":@"LOL"},
+        @{@"emoji":@"📸", @"title":@"Photography"},
+        @{@"emoji":@"🌟", @"title":@"Star"},
+        @{@"emoji":@"🍀", @"title":@"Lucky"},
+        @{@"emoji":@"📚", @"title":@"Knowledge"},
+        @{@"emoji":@"🎵", @"title":@"Music"},
+        @{@"emoji":@"🚀", @"title":@"Launch"},
+    ];
+    self.dataSourceArray = [@[[arr mutableCopy]] mutableCopy];
+    [self.collectionView reloadData];
+}
+
+#pragma mark - BMLongPressDragCellCollectionViewDataSource
+
+- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return self.dataSourceArray.count; }
+
+- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
+    return self.dataSourceArray[section].count;
+}
+
+- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
+    KBMyKeyboardCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:kKBMyKeyboardCellId forIndexPath:indexPath];
+    NSDictionary *d = self.dataSourceArray[indexPath.section][indexPath.item];
+    [cell configEmoji:d[@"emoji"] title:d[@"title"]];
+    return cell;
+}
+
+// 拖拽库要求实现：返回当前“二维数组”数据源
+- (NSArray<NSArray<id> *> *)dataSourceWithDragCellCollectionView:(__kindof BMLongPressDragCellCollectionView *)dragCellCollectionView {
+    return self.dataSourceArray;
+}
+
+// 拖拽后回调：保存最新数据
+- (void)dragCellCollectionView:(BMLongPressDragCellCollectionView *)dragCellCollectionView newDataArrayAfterMove:(nullable NSArray<NSArray<id> *> *)newDataArray {
+    self.dataSourceArray = [newDataArray mutableCopy];
+}
+
+#pragma mark - BMLongPressDragCellCollectionViewDelegate (布局)
+
+// 根据文案长度动态返回 item 尺寸
+- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
+    NSDictionary *d = self.dataSourceArray[indexPath.section][indexPath.item];
+    return [KBMyKeyboardCell sizeForEmoji:d[@"emoji"] title:d[@"title"]];
+}
+
+- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
+    return UIEdgeInsetsMake(12, 12, 12, 12);
+}
+
+- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section { return 10; }
+- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section { return 10; }
+
+#pragma mark - Actions
+
+- (void)onSave {
+    // 这里只做示意：保存当前顺序
+    NSLog(@"保存顺序: %@", self.dataSourceArray);
+    [KBHUD showInfo:@"已保存"]; 
+}
+
+#pragma mark - Lazy UI
+
+//- (UILabel *)titleLabel {
+//    if (!_titleLabel) {
+//        _titleLabel = [UILabel new];
+//        _titleLabel.text = @"My Keyboard"; // 顶部标题
+//        _titleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
+//        _titleLabel.textColor = [UIColor colorWithHex:0x1B1F1A];
+//    }
+//    return _titleLabel;
+//}
+
+- (UIView *)sheetView {
+    if (!_sheetView) {
+        _sheetView = [UIView new];
+        _sheetView.backgroundColor = [UIColor whiteColor];
+        _sheetView.layer.cornerRadius = 32.0;
+        _sheetView.layer.masksToBounds = YES;
+    }
+    return _sheetView;
+}
+
+- (BMLongPressDragCellCollectionView *)collectionView {
+    if (!_collectionView) {
+        UICollectionViewLeftAlignedLayout *layout = [UICollectionViewLeftAlignedLayout new];
+        layout.scrollDirection = UICollectionViewScrollDirectionVertical;
+//        layout.sectionInset = UIEdgeInsetsMake(16, 16, 16, 16);
+        _collectionView = [[BMLongPressDragCellCollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
+        _collectionView.backgroundColor = [UIColor clearColor];
+        _collectionView.delegate = self;   // 注意：代理为 BMLongPressDragCellCollectionViewDelegate
+        _collectionView.dataSource = self; // 注意：数据源为 BMLongPressDragCellCollectionViewDataSource
+        _collectionView.alwaysBounceVertical = YES;
+        _collectionView.showsVerticalScrollIndicator = NO;
+        [_collectionView registerClass:KBMyKeyboardCell.class forCellWithReuseIdentifier:kKBMyKeyboardCellId];
+    }
+    return _collectionView;
+}
+
+- (UIButton *)saveButton {
+    if (!_saveButton) {
+        _saveButton = [UIButton buttonWithType:UIButtonTypeSystem];
+        [_saveButton setTitle:@"Save" forState:UIControlStateNormal];
+        _saveButton.titleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
+        [_saveButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
+        _saveButton.backgroundColor = [UIColor colorWithHex:KBColorValue];
+        _saveButton.layer.cornerRadius = 25;
+        _saveButton.layer.masksToBounds = YES;
+        [_saveButton addTarget:self action:@selector(onSave) forControlEvents:UIControlEventTouchUpInside];
+    }
+    return _saveButton;
+}
+
+@end

keyBoard/Class/Me/VC/MyVC.m

@@ -10,6 +10,7 @@
 #import "KBSkinDetailVC.h"
 #import "KBMyHeaderView.h"  // 顶部视图独立封装
 #import "KBMyListCell.h"
+#import "KBMyKeyBoardVC.h"
 
 @interface MyVC () <UITableViewDelegate, UITableViewDataSource>
 @property (nonatomic, strong) BaseTableView *tableView;  // 列表
@@ -100,6 +101,8 @@
 
 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
     [tableView deselectRowAtIndexPath:indexPath animated:YES];
+    KBMyKeyBoardVC *vc = [[KBMyKeyBoardVC alloc] init];
+    [self.navigationController pushViewController:vc animated:true];
 }
 
 #pragma mark - Lazy