简约同样简单:为UISlider添加显示当前值的标签(下)

最新推荐文章于 2024-02-21 13:45:13 发布
最新推荐文章于 2024-02-21 13:45:13 发布
阅读量1.1k 收藏 1
点赞数
分类专栏： iOS开发小干货 iOS开发之旅 文章标签： iOS UISlider Label 当前值 Swift
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mydo/article/details/86686043
版权
本文介绍了如何在Swift中封装一个名为HyValueSlider的类，该类继承自UISlider并添加了显示当前值的功能。通过提供自定义字体和颜色的接口，提高了代码的可复用性和可维护性。在处理滑块把手时，利用layoutSubviews()方法更新标签位置，简化了事件处理。完整代码可在GitHub找到。
摘要由CSDN通过智能技术生成

本文在重构的基础上，从类封装的角度重新实现UISlider的功能扩展:显示当前的值，比之前更加简单和易于维护。建议在看完上篇之后再来观赏。

上篇观赏在此 : 简约同样简单:为UISlider添加显示当前值的标签(上)

为什么要重写?

在上篇里我们已经实现了UISlider的扩展功能，已经可以用了，为什么还要费事再说它呢?

原因是：它的封装性不足，对外太开放。

在这里插入图片描述

举个栗子：UISlider上面的标签竟然放在Slider外面，这意味着标签如果需要修改外观或功能，还得到它外面去做，这显然不合理！

为了以后能够更好地重用，显然的做法是：做一个单独的类，继承于UISlider！

从零开始

新建HyValueSlider.swift文件，我们先打一个框架:


                

                
                
        

        

        

    

  


        

            

                

                

                了解本专栏
                
                
                  
                订阅专栏 解锁全文
                 
                
                    
                    超级会员免费看
                
            

            
            
            
        

    

      

        

            

              
                
                  大熊猫侯佩
                
              
            

            

                关注
              
            

        

        

          
      

      

            

                专栏目录
          

                

                        订阅专栏
                









                



	

		

			

				
					
SwiftUI脑洞大开打造实时显示当前值的Slider(滑动器)

				
			

			

				

					享受开发，颠倒银河
				

				

					09-06
					
					373
					
				

			

		

		

			
				
在本篇博文中您将学到:

 - 怎样实时获取Slider把手的位置？
 - 如何知道用户何时开始和结束拖动UISlider?
 - 如何在Slider把手上显示值?
 - 如何在SwiftUI中使用定制的Slider?

			
		

	



                

              
                



	

		

			

				
					
简约同样简单:为UISlider添加显示当前值的标签(上)

				
			

			

				

					享受开发，颠倒银河
				

				

					01-27
					
					2450
					
				

			

		

		

			
				

本文畅想了几种为UISlider添加显示当前值的方法,并选择了其中一个稳定,简单的实现.适合iOS刚入门或中级水平的童鞋们观赏.

看不见值?这不科学!
默认的UISlider,你可以任意拖动,却看不见当前表示的值…
有点盲人摸象的赶脚了…
我们一般的做法是用另一个控件表示其当前值,比如一个UILabel.
不过这样貌似要另外占用一些空间,不紧凑!
看到UISlider上面那个圆圆的把手了么?我...

			
		

	



                


  
              

                


	

		

			

				
					
MultiSlider:UISlider 克隆具有多个拇指和值、范围突出显示、可选的捕捉间隔、可选的值标签，垂直或水平

				
			

			

				

					05-30
				

			

		

		

			
				
多滑块
UISlider 克隆具有多个拇指和值、范围突出显示、可选的捕捉间隔、可选的值标签，垂直或水平。
特征
多个拇指
范围滑块（可选）- 拇指之间的轨道颜色不同于拇指外的轨道颜色
垂直（可选）
 值标签（可选）
 捕捉间隔（可选）
 触觉反馈
可配置的拇指图像、最小和最大图像。
 可配置的轨道宽度、颜色、四舍五入。
用法
 let slider = MultiSlider ()
