服务器之家:专注于VPS、云服务器配置技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - IOS - iOS实现多个垂直滑动条并列视图

iOS实现多个垂直滑动条并列视图

2022-08-01 11:42hzgisme IOS

这篇文章主要为大家详细介绍了iOS实现多个垂直滑动条并列视图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了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

延伸 · 阅读

精彩推荐
  • IOS在iOS10系统中微信后退无法发起ajax请求的问题解决办法

    在iOS10系统中微信后退无法发起ajax请求的问题解决办法

    这篇文章主要介绍了在iOS10系统中微信后退无法发起ajax请求的问题解决办法,一般可以通过延时发送请求解决,下面通过本文给大家分享下解决办法,需要的...

    春去秋来情不归4542021-03-01
  • IOS为按钮位置配置不同的IOS背景

    为按钮位置配置不同的IOS背景

    这篇文章主要介绍了为按钮位置配置不同的IOS背景,面对多个按钮如何配置不同的IOS背景,需要的朋友可以参考下...

    畅畅的烧烤店3062020-12-22
  • IOSiOS通过shell脚本批量修改属性

    iOS通过shell脚本批量修改属性

    这篇文章主要给大家分享了iOS通过shell脚本批量修改属性的相关知识点,希望我们整理的内容能够帮助到大家。...

    aron19923972021-04-22
  • IOS实例讲解iOS应用的设计模式开发中的Visitor访问者模式

    实例讲解iOS应用的设计模式开发中的Visitor访问者模式

    这篇文章主要介绍了iOS应用的设计模式开发中的Visitor访问者模式的实例,示例代码为传统的Objective-C,需要的朋友可以参考下...

    TonyGo11592021-01-11
  • IOSiOS中的实时远程配置全纪录

    iOS中的实时远程配置全纪录

    这篇文章主要给大家介绍了关于iOS中实时远程配置的相关资料,文中通过示例代码介绍的非常详细,对各位iOS开发者们具有一定的参考学习价值,需要的朋...

    敲钟人Quasimodo10732021-05-19
  • IOSIOS实现简单的进度条功能

    IOS实现简单的进度条功能

    这篇文章主要介绍了IOS实现简单的进度条功能的相关资料,需要的朋友可以参考下...

    世俗孤岛6292021-01-03
  • IOSiOS实现类似格瓦拉电影的转场动画

    iOS实现类似格瓦拉电影的转场动画

    这篇文章主要给大家介绍了利用iOS如何实现类似格瓦拉电影的转场动画,文中给出了详细步骤实现代码,对大家的学习和理解很有帮助,有需要的朋友们可...

    简单即复杂10362021-02-05
  • IOSiOS推送的那些事

    iOS推送的那些事

    关于iOS推送的那些事,你知道多少?本文带着大家一起了解iOS推送,感兴趣的小伙伴们可以参考一下...

    super_danny8962021-01-07