1

keyBoard/Assets.xcassets/Shop/shop_jbsmall_icon.imageset/Contents.json

@@ -0,0 +1,22 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "shop_jbsmall_icon@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "shop_jbsmall_icon@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

keyBoard/Class/Base/VC/BaseViewController.h

@@ -23,6 +23,8 @@ NS_ASSUME_NONNULL_BEGIN
 @property (nonatomic, strong, readonly) UILabel *kb_titleLabel;
 /// 自定义导航栏左侧返回按钮（懒加载）。
 @property (nonatomic, strong, readonly) UIButton *kb_backButton;
+/// 自定义导航栏右侧按钮（懒加载，默认 hidden = YES）。
+@property (nonatomic, strong, readonly) UIButton *kb_rightButton;
 
 @end
 

keyBoard/Class/Base/VC/BaseViewController.m

@@ -16,6 +16,7 @@
 @property (nonatomic, strong) UIView *kb_navContentView;       // 44 高度内容区（便于居中）
 @property (nonatomic, strong) UILabel *kb_titleLabelInternal;  // 中间标题
 @property (nonatomic, strong) UIButton *kb_backButtonInternal; // 返回
+@property (nonatomic, strong) UIButton *kb_rightButtonInternal; // 右侧按钮
 @property (nonatomic, strong) MASConstraint *kb_navHeightConstraint; // 高度约束，适配刘海
 @end
 
@@ -75,12 +76,22 @@
         make.width.height.mas_equalTo(32);
     }];
 
+    // 右侧按钮（默认隐藏）
+    [self.kb_navContentView addSubview:self.kb_rightButtonInternal];
+    [self.kb_rightButtonInternal mas_makeConstraints:^(MASConstraintMaker *make) {
+        make.right.equalTo(self.kb_navContentView).offset(-12);
+        make.centerY.equalTo(self.kb_navContentView);
+        // 仅固定高度，宽度由文字/图片自适应
+        make.height.mas_equalTo(32);
+    }];
+
     // 标题
     [self.kb_navContentView addSubview:self.kb_titleLabelInternal];
     [self.kb_titleLabelInternal mas_makeConstraints:^(MASConstraintMaker *make) {
         make.centerX.equalTo(self.kb_navContentView);
         make.centerY.equalTo(self.kb_navContentView);
         make.left.greaterThanOrEqualTo(self.kb_backButtonInternal.mas_right).offset(8);
+        make.right.lessThanOrEqualTo(self.kb_rightButtonInternal.mas_left).offset(-8);
     }];
 
     // 初始标题显示为 VC 的 title
@@ -116,6 +127,7 @@
 - (UIView *)kb_navView { return self.kb_navViewInternal; }
 - (UILabel *)kb_titleLabel { return self.kb_titleLabelInternal; }
 - (UIButton *)kb_backButton { return self.kb_backButtonInternal; }
+- (UIButton *)kb_rightButton { return self.kb_rightButtonInternal; }
 
 #pragma mark - Lazy
 
@@ -158,6 +170,19 @@
     return _kb_backButtonInternal;
 }
 
