zw/keyboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

3

Browse Source
This commit is contained in:
CodeST
2025-11-06 14:59:00 +08:00
parent 15fc9621cd
commit a1db745b6c
9 changed files with 517 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
keyBoard/Class/Home/V/HomeHotCell.h Normal file
View File

@@ -0,0 +1,20 @@
//
// HomeHotCell.h
// keyBoard
//
// 自定义 cell：左侧序号与圆形头像，占位标题/副标题，右侧加入按钮。
//
#import "BaseCell.h"
NS_ASSUME_NONNULL_BEGIN
@interface HomeHotCell : BaseCell
/// 配置数据
- (void)configWithRank:(NSInteger)rank title:(NSString *)title subtitle:(NSString *)sub joined:(BOOL)joined;
@end
NS_ASSUME_NONNULL_END

134
keyBoard/Class/Home/V/HomeHotCell.m Normal file
View File

@@ -0,0 +1,134 @@
//
// HomeHotCell.m
// keyBoard
//
#import "HomeHotCell.h"
@interface HomeHotCell()
// 左侧序号
@property (nonatomic, strong) UILabel *rankLabel;
// 左侧圆形头像占位
@property (nonatomic, strong) UIView *avatarView;
// 标题
@property (nonatomic, strong) UILabel *titleLabel;
// 副标题
@property (nonatomic, strong) UILabel *subLabel;
// 右侧加入按钮（或已加入勾选）
@property (nonatomic, strong) UIButton *actionButton;
@end
@implementation HomeHotCell
- (void)setupUI {
[super setupUI];
// 添加控件
[self.contentView addSubview:self.rankLabel];
[self.contentView addSubview:self.avatarView];
[self.contentView addSubview:self.titleLabel];
[self.contentView addSubview:self.subLabel];
[self.contentView addSubview:self.actionButton];
// 布局（使用 Masonry）
[self.rankLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.contentView).offset(16);
make.centerY.equalTo(self.contentView);
}];
[self.avatarView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.rankLabel.mas_right).offset(12);
make.centerY.equalTo(self.contentView);
make.width.height.mas_equalTo(52);
}];
[self.actionButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.equalTo(self.contentView);
make.right.equalTo(self.contentView).offset(-16);
make.width.mas_equalTo(64);
make.height.mas_equalTo(36);
}];
[self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.avatarView.mas_right).offset(12);
make.top.equalTo(self.avatarView.mas_top).offset(-2);
make.right.lessThanOrEqualTo(self.actionButton.mas_left).offset(-12);
}];
[self.subLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.titleLabel);
make.right.equalTo(self.titleLabel);
make.bottom.equalTo(self.avatarView.mas_bottom).offset(2);
}];
}
- (void)configWithRank:(NSInteger)rank title:(NSString *)title subtitle:(NSString *)sub joined:(BOOL)joined {
self.rankLabel.text = [NSString stringWithFormat:@"%ld", (long)rank];
self.titleLabel.text = title ?: @"";
self.subLabel.text = sub ?: @"";
if (joined) {
// 已加入状态：灰背景、打勾
[self.actionButton setTitle:@"✓" forState:UIControlStateNormal];
[self.actionButton setTitleColor:[UIColor colorWithWhite:0.45 alpha:1] forState:UIControlStateNormal];
self.actionButton.backgroundColor = [UIColor colorWithWhite:0.92 alpha:1];
} else {
// 可加入状态：绿色加号
[self.actionButton setTitle:@"+" forState:UIControlStateNormal];
[self.actionButton setTitleColor:[UIColor colorWithRed:0.20 green:0.65 blue:0.50 alpha:1.0] forState:UIControlStateNormal];
self.actionButton.backgroundColor = [UIColor colorWithRed:0.88 green:0.97 blue:0.93 alpha:1.0];
}
}
#pragma mark - Lazy
- (UILabel *)rankLabel {
if (!_rankLabel) {
_rankLabel = [[UILabel alloc] init];
_rankLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
_rankLabel.textColor = [UIColor colorWithRed:0.15 green:0.55 blue:0.45 alpha:1.0];
}
return _rankLabel;
}
- (UIView *)avatarView {
if (!_avatarView) {
_avatarView = [[UIView alloc] init];
_avatarView.backgroundColor = [UIColor colorWithWhite:0.9 alpha:1];
_avatarView.layer.cornerRadius = 26;
_avatarView.layer.masksToBounds = YES;
}
return _avatarView;
}
- (UILabel *)titleLabel {
if (!_titleLabel) {
_titleLabel = [[UILabel alloc] init];
_titleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
_titleLabel.textColor = [UIColor colorWithWhite:0.1 alpha:1];
}
return _titleLabel;
}
- (UILabel *)subLabel {
if (!_subLabel) {
_subLabel = [[UILabel alloc] init];
_subLabel.font = [UIFont systemFontOfSize:13];
_subLabel.textColor = [UIColor colorWithWhite:0.5 alpha:1];
_subLabel.numberOfLines = 1;
}
return _subLabel;
}
- (UIButton *)actionButton {
if (!_actionButton) {
_actionButton = [UIButton buttonWithType:UIButtonTypeCustom];
_actionButton.layer.cornerRadius = 18;
_actionButton.layer.masksToBounds = YES;
_actionButton.titleLabel.font = [UIFont systemFontOfSize:20 weight:UIFontWeightBold];
}
return _actionButton;
}
@end

