本文实例为大家分享了iOS实现多个垂直滑动条并列视图的具体代码,供大家参考,具体内容如下
上一篇文章我们实现了一个垂直滑动条的类 (VerticalSlider),用来满足垂直滑动的需求。那么这篇文章我们来把多个垂直滑动条放到一起,可以在一个视图上并排多个垂直滑动条,也算是一个实际应用的场景。
需求:
- 同时展示多个垂直滑动条
- 每个滑动条高度和视图高度相同,随视图高度自动变化
- 所有滑动条宽度相同,宽度为视图宽度除以滑动条个数
- 根据提供的滑动条的值更新视图
- 传递滑动条的索引和值
需求还是比较简单的,自定义一个视图 (UIView) 就可以实现:
VerticalSliderDimmingView.h
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
|
// // VerticalSliderDimmingView.h // // // Created by huang zhengguo on 2019/8/30. // Copyright © 2019 huang zhengguo. All rights reserved. // #import <UIKit/UIKit.h> NS_ASSUME_NONNULL_BEGIN typedef void (^SliderValueBlock) (NSInteger, float ); @interface VerticalSliderDimmingView : UIView /** * 初始化手动调光界面 * * @param frame 大小 * @param sliderCount 滑动条个数 * @param channelColors 滑动条颜色 * @param sliderTitle 滑动条标题 * @param sliderValue 滑动条值 * */ - (instancetype)initWithFrame:(CGRect)frame sliderCount:(NSInteger)sliderCount channelColors:(NSArray *)channelColors sliderTitles:(NSArray *)sliderTitle sliderValues:(NSArray *)sliderValue; /** * 更新滑动条 * * @param sliderValueArray 所有通道颜色值 * */ - ( void )updateSliderViewWith:(NSArray *)sliderValueArray; /** * 更新滑动条 * * @param colorPercentValueArray 所有通道颜色百分比 * */ - ( void )updateManualDimmingViewWithColorPercent:(NSArray *)colorPercentValueArray; // 滑动条滑动 @property(nonatomic, copy) SliderValueBlock colorDimmingBlock; // 滑动条结束滑动 @property(nonatomic, copy) SliderValueBlock colorDimmingEndBlock; @end NS_ASSUME_NONNULL_END |
VerticalSliderDimmingView.m
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
|
// // VerticalSliderDimmingView.m // // // Created by huang zhengguo on 2019/8/30. // Copyright © 2019. All rights reserved. // #import "VerticalSliderDimmingView.h" #import "VerticalSlider.h" @interface VerticalSliderDimmingView() @property (strong, nonatomic) NSMutableArray *colorSliderArray; @end @implementation VerticalSliderDimmingView - (NSMutableArray *)colorSliderArray { if (!_colorSliderArray) { _colorSliderArray = [NSMutableArray array]; } return _colorSliderArray; } - (instancetype)initWithFrame:(CGRect)frame sliderCount:(NSInteger)sliderCount channelColors:(NSArray *)channelColors sliderTitles:(NSArray *)sliderTitle sliderValues:(NSArray *)sliderValue { if (self = [super initWithFrame:frame]) { self.translatesAutoresizingMaskIntoConstraints = NO; VerticalSlider *lastSlider = nil; [self.colorSliderArray removeAllObjects]; for ( int i=0; i<sliderCount; i++) { VerticalSlider *slider = [[VerticalSlider alloc] initWithFrame:CGRectZero title:[sliderTitle objectAtIndex:i] progressColor:[channelColors objectAtIndex:i] thumImage:@ "control.png" ]; slider.minimumValue = MIN_LIGHT_VALUE; slider.maximumValue = MAX_LIGHT_VALUE; slider.translatesAutoresizingMaskIntoConstraints = NO; slider.tag = 20000 + i; slider.value = [sliderValue[i] integerValue] / 1000.0; slider.passValue = ^( float colorValue) { if (self.colorDimmingBlock) { self.colorDimmingBlock(slider.tag - 20000, colorValue * MAX_LIGHT_VALUE); } }; slider.passEndValue = ^( float colorValue) { // 传递结束滑动时的颜色值 if (self.colorDimmingEndBlock) { self.colorDimmingEndBlock(slider.tag - 20000, colorValue * MAX_LIGHT_VALUE); } }; [self addSubview:slider]; if (i == 0) { [self setSliderConstraintsWithItem:slider toItem:self toItem:self isFirst:YES isLast:NO]; } else { [self setSliderConstraintsWithItem:slider toItem:self toItem:lastSlider isFirst:NO isLast:NO]; } // 处理最后一个 if (i == sliderCount - 1) { [self setSliderConstraintsWithItem:slider toItem:self toItem:lastSlider isFirst:NO isLast:YES]; } lastSlider = slider; [self.colorSliderArray addObject:slider]; } } return self; } - ( void )sliderTouchUpInSideAction:(UISlider *)slider { // 传递d结束滑动时的颜色值 if (self.colorDimmingEndBlock) { self.colorDimmingEndBlock(slider.tag - 20000, slider.value); } } #pragma mark --- 根据数据更新视图 - ( void )updateSliderViewWith:(NSArray *)sliderValueArray { // 刷新滑动条 for ( int i=0;i<self.colorSliderArray.count;i++) { VerticalSlider *slider = [self.colorSliderArray objectAtIndex:i]; slider.value = [sliderValueArray[i] floatValue] / 1000.0; } } #pragma mark --- 根据百分比更新视图 - ( void )updateManualDimmingViewWithColorPercent:(NSArray *)colorPercentValueArray { for ( int i=0; i<colorPercentValueArray.count; i++) { UISlider *slider = [self.colorSliderArray objectAtIndex:i]; slider.value = ( float )[[colorPercentValueArray objectAtIndex:i] floatValue] * 10; } } #pragma mark --- 添加滑动条约束 - ( void )setSliderConstraintsWithItem:(nullable id)view1 toItem:(nullable id)view2 toItem:(nullable id)view3 isFirst:( BOOL )isFirst isLast:( BOOL )isLast { NSLayoutConstraint *sliderTopLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0]; NSLayoutConstraint *sliderLeadingLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view3 attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:0.0]; NSLayoutConstraint *sliderBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0]; if (!isFirst) { NSLayoutConstraint *sliderWithLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:view3 attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0.0]; [self addConstraint:sliderWithLayoutConstraint]; } else { sliderLeadingLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0.0]; } // 最后一个 if (isLast) { NSLayoutConstraint *sliderTrailingLayoutConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:0.0]; [self addConstraint:sliderTrailingLayoutConstraint]; } [self addConstraints:@[sliderTopLayoutConstraint, sliderLeadingLayoutConstraint, sliderBottomLayoutConstraint]]; } /* // Only override drawRect: if you perform custom drawing. // An empty implementation adversely affects performance during animation. - (void)drawRect:(CGRect)rect { // Drawing code } */ @end |
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:https://blog.csdn.net/hzgisme/article/details/116019298