1

keyBoard/Assets.xcassets/Pay/pay_colorbg_icon.imageset/Contents.json

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

keyBoard/Assets.xcassets/Pay/pay_graybg_icon.imageset/Contents.json

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

keyBoard/Class/Pay/V/KBSvipSubscribeCell.m

@@ -2,13 +2,13 @@
 //  KBSvipSubscribeCell.m
 //  keyBoard
 //
-//  SVIP 订阅选项样式，横向排列，选中时绿色边框
+//  SVIP 订阅选项样式，使用背景图片切换选中状态
 //
 
 #import "KBSvipSubscribeCell.h"
 
 @interface KBSvipSubscribeCell ()
-@property (nonatomic, strong) UIView *cardView;          // 白色卡片背景
+@property (nonatomic, strong) UIImageView *bgImageView;  // 背景图片
 @property (nonatomic, strong) UILabel *titleLabel;       // "1 Week" / "1 Month" / "1 Year"
 @property (nonatomic, strong) UILabel *priceLabel;       // "$6.90"
 @property (nonatomic, strong) UILabel *strikeLabel;      // 删除线原价
@@ -20,31 +20,27 @@
     if (self = [super initWithFrame:frame]) {
         self.contentView.backgroundColor = [UIColor clearColor];
         
-        [self.contentView addSubview:self.cardView];
-        [self.cardView mas_makeConstraints:^(MASConstraintMaker *make) {
+        [self.contentView addSubview:self.bgImageView];
+        [self.bgImageView mas_makeConstraints:^(MASConstraintMaker *make) {
             make.edges.equalTo(self.contentView);
         }];
         
-        [self.cardView addSubview:self.titleLabel];
-        [self.cardView addSubview:self.priceLabel];
-        [self.cardView addSubview:self.strikeLabel];
+        [self.contentView addSubview:self.titleLabel];
+        [self.contentView addSubview:self.priceLabel];
+        [self.contentView addSubview:self.strikeLabel];
         
         [self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
-            make.centerX.equalTo(self.cardView);
-            make.top.equalTo(self.cardView).offset(12);
+            make.centerX.equalTo(self.contentView);
+            make.top.equalTo(self.contentView).offset(12);
         }];
         [self.priceLabel mas_makeConstraints:^(MASConstraintMaker *make) {
-            make.centerX.equalTo(self.cardView);
+            make.centerX.equalTo(self.contentView);
             make.top.equalTo(self.titleLabel.mas_bottom).offset(8);
         }];
         [self.strikeLabel mas_makeConstraints:^(MASConstraintMaker *make) {
-            make.centerX.equalTo(self.cardView);
+            make.centerX.equalTo(self.contentView);
             make.top.equalTo(self.priceLabel.mas_bottom).offset(4);
         }];
-        
-        // 基于 CALayer 的边框
-        self.cardView.layer.borderWidth = 1.5;
-        self.cardView.layer.borderColor = [UIColor colorWithWhite:0.9 alpha:1.0].CGColor;
     }
     return self;
 }
@@ -73,28 +69,26 @@
 }
 
 - (void)applySelected:(BOOL)selected animated:(BOOL)animated {
-    CGColorRef color = (selected ? [UIColor colorWithHex:KBColorValue].CGColor : [UIColor colorWithWhite:0.9 alpha:1.0].CGColor);
-    UIColor *bgColor = selected ? [UIColor colorWithHex:0xE8FFF6] : [UIColor whiteColor];
+    NSString *imageName = selected ? @"pay_colorbg_icon" : @"pay_graybg_icon";
     void (^changes)(void) = ^{
-        self.cardView.layer.borderColor = color;
-        self.cardView.backgroundColor = bgColor;
+        self.bgImageView.image = [UIImage imageNamed:imageName];
     };
     if (animated) {
-        [UIView animateWithDuration:0.2 animations:changes];
+        [UIView transitionWithView:self.bgImageView duration:0.2 options:UIViewAnimationOptionTransitionCrossDissolve animations:changes completion:nil];
     } else {
         changes();
     }
 }
 
 #pragma mark - Lazy
-- (UIView *)cardView {
-    if (!_cardView) {
-        _cardView = [UIView new];
-        _cardView.backgroundColor = [UIColor whiteColor];
-        _cardView.layer.cornerRadius = 12;
-        _cardView.clipsToBounds = YES;
+
+- (UIImageView *)bgImageView {
+    if (!_bgImageView) {
+        _bgImageView = [UIImageView new];
+        _bgImageView.contentMode = UIViewContentModeScaleAspectFill;
+        _bgImageView.image = [UIImage imageNamed:@"pay_graybg_icon"];
     }
-    return _cardView;
+    return _bgImageView;
 }
 
 - (UILabel *)titleLabel {

keyBoard/Class/Pay/VC/KBPaySvipVC.m

@@ -334,9 +334,8 @@ static NSString * const kKBSvipBenefitHeaderId = @"kKBSvipBenefitHeaderId";
 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
     CGFloat screenW = KB_SCREEN_WIDTH;
     if (indexPath.section == 0) {
-        // 订阅选项：横向三等分
-        CGFloat itemW = (screenW - 32 - 20) / 3.0; // 左右各16，间距10*2
-        return CGSizeMake(itemW, 90);
+        // 订阅选项：尺寸 105 * 124
+        return CGSizeMake(105, 124);
     } else {
         // 权益项
         return CGSizeMake(screenW - 32, 56);