+- (UIButton *)kb_rightButtonInternal {
+    if (!_kb_rightButtonInternal) {
+        _kb_rightButtonInternal = [UIButton buttonWithType:UIButtonTypeCustom];
+        _kb_rightButtonInternal.hidden = YES; // 默认不展示，业务方按需设置
+        _kb_rightButtonInternal.adjustsImageWhenHighlighted = YES;
+        _kb_rightButtonInternal.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;
+        _kb_rightButtonInternal.titleLabel.font = [UIFont systemFontOfSize:14];
+        [_kb_rightButtonInternal setTitleColor:[UIColor colorWithHex:KBBlackValue]
+                                      forState:UIControlStateNormal];
+    }
+    return _kb_rightButtonInternal;
+}
+
 - (void)kb_onBack {
     if (self.navigationController && self.navigationController.viewControllers.count > 1) {
         [self.navigationController popViewControllerAnimated:YES];

keyBoard/Class/Common/V/KBMoneyBtn.h

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

keyBoard/Class/Common/V/KBMoneyBtn.m

@@ -0,0 +1,68 @@
+//
+//  KBMoneyBtn.m
+//  keyBoard
+//
+//  Created by Mac on 2025/11/17.
+//
+
+#import "KBMoneyBtn.h"
+#import "UIColor+Extension.h"
+
+@implementation KBMoneyBtn
+
+- (instancetype)initWithFrame:(CGRect)frame {
+    self = [super initWithFrame:frame];
+    if (self) {
+        [self kb_setupUI];
+    }
+    return self;
+}
+
+- (instancetype)initWithCoder:(NSCoder *)coder {
+    self = [super initWithCoder:coder];
+    if (self) {
+        [self kb_setupUI];
+    }
+    return self;
+}
+
+- (void)kb_setupUI {
+    // 背景：#EDFFFD，透明度 0.72
+//    self.backgroundColor = [UIColor colorWithHex:0xEDFFFD alpha:0.72];
+    self.backgroundColor = [UIColor colorWithHex:0xEDFFFD];
+
+    // 文字样式：颜色 0x02BEAC，数字展示用稍大一点的字号
+    [self setTitleColor:[UIColor colorWithHex:0x02BEAC] forState:UIControlStateNormal];
+    self.titleLabel.font = [UIFont systemFontOfSize:16 weight:UIFontWeightSemibold];
+
+    // 左侧金币图标
+    UIImage *icon = [UIImage imageNamed:@"shop_jbsmall_icon"];
+    if (icon) {
+        [self setImage:icon forState:UIControlStateNormal];
+    }
+
+    // 内容靠左，预留左右内边距
+    self.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
+    self.contentEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 10);
+
+    // 图片与文字间距 15：通过 imageEdgeInsets / titleEdgeInsets 调整
+    CGFloat spacing = 5.0;
+    self.imageEdgeInsets = UIEdgeInsetsMake(0, -spacing / 2.0, 0, spacing / 2.0);
+    self.titleEdgeInsets = UIEdgeInsetsMake(0, spacing / 2.0, 0, -spacing / 2.0);
+
+    // 高亮时不要变暗太多
+    self.adjustsImageWhenHighlighted = YES;
+}
+
+- (void)layoutSubviews {
+    [super layoutSubviews];
+
+    CGFloat h = CGRectGetHeight(self.bounds);
+    if (h <= 0) { return; }
+
+    // 胶囊圆角
+    self.layer.cornerRadius = h / 2.0;
+    self.clipsToBounds = YES;
+}
+
+@end

keyBoard/Class/Me/VC/KBSkinDetailVC.h

@@ -9,7 +9,7 @@
 
 NS_ASSUME_NONNULL_BEGIN
 
-@interface KBSkinDetailVC : UIViewController
+@interface KBSkinDetailVC : BaseViewController
 
 @end
 

keyBoard/Class/Me/VC/KBSkinDetailVC.m

@@ -64,7 +64,8 @@ typedef NS_ENUM(NSInteger, KBSkinDetailSection) {
 
     // 列表底部距离操作条顶部 10
     [self.collectionView mas_makeConstraints:^(MASConstraintMaker *make) {
-        make.top.left.right.equalTo(self.view);
+        make.left.right.equalTo(self.view);
+        make.top.equalTo(self.view).offset(KB_NAV_TOTAL_HEIGHT);
         make.bottom.equalTo(self.bottomBar.mas_top).offset(-10);
     }];
 }

keyBoard/Class/Me/VC/MySkinVC.m

@@ -4,6 +4,7 @@
 //
 
 #import "MySkinVC.h"
+#import "KBSkinDetailVC.h"
 #import <Masonry/Masonry.h>
 #import "UIColor+Extension.h"
 #import <MJRefresh/MJRefresh.h>
@@ -32,8 +33,11 @@ static NSString * const kMySkinCellId = @"kMySkinCellId";
 
 //    self.title = @"My Skin"; // 标题
 
-    // 右上角 Editor/Cancel
-    self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"Editor" style:UIBarButtonItemStylePlain target:self action:@selector(onToggleEdit)];
+    // 右上角 Editor/Cancel 使用 BaseViewController 自定义导航栏的 kb_rightButton
+    self.kb_rightButton.hidden = NO;
+    [self.kb_rightButton setTitle:@"Editor" forState:UIControlStateNormal];
+    [self.kb_rightButton removeTarget:nil action:NULL forControlEvents:UIControlEventAllEvents];
+    [self.kb_rightButton addTarget:self action:@selector(onToggleEdit) forControlEvents:UIControlEventTouchUpInside];
 
     // 数据源初始化为空（演示空态 + 下拉刷新）
     self.data = [NSMutableArray array];
@@ -104,7 +108,8 @@ static NSString * const kMySkinCellId = @"kMySkinCellId";
     self.editingMode = !self.editingMode;
 
     // 更新顶部按钮
-    self.navigationItem.rightBarButtonItem.title = self.isEditingMode ? @"Cancel" : @"Editor";
+    [self.kb_rightButton setTitle:(self.isEditingMode ? @"Cancel" : @"Editor")
+                         forState:UIControlStateNormal];
 
     // 控制底部栏显隐
     self.bottomView.hidden = !self.isEditingMode;
@@ -186,6 +191,8 @@ static NSString * const kMySkinCellId = @"kMySkinCellId";
     if (!self.isEditingMode) {
         // 非编辑态：可在此进入详情，当前示例不处理
         [collectionView deselectItemAtIndexPath:indexPath animated:YES];
+        KBSkinDetailVC *vc = [[KBSkinDetailVC alloc] init];
+        [self.navigationController pushViewController:vc animated:true];
         return;
     }
     MySkinCell *cell = (MySkinCell *)[collectionView cellForItemAtIndexPath:indexPath];

