313 lines
12 KiB
Objective-C
313 lines
12 KiB
Objective-C
//
|
||
// KBShopHeadView.m
|
||
// keyBoard
|
||
//
|
||
// Created by Mac on 2025/11/9.
|
||
//
|
||
|
||
#import "KBShopHeadView.h"
|
||
|
||
@interface KBShopHeadView ()
|
||
|
||
// 容器视图(留出与屏幕的左右边距)
|
||
@property (nonatomic, strong) UIView *containerView;
|
||
|
||
// 顶部左侧标题与点缀
|
||
@property (nonatomic, strong) UILabel *titleLabel; // "Points\nMall"
|
||
@property (nonatomic, strong) UIImageView *yellowStarView; // 左侧黄色装饰星:shop_yellowxx_icon
|
||
@property (nonatomic, strong) UIImageView *yellowStarView2; // 左侧黄色装饰星:shop_yellowxx_icon
|
||
|
||
@property (nonatomic, strong) UIImageView *greenStarView; // 右上角绿色装饰星:shop_greenxx_icon
|
||
@property (nonatomic, strong) UIImageView *greenStarView2; // 右上角绿色装饰星:shop_greenxx_icon
|
||
@property (nonatomic, strong) UIImageView *greenStarView3; // 右上角绿色装饰星:shop_greenxx_icon
|
||
|
||
|
||
// 右侧大金币
|
||
@property (nonatomic, strong) UIImageView *bigCoinView; // shop_headbigBg_icon
|
||
|
||
// 底部信息卡片
|
||
@property (nonatomic, strong) UIView *infoCard; // 渐变浅绿背景
|
||
@property (nonatomic, strong) UILabel *myPointsLabel; // "My Points"
|
||
@property (nonatomic, strong) UIImageView *smallCoinView; // 左侧小金币:shop_jb_icon
|
||
@property (nonatomic, strong) UILabel *amountLabel; // 数字 88.00
|
||
@property (nonatomic, strong) UIButton *rechargeButton; // 充值按钮:recharge_btn_bg
|
||
|
||
@end
|
||
|
||
@implementation KBShopHeadView
|
||
|
||
- (instancetype)initWithFrame:(CGRect)frame {
|
||
if (self = [super initWithFrame:frame]) {
|
||
self.backgroundColor = [UIColor clearColor];
|
||
|
||
// 组装视图层级
|
||
[self addSubview:self.containerView];
|
||
[self.containerView addSubview:self.titleLabel];
|
||
[self.containerView addSubview:self.bigCoinView];
|
||
[self.containerView addSubview:self.yellowStarView];
|
||
[self.containerView addSubview:self.yellowStarView2];
|
||
[self.containerView addSubview:self.greenStarView];
|
||
[self.containerView addSubview:self.greenStarView2];
|
||
[self.containerView addSubview:self.greenStarView3];
|
||
[self.containerView addSubview:self.infoCard];
|
||
[self.infoCard addSubview:self.myPointsLabel];
|
||
[self.infoCard addSubview:self.smallCoinView];
|
||
[self.infoCard addSubview:self.amountLabel];
|
||
[self.infoCard addSubview:self.rechargeButton];
|
||
|
||
// 布局
|
||
[self.containerView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self).offset(16);
|
||
make.right.equalTo(self).offset(-16);
|
||
make.top.equalTo(self);
|
||
make.bottom.equalTo(self);
|
||
}];
|
||
|
||
// 左侧标题
|
||
[self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.containerView).offset(32);
|
||
make.top.equalTo(self.containerView).offset(KB_NAV_TOTAL_HEIGHT + 20);
|
||
}];
|
||
|
||
// 左侧黄色装饰星
|
||
[self.yellowStarView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.centerY.equalTo(self.titleLabel.mas_centerY).offset(6);
|
||
make.left.equalTo(self.containerView).offset(6);
|
||
make.width.height.mas_equalTo(18);
|
||
}];
|
||
[self.yellowStarView2 mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.bottom.equalTo(self.titleLabel.mas_top).offset(6);
|
||
make.left.equalTo(self.titleLabel.mas_right).offset(6);
|
||
make.width.height.mas_equalTo(16);
|
||
}];
|
||
|
||
// 右上角绿色装饰星
|
||
[self.greenStarView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.top.equalTo(self.yellowStarView2).offset(0);
|
||
make.left.equalTo(self.yellowStarView2.mas_right).offset(62);
|
||
make.width.height.mas_equalTo(20);
|
||
}];
|
||
[self.greenStarView2 mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.top.equalTo(self.greenStarView.mas_bottom).offset(10);
|
||
make.right.equalTo(self.containerView).offset(-18);
|
||
make.width.height.mas_equalTo(14);
|
||
}];
|
||
[self.greenStarView3 mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.top.equalTo(self.greenStarView2.mas_bottom).offset(20);
|
||
make.right.equalTo(self.containerView).offset(0);
|
||
make.width.height.mas_equalTo(14);
|
||
}];
|
||
|
||
// 右侧大金币(装饰)
|
||
[self.bigCoinView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.bottom.equalTo(self.containerView);
|
||
make.left.right.equalTo(self.containerView);
|
||
make.height.mas_equalTo(KBFit(238));
|
||
}];
|
||
|
||
// 底部信息卡片
|
||
[self.infoCard mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.right.equalTo(self.containerView);
|
||
make.bottom.equalTo(self.containerView);
|
||
make.height.mas_equalTo(KBFit(140));
|
||
}];
|
||
|
||
[self.myPointsLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.infoCard).offset(16);
|
||
make.bottom.equalTo(self.smallCoinView.mas_top).offset(-16);
|
||
}];
|
||
|
||
[self.smallCoinView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.infoCard).offset(16);
|
||
make.centerY.equalTo(self.amountLabel);
|
||
make.width.height.mas_equalTo(38);
|
||
}];
|
||
|
||
[self.amountLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.smallCoinView.mas_right).offset(10);
|
||
make.centerY.equalTo(self.rechargeButton);
|
||
}];
|
||
|
||
[self.rechargeButton mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.bottom.equalTo(self.infoCard).offset(-32);
|
||
make.right.equalTo(self.infoCard).offset(-15);
|
||
make.width.mas_equalTo(114);
|
||
make.height.mas_equalTo(42);
|
||
}];
|
||
}
|
||
return self;
|
||
}
|
||
|
||
- (void)layoutSubviews {
|
||
[super layoutSubviews];
|
||
|
||
// 圆角;头图容器做裁剪,避免内容溢出
|
||
// self.containerView.layer.cornerRadius = 16.0;
|
||
// self.containerView.layer.masksToBounds = YES;
|
||
//
|
||
// self.infoCard.layer.cornerRadius = 16.0;
|
||
// self.infoCard.layer.masksToBounds = YES;
|
||
//
|
||
// // 卡片底色做一个很浅的左→右渐变,贴近设计微绿色
|
||
// // 先移除已有渐变,避免多次叠加
|
||
// NSMutableArray<CALayer *> *remove = [NSMutableArray array];
|
||
// for (CALayer *l in self.infoCard.layer.sublayers) {
|
||
// if ([l isKindOfClass:[CAGradientLayer class]]) { [remove addObject:l]; }
|
||
// }
|
||
// for (CALayer *l in remove) { [l removeFromSuperlayer]; }
|
||
//
|
||
// CAGradientLayer *g = [CAGradientLayer layer];
|
||
// g.colors = @[(__bridge id)[UIColor colorWithHex:0xF4FFFE].CGColor,
|
||
// (__bridge id)[UIColor colorWithHex:0xE8FFF6].CGColor];
|
||
// g.startPoint = CGPointMake(0, 0.5);
|
||
// g.endPoint = CGPointMake(1, 0.5);
|
||
// g.frame = self.infoCard.bounds;
|
||
// [self.infoCard.layer insertSublayer:g atIndex:0];
|
||
}
|
||
|
||
#pragma mark - Public
|
||
- (void)updatePoints:(NSString *)points {
|
||
if (points.length == 0) { points = @"0"; }
|
||
self.amountLabel.text = points;
|
||
}
|
||
|
||
#pragma mark - Actions
|
||
- (void)onRechargeTappedAction {
|
||
if (self.onRechargeTapped) { self.onRechargeTapped(); }
|
||
}
|
||
|
||
#pragma mark - Lazy UI
|
||
- (UIView *)containerView {
|
||
if (!_containerView) {
|
||
_containerView = [UIView new];
|
||
// _containerView.backgroundColor = [UIColor whiteColor];
|
||
}
|
||
return _containerView;
|
||
}
|
||
|
||
- (UILabel *)titleLabel {
|
||
if (!_titleLabel) {
|
||
_titleLabel = [UILabel new];
|
||
_titleLabel.numberOfLines = 0;
|
||
_titleLabel.text = @"Points\nMall"; // 两行展示
|
||
_titleLabel.font = [UIFont systemFontOfSize:30 weight:UIFontWeightBold];
|
||
_titleLabel.textColor = [UIColor colorWithHex:0x1B1F1A];
|
||
}
|
||
return _titleLabel;
|
||
}
|
||
|
||
- (UIImageView *)yellowStarView {
|
||
if (!_yellowStarView) {
|
||
_yellowStarView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_yellowxx_icon"]];
|
||
_yellowStarView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _yellowStarView;
|
||
}
|
||
- (UIImageView *)yellowStarView2 {
|
||
if (!_yellowStarView2) {
|
||
_yellowStarView2 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_yellowxx_icon"]];
|
||
_yellowStarView2.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _yellowStarView2;
|
||
}
|
||
|
||
- (UIImageView *)greenStarView {
|
||
if (!_greenStarView) {
|
||
_greenStarView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_greenxx_icon"]];
|
||
_greenStarView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _greenStarView;
|
||
}
|
||
- (UIImageView *)greenStarView2 {
|
||
if (!_greenStarView2) {
|
||
_greenStarView2 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_greenxx_icon"]];
|
||
_greenStarView2.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _greenStarView2;
|
||
}
|
||
- (UIImageView *)greenStarView3 {
|
||
if (!_greenStarView3) {
|
||
_greenStarView3 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_greenxx_icon"]];
|
||
_greenStarView3.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _greenStarView3;
|
||
}
|
||
|
||
- (UIImageView *)bigCoinView {
|
||
if (!_bigCoinView) {
|
||
_bigCoinView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_headbigBg_icon"]];
|
||
_bigCoinView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _bigCoinView;
|
||
}
|
||
|
||
- (UIView *)infoCard {
|
||
if (!_infoCard) {
|
||
_infoCard = [UIView new];
|
||
}
|
||
return _infoCard;
|
||
}
|
||
|
||
- (UILabel *)myPointsLabel {
|
||
if (!_myPointsLabel) {
|
||
_myPointsLabel = [UILabel new];
|
||
_myPointsLabel.text = @"My Points";
|
||
_myPointsLabel.textColor = [UIColor colorWithHex:KBBlackValue];
|
||
_myPointsLabel.font = [UIFont systemFontOfSize:14 weight:UIFontWeightSemibold];
|
||
}
|
||
return _myPointsLabel;
|
||
}
|
||
|
||
- (UIImageView *)smallCoinView {
|
||
if (!_smallCoinView) {
|
||
_smallCoinView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"shop_jb_icon"]];
|
||
_smallCoinView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _smallCoinView;
|
||
}
|
||
|
||
- (UILabel *)amountLabel {
|
||
if (!_amountLabel) {
|
||
_amountLabel = [UILabel new];
|
||
_amountLabel.text = @"88.00";
|
||
_amountLabel.textColor = [UIColor colorWithHex:KBColorValue];
|
||
_amountLabel.font = [UIFont systemFontOfSize:40 weight:UIFontWeightBold];
|
||
_amountLabel.adjustsFontSizeToFitWidth = YES;
|
||
// _amountLabel.minimumScaleFactor = 0.7;
|
||
}
|
||
return _amountLabel;
|
||
}
|
||
|
||
- (UIButton *)rechargeButton {
|
||
if (!_rechargeButton) {
|
||
_rechargeButton = [UIButton buttonWithType:UIButtonTypeCustom];
|
||
[_rechargeButton setTitle:@"Recharge" forState:UIControlStateNormal];
|
||
[_rechargeButton setTitleColor:[UIColor colorWithHex:KBBlackValue] forState:UIControlStateNormal];
|
||
_rechargeButton.titleLabel.font = [UIFont systemFontOfSize:14 weight:UIFontWeightSemibold];
|
||
UIImage *bg = [UIImage imageNamed:@"recharge_btn_bg"];
|
||
[_rechargeButton setBackgroundImage:bg forState:UIControlStateNormal];
|
||
|
||
//
|
||
// // 切图背景图(可拉伸)
|
||
// UIImage *bg = [UIImage imageNamed:@"recharge_btn_bg"];
|
||
// if (bg) {
|
||
// CGFloat cap = 20; // 圆角拉伸区域
|
||
// bg = [bg resizableImageWithCapInsets:UIEdgeInsetsMake(cap, cap, cap, cap) resizingMode:UIImageResizingModeStretch];
|
||
// [_rechargeButton setBackgroundImage:bg forState:UIControlStateNormal];
|
||
// } else {
|
||
// // 兜底:用绿色渐变生成
|
||
// UIImage *fallback = [UIImage kb_gradientImageWithColors:@[[UIColor colorWithHex:0xA6F6E9], [UIColor colorWithHex:0xD6FFF4]]
|
||
// size:CGSizeMake(120, 40)
|
||
// direction:KBGradientDirectionLeftToRight];
|
||
// [_rechargeButton setBackgroundImage:fallback forState:UIControlStateNormal];
|
||
// }
|
||
//
|
||
// _rechargeButton.layer.cornerRadius = 20;
|
||
// _rechargeButton.layer.masksToBounds = YES;
|
||
[_rechargeButton addTarget:self action:@selector(onRechargeTappedAction) forControlEvents:UIControlEventTouchUpInside];
|
||
}
|
||
return _rechargeButton;
|
||
}
|
||
|
||
@end
|