426 lines
15 KiB
Objective-C
426 lines
15 KiB
Objective-C
//
|
||
// KBSexSelVC.m
|
||
// keyBoard
|
||
//
|
||
// Created by Mac on 2025/11/17.
|
||
// 性别选择页 UI
|
||
|
||
#import "KBSexSelVC.h"
|
||
|
||
/// 性别类型
|
||
typedef NS_ENUM(NSInteger, KBSexOption) {
|
||
KBSexOptionMale = 0,
|
||
KBSexOptionFemale,
|
||
KBSexOptionOther
|
||
};
|
||
|
||
@interface KBSexSelVC ()
|
||
|
||
// 顶部区域
|
||
@property (nonatomic, strong) UIImageView *arrowImageView; // 右上角箭头
|
||
@property (nonatomic, strong) UILabel *titleLabel; // 标题文案
|
||
@property (nonatomic, strong) UIView *titleUnderlineView; // 标题下划线
|
||
@property (nonatomic, strong) UIButton *skipButton; // 跳过按钮
|
||
|
||
// 性别选项 - 男
|
||
@property (nonatomic, strong) UIView *maleCardView; // 男性卡片容器
|
||
@property (nonatomic, strong) UIImageView *maleImageView; // 男性大头像
|
||
@property (nonatomic, strong) UILabel *maleLabel; // “Male” 文案
|
||
|
||
// 性别选项 - 女
|
||
@property (nonatomic, strong) UIView *femaleCardView; // 女性卡片容器
|
||
@property (nonatomic, strong) UIImageView *femaleImageView; // 女性大头像
|
||
@property (nonatomic, strong) UILabel *femaleLabel; // “Female” 文案
|
||
|
||
// 性别选项 - 第三性别
|
||
@property (nonatomic, strong) UIView *otherCardView; // 第三性别卡片容器
|
||
@property (nonatomic, strong) UIImageView *otherLeftImageView;// 左侧问号小图
|
||
@property (nonatomic, strong) UIImageView *otherRightImageView;// 右侧问号小图
|
||
@property (nonatomic, strong) UILabel *otherLabel; // “The Third Gender” 文案
|
||
|
||
// 底部按钮
|
||
@property (nonatomic, strong) UIButton *confirmButton; // Turn On The Keyboard 按钮
|
||
|
||
// 渐变层
|
||
//@property (nonatomic, strong) CAGradientLayer *topGradientLayer;
|
||
@property (nonatomic, strong) UIImageView *bgImageView; // 全屏背景图
|
||
|
||
/// 当前选中的性别
|
||
@property (nonatomic, assign) KBSexOption selectedSex;
|
||
|
||
@end
|
||
|
||
@implementation KBSexSelVC
|
||
|
||
- (void)viewDidLoad {
|
||
[super viewDidLoad];
|
||
// 使用全屏内容，不需要自定义导航栏
|
||
self.kb_enableCustomNavBar = NO;
|
||
self.view.backgroundColor = [UIColor whiteColor];
|
||
self.bgImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"my_bg_icon"]];
|
||
self.bgImageView.contentMode = UIViewContentModeScaleAspectFill;
|
||
[self.view addSubview:self.bgImageView];
|
||
[self.bgImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.edges.equalTo(self.view);
|
||
}];
|
||
[self setupUI];
|
||
|
||
// 默认选中 Male
|
||
[self kb_updateSelection:KBSexOptionMale];
|
||
|
||
|
||
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
|
||
[[KBNetworkManager shared] GET:KB_API_APP_CONFIG parameters:nil headers:nil completion:^(id _Nullable jsonOrData, NSURLResponse * _Nullable response, NSError * _Nullable error) {
|
||
NSLog(@"====");
|
||
}];
|
||
});
|
||
}
|
||
|
||
- (void)viewDidLayoutSubviews {
|
||
[super viewDidLayoutSubviews];
|
||
// 更新渐变背景尺寸
|
||
// self.topGradientLayer.frame = self.topBgView.bounds;
|
||
}
|
||
|
||
#pragma mark - Setup UI
|
||
|
||
/// 构建静态 UI 布局
|
||
- (void)setupUI {
|
||
// 顶部区域
|
||
[self.view addSubview:self.arrowImageView];
|
||
[self.view addSubview:self.titleLabel];
|
||
[self.view addSubview:self.titleUnderlineView];
|
||
[self.view addSubview:self.skipButton];
|
||
|
||
// 三个性别卡片
|
||
[self.view addSubview:self.maleCardView];
|
||
[self.view addSubview:self.maleImageView];
|
||
[self.maleCardView addSubview:self.maleLabel];
|
||
|
||
[self.view addSubview:self.femaleCardView];
|
||
[self.view addSubview:self.femaleImageView];
|
||
[self.femaleCardView addSubview:self.femaleLabel];
|
||
|
||
[self.view addSubview:self.otherCardView];
|
||
[self.view addSubview:self.otherLeftImageView];
|
||
[self.view addSubview:self.otherRightImageView];
|
||
[self.otherCardView addSubview:self.otherLabel];
|
||
|
||
// 底部按钮
|
||
[self.view addSubview:self.confirmButton];
|
||
|
||
// 点击卡片切换选中状态
|
||
UITapGestureRecognizer *tapMale = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(onMaleCardTapped)];
|
||
[self.maleCardView addGestureRecognizer:tapMale];
|
||
UITapGestureRecognizer *tapFemale = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(onFemaleCardTapped)];
|
||
[self.femaleCardView addGestureRecognizer:tapFemale];
|
||
UITapGestureRecognizer *tapOther = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(onOtherCardTapped)];
|
||
[self.otherCardView addGestureRecognizer:tapOther];
|
||
|
||
|
||
// 跳过按钮右上角（跟随安全区）
|
||
[self.skipButton mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.top.equalTo(self.view).offset(54);
|
||
make.right.equalTo(self.view).offset(-16);
|
||
make.height.mas_equalTo(32);
|
||
make.width.mas_greaterThanOrEqualTo(64);
|
||
}];
|
||
;
|
||
|
||
[self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.centerX.equalTo(self.view);
|
||
make.top.equalTo(self.view).offset(KB_NAV_TOTAL_HEIGHT + 40);
|
||
}];
|
||
|
||
[self.arrowImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.right.equalTo(self.view).offset(-KBFit(90));
|
||
make.top.equalTo(self.skipButton).offset(KBFit(15));
|
||
make.width.mas_equalTo(KBFit(220));
|
||
make.height.mas_equalTo(KBFit(99));
|
||
}];
|
||
|
||
// 男性卡片
|
||
[self.maleCardView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.view).offset(20);
|
||
make.right.equalTo(self.view).offset(-20);
|
||
make.top.equalTo(self.arrowImageView.mas_bottom).offset(65);
|
||
make.height.mas_equalTo(KBFit(88));
|
||
}];
|
||
|
||
[self.maleImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.maleCardView).offset(20);
|
||
make.bottom.equalTo(self.maleCardView).offset(-2);
|
||
make.width.mas_equalTo(110);
|
||
make.height.mas_equalTo(140);
|
||
}];
|
||
|
||
[self.maleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.centerY.equalTo(self.maleCardView);
|
||
make.right.equalTo(self.maleCardView).offset(-60);
|
||
}];
|
||
|
||
// 女性卡片
|
||
[self.femaleCardView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.right.equalTo(self.maleCardView);
|
||
make.top.equalTo(self.maleCardView.mas_bottom).offset(65);
|
||
make.height.equalTo(self.maleCardView);
|
||
}];
|
||
|
||
[self.femaleImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.right.equalTo(self.femaleCardView).offset(-12);
|
||
make.bottom.equalTo(self.femaleCardView).offset(-2);
|
||
make.width.mas_equalTo(120);
|
||
make.height.mas_equalTo(133);
|
||
}];
|
||
|
||
[self.femaleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.femaleCardView).offset(60);
|
||
make.centerY.equalTo(self.femaleCardView);
|
||
}];
|
||
|
||
// 第三性别卡片
|
||
[self.otherCardView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.right.equalTo(self.maleCardView);
|
||
make.top.equalTo(self.femaleCardView.mas_bottom).offset(47);
|
||
make.height.equalTo(self.maleCardView);
|
||
}];
|
||
|
||
[self.otherLeftImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.equalTo(self.otherCardView).offset(16);
|
||
make.top.equalTo(self.otherCardView).offset(-15);
|
||
make.width.mas_equalTo(54);
|
||
make.height.mas_equalTo(72);
|
||
}];
|
||
|
||
[self.otherRightImageView mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.right.equalTo(self.otherCardView);
|
||
make.bottom.equalTo(self.otherCardView);
|
||
make.width.mas_equalTo(36);
|
||
make.height.mas_equalTo(41);
|
||
}];
|
||
|
||
[self.otherLabel mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.centerX.equalTo(self.otherCardView);
|
||
make.centerY.equalTo(self.otherCardView);
|
||
}];
|
||
|
||
// 底部按钮
|
||
[self.confirmButton mas_makeConstraints:^(MASConstraintMaker *make) {
|
||
make.left.right.equalTo(self.maleCardView);
|
||
make.height.mas_equalTo(60);
|
||
make.bottom.equalTo(self.view.mas_safeAreaLayoutGuideBottom).offset(-24);
|
||
|
||
}];
|
||
}
|
||
|
||
#pragma mark - Actions
|
||
|
||
/// 点击男生卡片
|
||
- (void)onMaleCardTapped {
|
||
[self kb_updateSelection:KBSexOptionMale];
|
||
}
|
||
|
||
/// 点击女生卡片
|
||
- (void)onFemaleCardTapped {
|
||
[self kb_updateSelection:KBSexOptionFemale];
|
||
}
|
||
|
||
/// 点击第三性别卡片
|
||
- (void)onOtherCardTapped {
|
||
[self kb_updateSelection:KBSexOptionOther];
|
||
}
|
||
|
||
/// 点击跳过
|
||
- (void)onSkipTapped {
|
||
// 触发回调，让外部（如 AppDelegate）切换到主 TabBar
|
||
if (self.didFinishSelectBlock) {
|
||
self.didFinishSelectBlock();
|
||
}
|
||
[[NSUserDefaults standardUserDefaults] setBool:true forKey:KBSexSelectShownKey];
|
||
[[NSUserDefaults standardUserDefaults] synchronize];
|
||
}
|
||
|
||
/// 点击底部“打开键盘”按钮
|
||
- (void)onConfirmTapped {
|
||
// 触发回调，让外部（如 AppDelegate）切换到主 TabBar
|
||
if (self.didFinishSelectBlock) {
|
||
self.didFinishSelectBlock();
|
||
}
|
||
[[NSUserDefaults standardUserDefaults] setBool:true forKey:KBSexSelectShownKey];
|
||
[[NSUserDefaults standardUserDefaults] synchronize];
|
||
}
|
||
|
||
/// 根据当前选中的性别更新三个卡片的 UI
|
||
- (void)kb_updateSelection:(KBSexOption)sex {
|
||
self.selectedSex = sex;
|
||
|
||
[self kb_updateCard:self.maleCardView selected:(sex == KBSexOptionMale)];
|
||
[self kb_updateCard:self.femaleCardView selected:(sex == KBSexOptionFemale)];
|
||
[self kb_updateCard:self.otherCardView selected:(sex == KBSexOptionOther)];
|
||
}
|
||
|
||
/// 统一设置卡片的选中/未选中样式
|
||
- (void)kb_updateCard:(UIView *)card selected:(BOOL)selected {
|
||
card.layer.borderWidth = selected ? 2.0 : 0.0;
|
||
card.layer.borderColor = selected ? [UIColor colorWithHex:KBColorValue].CGColor : [UIColor clearColor].CGColor;
|
||
card.backgroundColor = selected ? [UIColor whiteColor] : [UIColor colorWithHex:0xFAFAFA];
|
||
}
|
||
|
||
#pragma mark - Lazy UI
|
||
|
||
|
||
- (UIImageView *)arrowImageView {
|
||
if (!_arrowImageView) {
|
||
_arrowImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sex_jiantou_icon"]];
|
||
_arrowImageView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _arrowImageView;
|
||
}
|
||
|
||
- (UILabel *)titleLabel {
|
||
if (!_titleLabel) {
|
||
_titleLabel = [UILabel new];
|
||
_titleLabel.text = @"Please Select Your Gender";
|
||
_titleLabel.font = [UIFont systemFontOfSize:22 weight:UIFontWeightSemibold];
|
||
_titleLabel.textColor = [UIColor colorWithHex:KBBlackValue];
|
||
_titleLabel.numberOfLines = 1;
|
||
}
|
||
return _titleLabel;
|
||
}
|
||
|
||
- (UIView *)titleUnderlineView {
|
||
if (!_titleUnderlineView) {
|
||
_titleUnderlineView = [UIView new];
|
||
_titleUnderlineView.backgroundColor = [UIColor colorWithHex:KBColorValue];
|
||
_titleUnderlineView.layer.cornerRadius = 2.0;
|
||
_titleUnderlineView.layer.masksToBounds = YES;
|
||
}
|
||
return _titleUnderlineView;
|
||
}
|
||
|
||
- (UIButton *)skipButton {
|
||
if (!_skipButton) {
|
||
_skipButton = [UIButton buttonWithType:UIButtonTypeCustom];
|
||
[_skipButton setTitle:@"Skip" forState:UIControlStateNormal];
|
||
[_skipButton setTitleColor:[UIColor colorWithHex:KBBlackValue] forState:UIControlStateNormal];
|
||
_skipButton.titleLabel.font = [UIFont systemFontOfSize:14 weight:UIFontWeightMedium];
|
||
_skipButton.backgroundColor = [UIColor colorWithHex:0xE9F7F4];
|
||
_skipButton.layer.cornerRadius = 16;
|
||
_skipButton.layer.masksToBounds = YES;
|
||
[_skipButton addTarget:self action:@selector(onSkipTapped) forControlEvents:UIControlEventTouchUpInside];
|
||
}
|
||
return _skipButton;
|
||
}
|
||
|
||
- (UIView *)maleCardView {
|
||
if (!_maleCardView) {
|
||
_maleCardView = [UIView new];
|
||
// 默认未选中背景
|
||
_maleCardView.backgroundColor = [UIColor colorWithHex:0xFAFAFA];
|
||
_maleCardView.layer.cornerRadius = 24.0;
|
||
_maleCardView.layer.masksToBounds = YES;
|
||
// 边框样式由 kb_updateSelection 统一控制，这里先不设置宽度
|
||
_maleCardView.layer.borderWidth = 0.0;
|
||
_maleCardView.layer.borderColor = [UIColor colorWithHex:KBColorValue].CGColor;
|
||
}
|
||
return _maleCardView;
|
||
}
|
||
|
||
- (UIImageView *)maleImageView {
|
||
if (!_maleImageView) {
|
||
_maleImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sex_nan_icon"]];
|
||
_maleImageView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _maleImageView;
|
||
}
|
||
|
||
- (UILabel *)maleLabel {
|
||
if (!_maleLabel) {
|
||
_maleLabel = [UILabel new];
|
||
_maleLabel.text = @"Male";
|
||
_maleLabel.font = [UIFont systemFontOfSize:20 weight:UIFontWeightSemibold];
|
||
_maleLabel.textColor = [UIColor colorWithHex:KBBlackValue];
|
||
}
|
||
return _maleLabel;
|
||
}
|
||
|
||
- (UIView *)femaleCardView {
|
||
if (!_femaleCardView) {
|
||
_femaleCardView = [UIView new];
|
||
_femaleCardView.backgroundColor = [UIColor colorWithHex:0xFAFAFA];
|
||
_femaleCardView.layer.cornerRadius = 24.0;
|
||
_femaleCardView.layer.masksToBounds = YES;
|
||
}
|
||
return _femaleCardView;
|
||
}
|
||
|
||
- (UIImageView *)femaleImageView {
|
||
if (!_femaleImageView) {
|
||
_femaleImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sex_nv_icon"]];
|
||
_femaleImageView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _femaleImageView;
|
||
}
|
||
|
||
- (UILabel *)femaleLabel {
|
||
if (!_femaleLabel) {
|
||
_femaleLabel = [UILabel new];
|
||
_femaleLabel.text = @"Female";
|
||
_femaleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightRegular];
|
||
_femaleLabel.textColor = [UIColor colorWithHex:KBBlackValue];
|
||
}
|
||
return _femaleLabel;
|
||
}
|
||
|
||
- (UIView *)otherCardView {
|
||
if (!_otherCardView) {
|
||
_otherCardView = [UIView new];
|
||
_otherCardView.backgroundColor = [UIColor colorWithHex:0xFAFAFA];
|
||
_otherCardView.layer.cornerRadius = 24.0;
|
||
_otherCardView.layer.masksToBounds = YES;
|
||
}
|
||
return _otherCardView;
|
||
}
|
||
|
||
- (UIImageView *)otherLeftImageView {
|
||
if (!_otherLeftImageView) {
|
||
_otherLeftImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sex_otherbig_icon"]];
|
||
_otherLeftImageView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _otherLeftImageView;
|
||
}
|
||
|
||
- (UIImageView *)otherRightImageView {
|
||
if (!_otherRightImageView) {
|
||
_otherRightImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sex_othersmall_icon"]];
|
||
_otherRightImageView.contentMode = UIViewContentModeScaleAspectFit;
|
||
}
|
||
return _otherRightImageView;
|
||
}
|
||
|
||
- (UILabel *)otherLabel {
|
||
if (!_otherLabel) {
|
||
_otherLabel = [UILabel new];
|
||
_otherLabel.text = @"The Third Gender";
|
||
_otherLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightRegular];
|
||
_otherLabel.textColor = [UIColor colorWithHex:KBBlackValue];
|
||
}
|
||
return _otherLabel;
|
||
}
|
||
|
||
- (UIButton *)confirmButton {
|
||
if (!_confirmButton) {
|
||
_confirmButton = [UIButton buttonWithType:UIButtonTypeCustom];
|
||
[_confirmButton setTitle:@"Turn On The Keyboard" forState:UIControlStateNormal];
|
||
[_confirmButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
|
||
_confirmButton.titleLabel.font = [UIFont systemFontOfSize:18 weight:UIFontWeightSemibold];
|
||
_confirmButton.backgroundColor = [UIColor blackColor];
|
||
_confirmButton.layer.cornerRadius = 30;
|
||
_confirmButton.layer.masksToBounds = YES;
|
||
[_confirmButton addTarget:self action:@selector(onConfirmTapped) forControlEvents:UIControlEventTouchUpInside];
|
||
}
|
||
return _confirmButton;
|
||
}
|
||
|
||
@end
|