垂直UISlider約束

Question

我正在創建垂直UISlider。我創建了使用所有代碼的視圖。 （其餘的故事板元素使用接口生成器進行約束）

從我已閱讀的內容中，創建一個垂直UISlider，然後旋轉它給UISlider一個寬度。由於UISlider所在容器的高度因屏幕尺寸而異，我不想給它固定的高度（寬度）。

這是我在想什麼

// Mark: Slider View 

    let leftSlider = UISlider() 
    let centerSlider = UISlider() 
    let rightSlider = UISlider() 

    let colorSliders = [leftSlider, centerSlider, rightSlider] 

    for slider in colorSliders { 

     slider.translatesAutoresizingMaskIntoConstraints = false 
     sliderContainer.addSubview(slider) 

     let w = sliderContainer.bounds.width 
     slider.bounds.size.width = w 
     slider.center = CGPoint(x: w/2, y: w/2) 
     slider.transform = CGAffineTransform(rotationAngle: CGFloat(-M_PI_2)) 

     slider.value = 0 
     slider.minimumValue = 0 
     slider.maximumValue = 255 

     let sliderTopConstraint = slider.topAnchor.constraint(equalTo: centerHiddenView.bottomAnchor, constant: 5) 
     let sliderBottomConstraint = slider.bottomAnchor.constraint(equalTo: sliderContainer.bottomAnchor, constant: 5) 

     NSLayoutConstraint.activate([sliderTopConstraint, sliderBottomConstraint]) 
     slider.backgroundColor = .purple 
     slider.isEnabled = true 
     slider.isUserInteractionEnabled = true 

    } 

    let sliderContainerWidth: CGFloat = sliderContainer.frame.width 


    let centerSliderHorizontalConstraints = centerSlider.centerXAnchor.constraint(equalTo: sliderContainer.centerXAnchor) 

    let widthConstraint = centerSlider.widthAnchor.constraint(equalToConstant: sliderContainerWidth) 

    let centerSliderWidthConstraint = centerSlider.widthAnchor.constraint(equalToConstant: 90) 

    NSLayoutConstraint.activate([centerSliderHorizontalConstraints, centerSliderWidthConstraint, widthConstraint]) 

但是當我運行它，我得到這個

這遠遠比我今天早些時候有更好的。然而，我想滑塊是正常的寬度..以及看起來正常只是垂直

任何想法我錯過了什麼？ （呵呵忽略小紫分支到左側，這是其他2個滑塊，我加入，但沒有限制呢。）

Answer 1

你改變bounds和你UISlider的transform並使用自動 - 同時佈局，這樣可能會有點混亂。

我建議你不要修改bounds，而是使用自動佈局。您應該將滑塊寬度設置爲其超級視圖高度，並將滑塊置於其超級視圖內。這樣，當你旋轉它時，其實際上它的寬度（旋轉之前）的高度（旋轉之後）將等於它的超級視圖高度。垂直居中滑塊將確保滑塊觸摸其超視圖的底部和頂部。

slider.widthAnchor.constraint(equalTo: sliderContainer.heightAnchor 
slider.centerYAnchor.constraint(equalTo: sliderContainer.centerYAnchor) 

slider.centerXAnchor.constraint(equalTo: sliderContainer.centerXAnchor) 

如果要放置剩餘的2個滑塊向左或他們的上海華盈的權利之一，不水平居中，但千萬不要使用以下：

slider.leadingAnchor.constraint(equalTo: sliderContainer.leadingAnchor) 

slider.trailingAnchor.constraint(equalTo: sliderContainer.trailingAnchor) 

此外，仔細檢查您的控制檯用於自動佈局錯誤日誌。

編輯： 我檢查上面的代碼上一個測試項目，這是我的看法控制器代碼：

class ViewController: UIViewController { 
    @IBOutlet private weak var containerView: UIView! 


    override func viewDidAppear(_ animated: Bool) { 
     super.viewDidAppear(animated) 

     let leftSlider = UISlider() 
     let centerSlider = UISlider() 
     let rightSlider = UISlider() 
     let colorSliders = [leftSlider, centerSlider, rightSlider] 

     var constraints = [NSLayoutConstraint]() 
     for slider in colorSliders { 
      slider.translatesAutoresizingMaskIntoConstraints = false 
      containerView.addSubview(slider) 

      slider.transform = CGAffineTransform(rotationAngle: CGFloat(-M_PI_2)) 

      constraints.append(slider.widthAnchor.constraint(equalTo: containerView.heightAnchor)) 
      constraints.append(slider.centerYAnchor.constraint(equalTo: containerView.centerYAnchor)) 

      slider.backgroundColor = .purple 
     } 
     constraints.append(leftSlider.centerXAnchor.constraint(equalTo: containerView.centerXAnchor)) 
     constraints.append(centerSlider.centerXAnchor.constraint(equalTo: containerView.leadingAnchor)) 
     constraints.append(rightSlider.centerXAnchor.constraint(equalTo: containerView.trailingAnchor)) 

     NSLayoutConstraint.activate(constraints) 
    } 
} 

這裏就是我的了：

Answer 2

（如7月7日，2017）

self.customSlider = [[UISlider alloc] init]]; 
self.customView = [[UIView alloc] init]; 

//create the custom auto layout constraints that you wish the UIView to have 

[self.view addSubview:self.customView]; 
[self.customView addSubview:self.customSlider]; 
self.slider.transform = CGAffineTransformMakeRotation(-M_PI_2); 

/*Create the custom auto layout constraints for self.customSlider to have these 4 constraints: 
    //1. self.customSlider CenterX = CenterX of self.customView 
    //2. self.customSlider CenterY = CenterY of self.customView 
    //3. self.customSlider width = self.customView height 
    //4. self.customSlider height = self.customView width 
*/