Skip to content

陈高翔 / DreamSleep-iOS

转到一个项目
切换导航栏
切换导航栏固定状态
Commit 8e23981c 由 cgx
选项

完成滑块时间控件UI

1 个父辈 6e0e758e
内嵌 并排
正在显示 7 个修改的文件 包含 289 行增加 和 38 行删除
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/ReadyListController.m
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
#import "JXMovableCellTableView.h" #import "JXMovableCellTableView.h"
#import "SleepReadyRequestModel.h" #import "SleepReadyRequestModel.h"
#import "RelaxItemsView.h" #import "RelaxItemsView.h"
#import "ReadyItem.h"
@interface ReadyListController () <JXMovableCellTableViewDataSource, JXMovableCellTableViewDelegate> @interface ReadyListController () <JXMovableCellTableViewDataSource, JXMovableCellTableViewDelegate>
@property (nonatomic, strong) RelaxItemsView *relaxItemsView; @property (nonatomic, strong) RelaxItemsView *relaxItemsView;
...@@ -40,8 +41,6 @@ ...@@ -40,8 +41,6 @@
[self.view addSubview:self.relaxItemsView]; [self.view addSubview:self.relaxItemsView];
[self.view addSubview:self.prepareItemsView]; [self.view addSubview:self.prepareItemsView];
[self queryPreparePeaceListRequest];
} }
- (void)queryPreparePeaceListRequest { - (void)queryPreparePeaceListRequest {
...@@ -52,7 +51,7 @@ ...@@ -52,7 +51,7 @@
self.relax_items = requestModel.relax_items; self.relax_items = requestModel.relax_items;
self.prepare_items = requestModel.prepare_items; self.prepare_items = requestModel.prepare_items;
[self.relaxItemsView adjustRelax:self.relax_items]; [self.relaxItemsView adjustRelax:self.relax_items relaxTime:requestModel.relax_time];
[self.prepareItemsView reloadData]; [self.prepareItemsView reloadData];
} }
}]; }];
...@@ -75,6 +74,7 @@ ...@@ -75,6 +74,7 @@
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier]; cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
cell.selectionStyle = UITableViewCellSelectionStyleNone; cell.selectionStyle = UITableViewCellSelectionStyleNone;
} }
cell.backgroundColor = DSClearColor;
cell.textLabel.text = [NSString stringWithFormat:@"%ld", indexPath.row + 1]; cell.textLabel.text = [NSString stringWithFormat:@"%ld", indexPath.row + 1];
return cell; return cell;
} }
...@@ -96,6 +96,18 @@ ...@@ -96,6 +96,18 @@
[self.prepareItemsView reloadData]; [self.prepareItemsView reloadData];
} }
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
ReadyItem *item = self.prepare_items[indexPath.row];
#warning 模拟业务逻辑
if (indexPath.row == 0) {
// 移除
[self.relaxItemsView removeItem:1];
} else if (indexPath.row == 1) {
// 添加
[self.relaxItemsView addItem:item];
}
}
#pragma mark - lazy #pragma mark - lazy
- (RelaxItemsView *)relaxItemsView { - (RelaxItemsView *)relaxItemsView {
if (!_relaxItemsView) { if (!_relaxItemsView) {
......
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/ReadyTimeMarker.h
...@@ -9,9 +9,20 @@ ...@@ -9,9 +9,20 @@
NS_ASSUME_NONNULL_BEGIN NS_ASSUME_NONNULL_BEGIN
@class ReadyTimeMarker;
@protocol ReadyTimeMarkerDelegate <NSObject>
/// 首次触摸获获取触摸浮标
/// @param marker marker
- (void)touchesBeganWithMarker:(ReadyTimeMarker *)marker;
- (void)moveMarkerWithTranslationX:(CGFloat)translationX;
@end
/// 安睡准备时间调整控制器 /// 安睡准备时间调整控制器
@interface ReadyTimeMarker : UIView @interface ReadyTimeMarker : UIView
@property (nonatomic, weak) id<ReadyTimeMarkerDelegate> delegate;
@end @end
NS_ASSUME_NONNULL_END NS_ASSUME_NONNULL_END
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/ReadyTimeMarker.m
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
#import "ReadyTimeMarker.h" #import "ReadyTimeMarker.h"
@interface ReadyTimeMarker () <UIGestureRecognizerDelegate> @interface ReadyTimeMarker ()
@end @end
@implementation ReadyTimeMarker @implementation ReadyTimeMarker
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
[self addSubview:dotView]; [self addSubview:dotView];
[markIV mas_makeConstraints:^(MASConstraintMaker *make) { [markIV mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.bottom.equalTo(self); make.centerX.bottom.equalTo(self);
make.width.height.equalTo(@30); make.width.height.equalTo(@30);
}]; }];
[dotView mas_makeConstraints:^(MASConstraintMaker *make) { [dotView mas_makeConstraints:^(MASConstraintMaker *make) {
...@@ -36,25 +36,24 @@ ...@@ -36,25 +36,24 @@
}]; }];
// 添加拖动手势 // 添加拖动手势
UIPanGestureRecognizer *panGesture = [UIPanGestureRecognizer new]; UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panAction:)];
panGesture.delegate = self;
[self addGestureRecognizer:panGesture]; [self addGestureRecognizer:panGesture];
} }
return self; return self;
} }
#pragma mark - UIGestureRecognizerDelegate - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
- (BOOL)gestureRecognizerShouldBegin:(UIPanGestureRecognizer *)gestureRecognizer { if (self.delegate && [self.delegate respondsToSelector:@selector(touchesBeganWithMarker:)]) {
CGPoint translation = [gestureRecognizer translationInView:gestureRecognizer.view]; [self.delegate touchesBeganWithMarker:self];
CGPoint locationPoint = [gestureRecognizer locationInView:gestureRecognizer.view]; }
if (translation.x < 0) { }
// 向左滑
NSLog(@"向左滑"); - (void)panAction:(UIPanGestureRecognizer *)panGR {
} else if (translation.x > 0) { CGPoint translation = [panGR translationInView:panGR.view.superview];
// 向右滑 [panGR setTranslation:CGPointZero inView:panGR.view.superview];
NSLog(@"向右滑"); if (self.delegate && [self.delegate respondsToSelector:@selector(moveMarkerWithTranslationX:)]) {
[self.delegate moveMarkerWithTranslationX:translation.x];
} }
return NO;
} }
- (void)drawRect:(CGRect)rect { - (void)drawRect:(CGRect)rect {
......
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/RelaxItemsView.h
...@@ -6,12 +6,24 @@ ...@@ -6,12 +6,24 @@
// //
#import <UIKit/UIKit.h> #import <UIKit/UIKit.h>
#import "ReadyItemCell.h"
NS_ASSUME_NONNULL_BEGIN NS_ASSUME_NONNULL_BEGIN
@interface RelaxItemsView : UIView @interface RelaxItemsView : UIView
- (void)adjustRelax:(NSArray *)relax_items; /// 重置任务
/// @param relax_items relax_items
/// @param relax_time 放松总时长
- (void)adjustRelax:(NSArray *)relax_items relaxTime:(int)relax_time;
/// 移除任务
/// @param item_id 任务id
- (void)removeItem:(int)item_id;
/// 添加任务项
/// @param item item
- (void)addItem:(ReadyItem *)item;
@end @end
......
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/RelaxItemsView.m
...@@ -6,21 +6,52 @@ ...@@ -6,21 +6,52 @@
// //
#import "RelaxItemsView.h" #import "RelaxItemsView.h"
#import "ReadyItemCell.h"
#import "ReadyTimeMarker.h" #import "ReadyTimeMarker.h"
@interface RelaxItemsView () @interface RelaxItemsView () <ReadyTimeMarkerDelegate>
@property (nonatomic, strong) NSMutableArray *relax_items;
@property (nonatomic, strong) NSMutableArray *itemCells;
@property (nonatomic, strong) NSMutableArray *markers;
@property (nonatomic, strong) NSMutableArray *timeWidths;
@property (nonatomic, assign) NSUInteger curMarkerIndex;
@property (nonatomic, strong) ReadyTimeMarker *curMarker;
@property (nonatomic, strong) ReadyItemCell *leftItemCell;
@property (nonatomic, strong) ReadyItemCell *rightItemCell;
@property (nonatomic, assign) CGFloat divideW;
@property (nonatomic, assign) CGFloat itemLeftMargin;
@property (nonatomic, assign) CGFloat markerLeftMargin;
@end @end
@implementation RelaxItemsView @implementation RelaxItemsView {
CGFloat _lineMargin;
CGFloat _lineW;
CGFloat _itemW;
CGFloat _markerW;
CGFloat _topMargin;
CGFloat _itemBottomMargin;
CGFloat _markerBottomMargin;
int _relax_time;
}
- (instancetype)initWithFrame:(CGRect)frame { - (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) { if (self = [super initWithFrame:frame]) {
self.relax_items = [NSMutableArray array];
self.itemCells = [NSMutableArray array];
self.markers = [NSMutableArray array];
self.timeWidths = [NSMutableArray array];
_lineMargin = 22.0;
_lineW = self.width - 2*_lineMargin;
_itemW = 40.0;
_markerW = 40.0;
_topMargin = 24.0;
_itemBottomMargin = 47.0;
_markerBottomMargin = 19.0;
self.dk_backgroundColorPicker = DKColorPickerWithKey(TabBarBG); self.dk_backgroundColorPicker = DKColorPickerWithKey(TabBarBG);
[self cornerRadius:24.0]; [self cornerRadius:24.0];
UIView *xAxis = [[UIView alloc] initWithFrame:CGRectMake(22, (self.height - 2)/2.0, self.width - 44, 2)]; UIView *xAxis = [[UIView alloc] initWithFrame:CGRectMake(_lineMargin, (self.height - 2)/2.0, self.width - 2*_lineMargin, 2)];
[xAxis cornerRadius:1.0]; [xAxis cornerRadius:1.0];
xAxis.dk_backgroundColorPicker = DKColorPickerWithColors(ColorFromHex(0xDDDDDD), ColorFromHex(0x3B4258), DSWhite); xAxis.dk_backgroundColorPicker = DKColorPickerWithColors(ColorFromHex(0xDDDDDD), ColorFromHex(0x3B4258), DSWhite);
[self addSubview:xAxis]; [self addSubview:xAxis];
...@@ -28,24 +59,209 @@ ...@@ -28,24 +59,209 @@
return self; return self;
} }
- (void)adjustRelax:(NSArray *)relax_items { #pragma mark - public
CGFloat lineMargin = 22; - (void)adjustRelax:(NSArray *)relax_items relaxTime:(int)relax_time {
CGFloat lineW = self.width - 2*lineMargin; if (self.relax_items.count || relax_time <= 0) {
CGFloat divideW = lineW / relax_items.count; return;
CGFloat itemW = 40; }
CGFloat itemLeftMargin = lineMargin + (divideW - itemW) / 2.0; _relax_time = relax_time;
for (int index = 0; index < relax_items.count; index++) { [self.relax_items addObjectsFromArray:relax_items];
ReadyItemCell *itemCell = [[ReadyItemCell alloc] initWithFrame:CGRectMake(itemLeftMargin + index * divideW, 24, itemW, self.height - 24 - 47) itemCellType:ItemCellTypeAdjust];
itemCell.item = relax_items[index]; for (int index = 0; index < self.relax_items.count; index++) {
ReadyItemCell *itemCell = [[ReadyItemCell alloc] initWithFrame:CGRectMake(self.itemLeftMargin + index * self.divideW, _topMargin, _itemW, self.height - _topMargin - _itemBottomMargin) itemCellType:ItemCellTypeAdjust];
ReadyItem *item = self.relax_items[index];
itemCell.item = item;
[self addSubview:itemCell]; [self addSubview:itemCell];
// 动态计算item区域宽度
CGFloat timeW = (double)item.time * _lineW /(double)_relax_time;
[self.timeWidths addObject:@(timeW)];
[self.itemCells addObject:itemCell];
} }
CGFloat markerW = 30; for (int index = 0; index < self.relax_items.count - 1; index++) {
CGFloat markerLeftMargin = lineMargin + divideW - markerW/2.0; ReadyTimeMarker *marker = [[ReadyTimeMarker alloc] initWithFrame:CGRectMake(self.markerLeftMargin + index * self.divideW, _topMargin, _markerW, self.height - _topMargin - _markerBottomMargin)];
for (int index = 0; index < relax_items.count - 1; index++) { marker.delegate = self;
ReadyTimeMarker *marker = [[ReadyTimeMarker alloc] initWithFrame:CGRectMake(markerLeftMargin + index * divideW, 24, markerW, self.height - 24 - 19)];
[self addSubview:marker]; [self addSubview:marker];
[self.markers addObject:marker];
}
// 根据时长动态调整itemCell和marker位置
NSUInteger itemsCount = self.relax_items.count;
CGFloat leftAllTimeW1 = 0;
CGFloat leftAllTimeW2 = 0;
for (int index = 0; index < itemsCount; index++) {
CGFloat timeW = [self.timeWidths[index] doubleValue];
if (index != itemsCount - 1) {
leftAllTimeW1 += timeW;
ReadyTimeMarker *marker = self.markers[index];
marker.centerX = _lineMargin + leftAllTimeW1;
}
ReadyItemCell *itemCell = self.itemCells[index];
itemCell.centerX = _lineMargin + timeW/2.0 + leftAllTimeW2;
leftAllTimeW2 += timeW;
}
}
- (void)removeItem:(int)item_id {
[self.relax_items enumerateObjectsUsingBlock:^(ReadyItem * obj, NSUInteger idx, BOOL * _Nonnull stop) {
if (item_id == obj.item_id) {
*stop = YES;
// 删除
[self.relax_items removeObject:obj];
[self.timeWidths removeObjectAtIndex:idx];
ReadyItemCell *removeCell = self.itemCells[idx];
[removeCell removeFromSuperview];
[self.itemCells removeObjectAtIndex:idx];
if (self.markers.count) {
ReadyTimeMarker *marker = self.markers[0];
[marker removeFromSuperview];
[self.markers removeObjectAtIndex:0];
}
// 重新计算timeWidth，取平均值
NSUInteger itemsCount = self.relax_items.count;
CGFloat divideTimeW = _lineW / itemsCount;
CGFloat divideTime = _relax_time / itemsCount;
for (int index = 0; index < itemsCount; index++) {
self.timeWidths[index] = @(divideTimeW);
ReadyItem *item = self.relax_items[index];
item.time = divideTime;
}
// 根据时长动态调整itemCell和marker位置
CGFloat leftAllTimeW1 = 0;
CGFloat leftAllTimeW2 = 0;
for (int index = 0; index < itemsCount; index++) {
CGFloat timeW = [self.timeWidths[index] doubleValue];
if (index != itemsCount - 1) {
leftAllTimeW1 += timeW;
ReadyTimeMarker *marker = self.markers[index];
[UIView animateWithDuration:.3 animations:^{
marker.centerX = self->_lineMargin + leftAllTimeW1;
}];
}
ReadyItemCell *itemCell = self.itemCells[index];
[UIView animateWithDuration:.3 animations:^{
itemCell.centerX = self->_lineMargin + timeW/2.0 + leftAllTimeW2;
}];
leftAllTimeW2 += timeW;
}
}
}];
}
- (void)addItem:(ReadyItem *)item {
__block BOOL hasItem = NO;
[self.relax_items enumerateObjectsUsingBlock:^(ReadyItem * obj, NSUInteger idx, BOOL * _Nonnull stop) {
if (item.item_id == obj.item_id) {
hasItem = YES;
}
}];
if (hasItem) {
return;
}
[self.relax_items addObject:item];
ReadyItemCell *itemCell = [[ReadyItemCell alloc] initWithFrame:CGRectMake(0, _topMargin, _itemW, self.height - _topMargin - _itemBottomMargin) itemCellType:ItemCellTypeAdjust];
itemCell.item = item;
[self addSubview:itemCell];
[self.timeWidths addObject:@(0)];
[self.itemCells addObject:itemCell];
ReadyTimeMarker *marker = [[ReadyTimeMarker alloc] initWithFrame:CGRectMake(0, _topMargin, _markerW, self.height - _topMargin - _markerBottomMargin)];
marker.delegate = self;
[self addSubview:marker];
[self.markers addObject:marker];
// 重新计算timeWidth，取平均值
NSUInteger itemsCount = self.relax_items.count;
CGFloat divideTimeW = _lineW / itemsCount;
CGFloat divideTime = _relax_time / itemsCount;
for (int index = 0; index < itemsCount; index++) {
self.timeWidths[index] = @(divideTimeW);
ReadyItem *item = self.relax_items[index];
item.time = divideTime;
} }
// 根据时长动态调整itemCell和marker位置
CGFloat leftAllTimeW1 = 0;
CGFloat leftAllTimeW2 = 0;
for (int index = 0; index < itemsCount; index++) {
CGFloat timeW = [self.timeWidths[index] doubleValue];
if (index != itemsCount - 1) {
leftAllTimeW1 += timeW;
ReadyTimeMarker *marker = self.markers[index];
[UIView animateWithDuration:.3 animations:^{
marker.centerX = self->_lineMargin + leftAllTimeW1;
}];
}
ReadyItemCell *itemCell = self.itemCells[index];
[UIView animateWithDuration:.3 animations:^{
itemCell.centerX = self->_lineMargin + timeW/2.0 + leftAllTimeW2;
}];
leftAllTimeW2 += timeW;
}
}
#pragma mark - ReadyTimeMarkerDelegate
- (void)touchesBeganWithMarker:(ReadyTimeMarker *)marker {
self.curMarker = marker;
// 获取当前滑块索引
NSUInteger index = [self.markers indexOfObject:marker];
self.curMarkerIndex = index;
// 根据滑块索引获取左右2个itemCell
self.leftItemCell = self.itemCells[index];
self.rightItemCell = self.itemCells[index + 1];
}
- (void)moveMarkerWithTranslationX:(CGFloat)translationX {
// 滑块最小值
CGFloat min = 0;
// 滑块最大值
CGFloat max = 0;
// 偏差值
CGFloat error = 0;
if (self.curMarkerIndex == 0) { // 2个或者3个item，处理最开始2个item
min = _lineMargin + _markerW + error;
if (self.markers.count == 2) { // 3个item
// 拿到当前滑块右边1个滑块
ReadyTimeMarker *rightMarker = self.markers[self.curMarkerIndex + 1];
max = rightMarker.centerX - _markerW - error;
if (self.curMarker.centerX + translationX > min && self.curMarker.centerX + translationX < max) {
self.curMarker.centerX = self.curMarker.centerX + translationX;
self.leftItemCell.centerX = _lineMargin + (self.curMarker.centerX - _lineMargin)/2.0;
self.rightItemCell.centerX = self.curMarker.centerX + (rightMarker.centerX - self.curMarker.centerX)/2.0;
}
} else { // 2个item
max = _lineW - _markerW + _lineMargin - error;
if (self.curMarker.centerX + translationX > min && self.curMarker.centerX + translationX < max) {
self.curMarker.centerX = self.curMarker.centerX + translationX;
self.leftItemCell.centerX = _lineMargin + (self.curMarker.centerX - _lineMargin)/2.0;
self.rightItemCell.centerX = self.curMarker.centerX + (2*self.divideW - self.curMarker.centerX + _lineMargin)/2.0;
}
}
} else if (self.curMarkerIndex == 1) { // 3个item，处理最后2个item
// 拿到当前滑块左边1个滑块
ReadyTimeMarker *leftMarker = self.markers[self.curMarkerIndex - 1];
min = leftMarker.centerX + _markerW + error;
max = _lineW - _markerW + _lineMargin - error;
if (self.curMarker.centerX + translationX > min && self.curMarker.centerX + translationX < max) {
self.curMarker.centerX = self.curMarker.centerX + translationX;
self.leftItemCell.centerX = leftMarker.centerX + (self.curMarker.centerX - leftMarker.centerX)/2.0;
self.rightItemCell.centerX = self.curMarker.centerX + (3*self.divideW - self.curMarker.centerX + _lineMargin)/2.0;
}
}
}
#pragma mark - getter
- (CGFloat)divideW {
return _lineW / self.relax_items.count;
}
- (CGFloat)itemLeftMargin {
return _lineMargin + (self.divideW - _itemW) / 2.0;
}
- (CGFloat)markerLeftMargin {
return _lineMargin + self.divideW - _markerW/2.0;
} }
@end @end
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/SleepReadyRequestModel.h
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
NS_ASSUME_NONNULL_BEGIN NS_ASSUME_NONNULL_BEGIN
@interface SleepReadyRequestModel : DSNetworkTool @interface SleepReadyRequestModel : DSNetworkTool
@property (nonatomic, assign) int relax_time;
@property (nonatomic, strong) NSArray *relax_items; @property (nonatomic, strong) NSArray *relax_items;
@property (nonatomic, strong) NSArray *prepare_items; @property (nonatomic, strong) NSArray *prepare_items;
......
DreamSleep/DreamSleep/Class/AISleepModule/SleepReady/SleepReadyRequestModel.m
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
DSLog(@"安睡准备设置页面列表数据接口apiDic：%@", apiDic); DSLog(@"安睡准备设置页面列表数据接口apiDic：%@", apiDic);
requestModel.resCode = DSResCodeSuccess; requestModel.resCode = DSResCodeSuccess;
NSDictionary *resultDic = apiDic[@"result"]; NSDictionary *resultDic = apiDic[@"result"];
requestModel.relax_time = [resultDic[@"relax_time"] intValue];
NSArray *relax_items = resultDic[@"relax_items"]; NSArray *relax_items = resultDic[@"relax_items"];
NSArray *prepare_items = resultDic[@"prepare_items"]; NSArray *prepare_items = resultDic[@"prepare_items"];
......
支持 Markdown 格式
你添加了 0 人 到此讨论。请谨慎行事。
Finish editing this message first!