21
keyBoard/Class/Home/V/KBTopThreeView.h Normal file
View File

@@ -0,0 +1,21 @@
//
// KBTopThreeView.h
// keyBoard
//
// 顶部前三名展示视图：内部横向三栏，样式参考设计图。
//
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
/// 用于 HomeHot 顶部展示前三名的视图
@interface KBTopThreeView : UIView
/// 配置三项内容（数组元素可传 @{ @"title":NSString, @"rank":@(1/2/3) }）
- (void)configWithItems:(NSArray<NSDictionary *> *)items;
@end
NS_ASSUME_NONNULL_END

220
keyBoard/Class/Home/V/KBTopThreeView.m Normal file
View File

@@ -0,0 +1,220 @@
//
// KBTopThreeView.m
// keyBoard
//
#import "KBTopThreeView.h"
@interface KBTopThreeCardView : UIView
/// 头像占位（圆形描边）
@property (nonatomic, strong) UIView *avatarCircleView;
/// 彩条卡片背景
@property (nonatomic, strong) UIView *cardView;
/// 勋章数字（1/2/3）
@property (nonatomic, strong) UILabel *medalLabel;
/// 标题
@property (nonatomic, strong) UILabel *titleLabel;
/// 底部加号按钮
@property (nonatomic, strong) UIButton *plusButton;
/// 渲染
- (void)renderWithTitle:(NSString *)title rank:(NSInteger)rank;
@end
@implementation KBTopThreeCardView
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
[self setupUI];
}
return self;
}
- (void)setupUI {
// 卡片
[self addSubview:self.cardView];
// 头像圆圈
[self addSubview:self.avatarCircleView];
[self.cardView addSubview:self.medalLabel];
[self.cardView addSubview:self.titleLabel];
// 加号按钮
[self addSubview:self.plusButton];
// 布局
[self.avatarCircleView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self);
make.centerX.equalTo(self);
make.width.height.mas_equalTo(68);
}];
[self.cardView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.avatarCircleView.mas_bottom).offset(-34); // 顶部悬浮重叠
make.left.right.equalTo(self);
make.height.mas_equalTo(146);
}];
[self.medalLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.cardView).offset(34 + 15);
make.centerX.equalTo(self.cardView);
make.width.height.mas_equalTo(28);
}];
[self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerX.equalTo(self.cardView);
make.top.equalTo(self.medalLabel.mas_bottom).offset(20);
}];
[self.plusButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.cardView.mas_bottom).offset(12);
make.centerX.equalTo(self);
make.width.mas_equalTo(52);
make.height.mas_equalTo(28);
make.bottom.equalTo(self.mas_bottom); // 由外部控制总体高度
}];
}
- (void)renderWithTitle:(NSString *)title rank:(NSInteger)rank {
self.titleLabel.text = title.length ? title : @"";
self.medalLabel.text = [NSString stringWithFormat:@"%ld", (long)rank];
// 不同名次数的配色
UIColor *theme;
switch (rank) {
case 1: theme = [UIColor colorWithRed:1.00 green:0.86 blue:0.43 alpha:1.0]; break; // 金
case 2: theme = [UIColor colorWithRed:0.68 green:0.80 blue:1.00 alpha:1.0]; break; // 蓝
default: theme = [UIColor colorWithRed:1.00 green:0.78 blue:0.63 alpha:1.0]; break; // 橙
}
self.cardView.backgroundColor = theme;
self.plusButton.backgroundColor = [theme colorWithAlphaComponent:0.3];
// 圆圈描边
self.avatarCircleView.layer.borderColor = [UIColor colorWithRed:0.83 green:0.95 blue:0.27 alpha:1.0].CGColor;
}
#pragma mark - Lazy
- (UIView *)avatarCircleView {
if (!_avatarCircleView) {
_avatarCircleView = [[UIView alloc] init];
_avatarCircleView.backgroundColor = [UIColor whiteColor];
_avatarCircleView.layer.cornerRadius = 34;
_avatarCircleView.layer.borderWidth = 2.0;
_avatarCircleView.layer.borderColor = [UIColor colorWithWhite:0.9 alpha:1].CGColor;
// 可在此加入头像 UIImageView
}
return _avatarCircleView;
}
- (UIView *)cardView {
if (!_cardView) {
_cardView = [[UIView alloc] init];
_cardView.layer.cornerRadius = 14.0;
_cardView.layer.masksToBounds = YES;
_cardView.backgroundColor = [UIColor colorWithWhite:0.95 alpha:1];
}
return _cardView;
}
- (UILabel *)medalLabel {
if (!_medalLabel) {
_medalLabel = [[UILabel alloc] init];
_medalLabel.textAlignment = NSTextAlignmentCenter;
_medalLabel.font = [UIFont boldSystemFontOfSize:15];
_medalLabel.textColor = [UIColor whiteColor];
_medalLabel.backgroundColor = [UIColor colorWithWhite:0.3 alpha:0.7];
_medalLabel.layer.cornerRadius = 14;
_medalLabel.layer.masksToBounds = YES;
}
return _medalLabel;
}
- (UILabel *)titleLabel {
if (!_titleLabel) {
_titleLabel = [[UILabel alloc] init];
_titleLabel.textColor = [UIColor colorWithWhite:0.1 alpha:1];
_titleLabel.font = [UIFont systemFontOfSize:16 weight:UIFontWeightSemibold];
_titleLabel.textAlignment = NSTextAlignmentCenter;
}
return _titleLabel;
}
- (UIButton *)plusButton {
if (!_plusButton) {
_plusButton = [UIButton buttonWithType:UIButtonTypeCustom];
[_plusButton setTitle:@"+" forState:UIControlStateNormal];
[_plusButton setTitleColor:[UIColor colorWithRed:0.20 green:0.65 blue:0.50 alpha:1.0] forState:UIControlStateNormal];
_plusButton.titleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
_plusButton.layer.cornerRadius = 14.0;
_plusButton.layer.masksToBounds = YES;
}
return _plusButton;
}
@end
@interface KBTopThreeView()
@property (nonatomic, strong) KBTopThreeCardView *leftCard;
@property (nonatomic, strong) KBTopThreeCardView *centerCard;
@property (nonatomic, strong) KBTopThreeCardView *rightCard;
@end
@implementation KBTopThreeView
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
self.backgroundColor = [UIColor colorWithWhite:0.98 alpha:1];
[self setupUI];
}
return self;
}
- (void)setupUI {
[self addSubview:self.leftCard];
[self addSubview:self.centerCard];
[self addSubview:self.rightCard];
// 横向均分布局
[self.centerCard mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerX.equalTo(self);
make.top.equalTo(self).offset(8);
make.width.equalTo(self.mas_width).multipliedBy(1.0/3.0).offset(-12);
}];
[self.leftCard mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.centerCard);
make.right.equalTo(self.centerCard.mas_left).offset(-8);
make.width.equalTo(self.centerCard);
}];
[self.rightCard mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.centerCard);
make.left.equalTo(self.centerCard.mas_right).offset(8);
make.width.equalTo(self.centerCard);
}];
// 让最右/最左卡片对齐底部，撑起本视图
[self.leftCard mas_makeConstraints:^(MASConstraintMaker *make) { make.bottom.equalTo(self).offset(-8); }];
[self.rightCard mas_makeConstraints:^(MASConstraintMaker *make) { make.bottom.equalTo(self).offset(-8); }];
}
- (void)configWithItems:(NSArray<NSDictionary *> *)items {
// items 顺序任意，这里按 rank 分配：1 放中间，2 左，3 右
NSString *t1 = @"", *t2 = @"", *t3 = @"";
for (NSDictionary *d in items) {
NSInteger r = [d[@"rank"] integerValue];
NSString *title = d[@"title"] ?: @"";
if (r == 1) t1 = title;
else if (r == 2) t2 = title;
else if (r == 3) t3 = title;
}
[self.centerCard renderWithTitle:t1 rank:1];
[self.leftCard renderWithTitle:t2 rank:2];
[self.rightCard renderWithTitle:t3 rank:3];
}
#pragma mark - Lazy
- (KBTopThreeCardView *)leftCard { if (!_leftCard) _leftCard = [KBTopThreeCardView new]; return _leftCard; }
- (KBTopThreeCardView *)centerCard { if (!_centerCard) _centerCard = [KBTopThreeCardView new]; return _centerCard; }
- (KBTopThreeCardView *)rightCard { if (!_rightCard) _rightCard = [KBTopThreeCardView new]; return _rightCard; }
@end