slider. minimumValue = 1    // default is 0.0
slider. maximumValue = 5    // default is 1.0
slider. value = [ 1 , 4.5 , 5 ]
slider. addTarget ( self , action : #selector ( sliderChanged (_:)), for : . valueC

			
		

	





	

		

			

				
					
iOS开发UISlider滑动条的属性介绍以及于标签联合使用实时显示变动值

				
			

			

				

					yuxikuo_1的专栏
				

				

					12-24
					
					3104
					
				

			

		

		

			
				
转载自：http://blog.csdn.net/weisubao/article/details/39559001


（1）滑动条的左右端背景可以设置上一页下一页的图片；




（2）滑动条的轨道图片可以设置为渐变等等图片。




（3）滑动条因为值可以互动，所以addTarget:方法很重要，其中事件值变动UIControlEventValueChanged比较

			
		

	



		

			
		



	

		

			

				
					
【快速文档】slider标签，在小程序中插入一个滑动选择器

				
			

			

				

					吴茗的博客
				

				

					10-06
					
					602
					
				

			

		

		

			
				
重要参数


min 最小值，默认值为0

max 最大值，默认值为100

step 步长，必须大于1，且可以被max - min整除

value 设置当前的值

backgroundColor 整个进度条的颜色

activeColor 已选择的颜色

block-color 滑块的颜色

block-size 滑块的大小，最小12，最大28，默认28

show-value 显示当前值

bindchange 绑定一次改变事件，拖动结束后触发

bindchanging 绑定改变事件，一边拖动一边.

			
		

	





	

		

			

				
					
UISlider-TrackHeight:调整UISlider的滑动条高度

				
			

			

				

					05-16
				

			

		

		

			
				
UISlider-TrackHeight 调整UISlider的滑动条高度 Import pod 'UISlider-TrackHeight', '~> 1.0.2' Usage #import "UISlider+VDTrackHeight.h" self.slider.vd_trackHeight = 5.0f; License

			
		

	





	

		

			

				
					
UISliderMilestoneMode:UISlider 仅使用整数值位置一一移动

				
			

			

				

					07-05
				

			

		

		

			
				
在iOS开发中，UISlider是苹果提供的一个基本控件，用于让用户通过滑动来选择一个介于最小值和最大值之间的值。`UISliderMilestoneMode`这个概念可能是指一种特殊的UISlider使用模式，其中滑块只会在整数值的位置进行...

			
		

	





	

		

			

				
					
【Element-ui】el-slider滑块自定义样式，实时显示选中两点的数值在上方，左右显示0到100

				
			

			

				

					weixin_43951592的博客
				

				

					06-28
					
					3436
					
				

			

		

		

			
				
Slider 滑块

			
		

	





	

		

			

				
					
e798. 显示JSlider的标记标签

				
			

			

				

					dengjuanshou7445的博客
				

				

					09-06
					
					124
					
				

			

		

		

			
				
This example demonstrates how to display labels (numerical values) at the major ticks (see e797 显示JSlider的标记).
    // Create a horizontal slider that moves left-to-right
    JSlider slider = ne...

			
		

	





	

		

			

				
					
（原创）TabSlider标签滑动器v1.0

				
			

			

				

					10-27
				

			

		

		

			
				
TabSlider类库可以赋予.net WinForm TabControl控件具有简单而有趣的标签滑动效果，目前版本为v1.0；代码写完就上传了，可能存在一些bug；大家如发现请到我空间留言，3Q！

			
		

	





	

		

			

				
					
TGPControls:带有刻度，图像和动画标签的UISlider的直接替换

				
			

			

				

					03-05
				

			

		

		

			
				
TGP控件
带有刻度和动画标签的滑块（快速）
 TGPControls是UISlider和UILabel的UISlider替代，具有Interface Builder中的视觉预览，单眼线检测，流畅的动画，简单的API，强大的自定义功能。
什么是DiscreteSlider？
 TGPDiscreteSlider ：具有TGPDiscreteSlider长（ TGPDiscreteSlider ），离散范围，可自定义轨迹，拇指和刻度的滑块。 选择单个步长，星级，整数，彩虹色，片段以及通常不是连续体的任何值的理想选择。 只需设置停靠点的数量，TGPDiscreteSlider即可为您处理选择和动画。
什么是骆驼标签？
 TGPCamelLabels ：一组代表所选内容的动画标签（码头效果）。 可以单独使用或与UIControl结合使用。 代表步骤的理想选择。 离散滑块和骆驼标签可以一起使用。


			
		

	





	

		

			

				
					
UISlider Demo代码

				
			

			

				

					04-24
				

			

		

		

			
				
UISlider Demo IOS 控件 代码

			
		

	





	

		

			

				
					
两个滑块的范围选择UISlider

				
			

			

				

					08-13
				

			

		

		

			
				
实现了一个有两个滑块，可以选择一个范围的UISlider。是在网上找到的一个控件的基础上作了包装，可以实时显示现在选择范围。可用于选择价格范围等。
现有的问题：
1、没有实现step的功能。
2、滑块的滑动还不是特别灵敏。
有解决的记得回我一下啊。

			
		

	





	

		

			

				
					
Flutter Slider自定义滑块样式 Slider的label标签框常显示

					
最新发布

				
			

			

				

					Choi晨的博客
				

				

					02-21
					
					1475
					
				

			

		

		

			
				
Flutter Slider自定义滑块样式 Slider的label标签框常显示和自定义样式；

			
		

	





	

		

			

				
					
用swiper做简单的评分效果（获取swiper-slide中的值）

				
			

			

				

					qq_32538087的博客
				

				

					08-10
					
					4081
					
				

			

		

		

			
				
原理：和做平常的轮播图相同，只不过是把图片换成数字。评分效果评的分是要提交给后台的，所以要用到form（代码中没有显示，在最外层）和input（type=hidden,不要让input显示出来），每当滚动到某个数字的时候要获取到这个swiper-slide中的数字，并赋值给 input的value上，用swiper的on方法和slideChangeTransitionEnd（swiper从一个sl...

			
		

	





	

		

			

				
					
vue改变elementUI中el-slider中默认样式，显示数值或文字，改变文字颜色

				
			

			

				

					Aa12364567的博客
				

				

					09-19
					
					3124
					
				

			

		

		

			
				
vue改变elementUI中el-slider中默认样式，显示数值或文字，改变文字颜色

			
		

	





	

		

			

				
					
【iOS开发-11】UISlider滑动条的属性介绍以及于标签联合使用实时显示变动值

				
			

			

				

					小小的客栈 大大的江湖
				

				

					09-25
					
					5246
					
				

			

		

		

			
				
（1）滑动条的左右端背景可以设置上一页下一页的图片；
（2）滑动条的轨道图片可以设置为渐变等等图片。
（3）滑动条因为值可以互动，所以addTarget:方法很重要，其中事件值变动UIControlEventValueChanged比较特殊，其实和按钮的按下事件是一个性质，都是一个事件而已。

			
		

	





	

		

			

				
					
iPhone开发初学者指南：自定义滑动条初始值

				
			

			

				

					
				

			

		

		

			
				
本篇文章主要针对想要学习iPhone开发但对编程不熟悉的人群，讲解了一种在2013年的iOS7版本中，如何在无需编程基础的情况下更好地管理Xcode中的滑动条初始值的问题。文章以"让不懂编程的人爱上iPhone开发(2013球iOS7...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		
评论 4

	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  





	
打赏作者

	

		

		
			
		
		

		

			
大熊猫侯佩

			
赏点钱让我买杯可乐好吗 ;)

		

	

	

			

	

	

    ¥1
    ¥2
    ¥4
    ¥6
    ¥10
    ¥20
	

	

		

			

				

					扫码支付：¥1
				

				

					

					
					获取中
					

				

				

					
					
					扫码支付
				

			

		

		

			
您的余额不足，请更换扫码支付或充值

			
打赏作者

		

	



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值