keyBoard/Class/Pay/V/KBJfPayCell.m

@@ -61,6 +61,8 @@
 @property (nonatomic, strong) UIView *cardView;            // 卡片背景（圆角）
 @property (nonatomic, strong) UIStackView *topStack;       // 顶部水平栈：金币 + 数字（整体居中）
 @property (nonatomic, strong) UIImageView *iconView;       // 左侧金币图
+@property (nonatomic, strong) UIImageView *gradientImageView;       // 左侧金币图
+
 @property (nonatomic, strong) UILabel *coinLabel;          // 690
 @property (nonatomic, strong) UILabel *priceLabel;         // $6.90
 
@@ -76,6 +78,8 @@
         self.contentView.backgroundColor = UIColor.clearColor;
 
         [self.contentView addSubview:self.cardView];
+        [self.cardView addSubview:self.gradientImageView];
+
         // 顶部金币 + 数字放入一个水平栈，保证整体居中
         [self.cardView addSubview:self.topStack];
         [self.topStack addArrangedSubview:self.iconView];
@@ -86,6 +90,9 @@
         [self.cardView mas_makeConstraints:^(MASConstraintMaker *make) {
             make.edges.equalTo(self.contentView);
         }];
+        [self.gradientImageView mas_makeConstraints:^(MASConstraintMaker *make) {
+            make.edges.equalTo(self.cardView);
+        }];
         [self.topStack mas_makeConstraints:^(MASConstraintMaker *make) {
             make.top.equalTo(self.cardView).offset(16);
             make.centerX.equalTo(self.cardView); // 整体水平居中
@@ -177,7 +184,8 @@
     if (!_cardView) {
         _cardView = [UIView new];
         // 淡灰渐变效果可用切图/渐变，这里简化为纯色
-        _cardView.backgroundColor = [UIColor colorWithWhite:0.98 alpha:1.0];
+        
+        _cardView.backgroundColor = [UIColor colorWithHex:0xF1F1F1];
     }
     return _cardView;
 }
@@ -190,6 +198,15 @@
     return _iconView;
 }
 
