iOS UISlider

时间:2020-02-23 14:45:57  来源:igfitidea点击:

在本教程中,我们将在iOS应用程序中讨论和实现UISlider。

UISlider

UISlider是一种控件,它允许用户通过将拇指拖动到所需位置来从水平值范围中选择一个值。

使用UISlider的一些用例:

  • 改变音量
  • 改变亮度
  • 更改视频的当前搜索

要在应用程序中创建新的UISlider UI,最重要的是,您需要指定值的范围。
" isContinous"属性用于设置滑块在值范围内是否连续。

这意味着,当" isContinous"设置为false时,仅当释放拇指时,值更改才会通知给目标操作方法。

我们可以在UISlider的任一端设置UIImage。

  • minimumValueImage和maximumValueImage用于在任一端设置图像。

  • " minimumTrackTintColor"用于设置轨迹的颜色,直到拇指的当前位置。
    " maximumTrackTintColor"用于设置轨迹的颜色,从当前的拇指位置到轨迹的末尾。

  • " thumbTintColor"用于设置UISlider拇指上的色调颜色属性

  • currentThumbImage用于设置要在拇指上渲染的图像。

  • setThumbImage用于设置特定事件的图像。

获取价值

要访问UISlider的值,我们可以执行以下操作:

  • " var value:Float":滑块的当前值。

  • func setValue(Float,animation:Bool):设置滑块的当前值,使您可以在视觉上对更改进行动画处理。

  • minimumValuemaximumValue用于获取并设置Float中UISlider的最小值和最大值。

在以下部分中,我们将创建UISlider。
在我们的情节提要中以编程方式和使用Interface Builder均可。

让我们开始吧!

项目情节提要

我们的XCode项目的Main.storyboard看起来像这样:

事件类型"值已更改"的IBAction可以创建为:

代码

下面给出了ViewController.swift的代码:

import UIKit

class ViewController: UIViewController {

  @IBOutlet weak var myLabel: UILabel!
  @IBOutlet weak var mySlider: UISlider!
  override func viewDidLoad() {
      super.viewDidLoad()
      
      createSliderProgrammatically()
      
  }

  @IBAction func mySliderValueChanged(_ sender: Any) {
      
      if (sender as! UISlider).tag == 101{
          myLabel.text = ("Programmatic Slider value is: \((sender as! UISlider).value)")
      }
      else{
          myLabel.text = ("Slider value is: \((sender as! UISlider).value)")
      }
  }
  
  func createSliderProgrammatically()
  {
      let mySlider = UISlider(frame:CGRect(x: 10, y: 100, width: 300, height: 20))
      mySlider.minimumValue = 0
      mySlider.maximumValue = 100
      mySlider.isContinuous = false
      mySlider.tag = 101
      mySlider.tintColor = UIColor.green
      mySlider.minimumTrackTintColor = UIColor.black
      mySlider.maximumTrackTintColor = UIColor.red
      mySlider.minimumValueImage = UIImage(named: "ic_launcher")
      mySlider.maximumValueImage = UIImage(named: "ic_launcher")
      mySlider.setThumbImage(UIImage(named: "ic_launcher"), for: UIControl.State.normal)
      mySlider.addTarget(self, action: #selector(ViewController.mySliderValueChanged(_:)), for: .valueChanged)
      
      self.view.addSubview(mySlider)
  }
  
}

在上面的代码中,我们在布局的顶部添加了以编程方式创建的UISlider。
我们已经从Assets文件夹中设置了UIImage。

为了区分这两个UISlider,我们其中一个上设置了标签。
标签上显示的值将是该类型。

实际应用程序的输出如下:

值显示为浮点数。

为了使它们捕捉到整数,我们可以在上面的Swift类中执行以下操作。

@IBAction func mySliderValueChanged(_ sender: Any) {
      
      let uiSlider = sender as! UISlider
      
      let step:Float = 1
      let roundedStepValue = round(uiSlider.value/step) * step
      uiSlider.value = roundedStepValue
      
      if (sender as! UISlider).tag == 101{
          myLabel.text = ("Programmatic Slider value is: \((uiSlider).value)")
      }
      else{
          myLabel.text = ("Slider value is: \((uiSlider).value)")
      }
  }