+- (UIImageView *)gradientImageView{
+    if (!_gradientImageView) {
+        _gradientImageView = [[UIImageView alloc] init];
+        UIImage *gradientImage = [UIImage kb_gradientImageWithColors:@[[UIColor colorWithHex:0xF1F1F1], [UIColor colorWithHex:0xFFFFFF]] size:CGSizeMake(108, 116) direction:KBGradientDirectionTopToBottom];
+        _gradientImageView.image = gradientImage;
+    }
+    return _gradientImageView;
+}
+
 - (UILabel *)coinLabel {
     if (!_coinLabel) {
         _coinLabel = [UILabel new];

keyBoard/Class/Search/V/KBSkinCardCell.m

@@ -4,18 +4,19 @@
 //
 
 #import "KBSkinCardCell.h"
+#import "KBMoneyBtn.h"
 
 @interface KBSkinCardCell ()
 @property (nonatomic, strong) UIImageView *coverView; // 封面
 @property (nonatomic, strong) UILabel *titleLabel;    // 标题
-@property (nonatomic, strong) UILabel *priceLabel;    // 价格
+@property (nonatomic, strong) KBMoneyBtn *priceBtn;    // 价格
 @end
 
 @implementation KBSkinCardCell
 
 - (instancetype)initWithFrame:(CGRect)frame {
     if (self = [super initWithFrame:frame]) {
-        self.contentView.backgroundColor = [UIColor whiteColor];
+        self.contentView.backgroundColor = [UIColor colorWithHex:0xF8F8F8];
         self.contentView.layer.cornerRadius = 12;
         self.contentView.layer.masksToBounds = YES;
         self.contentView.layer.shadowColor = [UIColor colorWithWhite:0 alpha:0.06].CGColor;
@@ -24,22 +25,23 @@
 
         [self.contentView addSubview:self.coverView];
         [self.contentView addSubview:self.titleLabel];
-        [self.contentView addSubview:self.priceLabel];
+        [self.contentView addSubview:self.priceBtn];
 
         [self.coverView mas_makeConstraints:^(MASConstraintMaker *make) {
             make.top.left.right.equalTo(self.contentView);
-            make.height.equalTo(self.contentView.mas_width).multipliedBy(0.75); // 4:3
+            make.height.mas_equalTo(KBFit(126));
         }];
 
         [self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
             make.left.equalTo(self.contentView).offset(12);
             make.right.equalTo(self.contentView).offset(-12);
-            make.top.equalTo(self.coverView.mas_bottom).offset(8);
+            make.top.equalTo(self.coverView.mas_bottom).offset(KBFit(8));
+            make.height.mas_equalTo(KBFit(20));
         }];
 
-        [self.priceLabel mas_makeConstraints:^(MASConstraintMaker *make) {
+        [self.priceBtn mas_makeConstraints:^(MASConstraintMaker *make) {
             make.left.equalTo(self.titleLabel);
-            make.bottom.equalTo(self.contentView).offset(-10);
+            make.bottom.equalTo(self.contentView).offset(-12);
         }];
     }
     return self;
@@ -47,7 +49,8 @@
 
 - (void)configWithTitle:(NSString *)title imageURL:(NSString *)url price:(NSString *)price {
     self.titleLabel.text = title.length ? title : @"Dopamine";
-    self.priceLabel.text = price.length ? price : @"20";
+    [self.priceBtn setTitle:@"20" forState:UIControlStateNormal];
+
     // 简化：本地展示占位色，无网络图
     self.coverView.backgroundColor = [UIColor colorWithWhite:0.92 alpha:1.0];
 }
@@ -68,18 +71,16 @@
     if (!_titleLabel) {
         _titleLabel = [[UILabel alloc] init];
         _titleLabel.font = [UIFont systemFontOfSize:15 weight:UIFontWeightSemibold];
-        _titleLabel.textColor = [UIColor colorWithHex:0x1B1F1A];
+        _titleLabel.textColor = [UIColor colorWithHex:KBBlackValue];
     }
     return _titleLabel;
 }
 
-- (UILabel *)priceLabel {
-    if (!_priceLabel) {
-        _priceLabel = [[UILabel alloc] init];
-        _priceLabel.font = [UIFont systemFontOfSize:14];
-        _priceLabel.textColor = [UIColor colorWithRed:0.15 green:0.72 blue:0.62 alpha:1.0];
+- (KBMoneyBtn *)priceBtn {
+    if (!_priceBtn) {
+        _priceBtn = [KBMoneyBtn buttonWithType:UIButtonTypeCustom];
     }
-    return _priceLabel;
+    return _priceBtn;
 }
 
 @end

keyBoard/Class/Search/VC/KBSearchVC.m

@@ -71,7 +71,8 @@ typedef NS_ENUM(NSInteger, KBSearchSection) {
     [self.searchBarView mas_makeConstraints:^(MASConstraintMaker *make) {
         make.centerY.equalTo(self.backButton);
         make.left.equalTo(self.backButton.mas_right).offset(12);
-        make.width.mas_equalTo(315);
+//        make.width.mas_equalTo(315);
+        make.right.equalTo(self.view).offset(-16);
         make.height.mas_equalTo(36);
         make.right.lessThanOrEqualTo(self.topBar).offset(-16);
     }];
@@ -301,8 +302,8 @@ typedef NS_ENUM(NSInteger, KBSearchSection) {
     CGFloat spacing = 12;   // 列间距
     CGFloat w = floor((width - inset*2 - spacing) / 2.0);
     // 高度：封面 0.75w + 标题 + 价格 + 边距，近似定高
-    CGFloat h = w*0.75 + 8 + 20 + 10 + 6 + 8; // 估算
-    return CGSizeMake(w, h);
+//    CGFloat h = w*0.75 + 8 + 20 + 10 + 6 + 8; // 估算
+    return CGSizeMake(w, KBFit(197));
 }
 
 - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {

keyBoard/Class/Shop/V/KBShopHeadView.m

@@ -6,6 +6,7 @@
 //
 
 #import "KBShopHeadView.h"
+#import "KBJfPay.h"
 
 @interface KBShopHeadView ()
 
@@ -173,7 +174,9 @@
 
 #pragma mark - Actions
 - (void)onRechargeTappedAction {
-    if (self.onRechargeTapped) { self.onRechargeTapped(); }
+//    if (self.onRechargeTapped) { self.onRechargeTapped(); }
+    KBJfPay *vc = [[KBJfPay alloc] init];
+    [KB_CURRENT_NAV pushViewController:vc animated:true];
 }
 
 #pragma mark - Lazy UI

keyBoard/Class/Shop/VC/KBShopItemVC.m

@@ -97,8 +97,8 @@
     CGFloat spacing = 12.0;
     CGFloat contentW = collectionView.bounds.size.width - insetLR * 2;
     CGFloat itemW = floor((contentW - spacing) / 2.0);
-    CGFloat itemH = itemW * 0.75 + 56; // KBSkinCardCell 内部高度估算
-    return CGSizeMake(itemW, itemH);
+//    CGFloat itemH = itemW * 0.75 + 56; // KBSkinCardCell 内部高度估算
+    return CGSizeMake(itemW, KBFit(197));
 }
 
 - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {