2016-12-05 21 views
0

編集1プログラムの追加制約は、自動レイアウトの制約を破る

こんにちは、これは制約を追加するためのコードを使用して私の最初の時間です。私は通常、インターフェイスビルダーを使用します。私は視覚的に制約を加えて混合すると、コード化された制約に干渉していると思う前に、垂直UISliderを追加しようとしています。私は今、私のコードを更新して、この特定のビューコンテナでのみコードを使用して制約を作成するこの質問。

私が行ったことは、別のビューのすぐ下にビューを作成したことです。私は3つの小さなビューを作成し、上記のビュー内のテキストフィールドの幅に一致させてから、テキストフィールドがどのように間隔を置いているかと同じように配置しました。

テスト目的のために、私はこれらの3つの小さなビューに、動作しているかどうかを確認するための色を付けました。 Good Screenshot

実際にこのアプリを終了すると、赤色、緑色、青色の表示がクリアされます。私が欲しかった唯一の理由は、スライダを作成するときに、それぞれをビューの中心に制限することができます...テキストフィールド上のラベルがどのように制約されているかです。ここで

今すぐ

// Mark: Hidden View 

    let leftHiddenView = UIView() 
    let centerHiddenView = UIView() 
    let rightHiddenView = UIView() 

    let hiddenViews = [leftHiddenView, centerHiddenView, rightHiddenView] 

    for views in hiddenViews { 

     views.translatesAutoresizingMaskIntoConstraints = false 
     sliderContainer.addSubview(views) 
     views.backgroundColor = .white 

     let widthConstraint = views.widthAnchor.constraint(equalToConstant: 35) 
     let heightConstraint = views.heightAnchor.constraint(equalToConstant: 5) 

     NSLayoutConstraint.activate([widthConstraint, heightConstraint]) 
    } 

    let centerViewHorizontalConstraint = centerHiddenView.centerXAnchor.constraint(equalTo: sliderContainer.centerXAnchor) 
    let centerViewTopConstraint = centerHiddenView.topAnchor.constraint(equalTo: sliderContainer.topAnchor, constant: 50) 

    NSLayoutConstraint.activate([centerViewHorizontalConstraint, centerViewTopConstraint]) 

    let leftViewVerticalCenterConstraint = leftHiddenView.centerYAnchor.constraint(equalTo: centerHiddenView.centerYAnchor, constant: 0) 
    let leftViewTrailingConstraint = leftHiddenView.trailingAnchor.constraint(equalTo: centerHiddenView.leadingAnchor, constant: -60) 


    NSLayoutConstraint.activate([leftViewVerticalCenterConstraint, leftViewTrailingConstraint]) 

    let rightViewVerticalCenterConstraint = rightHiddenView.centerYAnchor.constraint(equalTo: centerHiddenView.centerYAnchor, constant: 0) 
    let rightViewTrailingConstraint = rightHiddenView.leadingAnchor.constraint(equalTo: centerHiddenView.trailingAnchor, constant: 60) 

    NSLayoutConstraint.activate([rightViewVerticalCenterConstraint, rightViewTrailingConstraint]) 

を働き、この ためのコードですが、私は垂直としてUISliderを追加し始めました。以前に起こったこととまったく同じことが今起こった。

bad screenshot

あなたはすべての休憩を見ることができるように。ここで

は、これまで実行時の制約を加えることで設計時間の制約をMISCはいけない、これまでその

// 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 

    } 

    let centerSliderHorizontalConstraints = centerSlider.centerXAnchor.constraint(equalTo: sliderContainer.centerXAnchor) 
    NSLayoutConstraint.activate([centerSliderHorizontalConstraints]) 
+0

私はそれ自身のコンテナだけでなく、別のコンテナを壊すことも意味します – RubberDucky4444

答えて

1

上のコードです。設計時にすべての制約を追加するか、実行時にのみすべての制約を追加します。そうでなければ、あなたはMESSにいます。これを良い習慣としてください。

フレームを変更する必要がある場合は、制約の定数プロパティを変更し、設計時に必要な制約をすべて追加するだけです。

実行時制約を追加する必要があるときは非常にまれです。 (私はいつもそのようにしか設計していないので、これを言っています。そして、それは私にとっては大いに役立ちます)。動的UI変更のために2つのコントロールを追加する必要がある場合でも、2つのコントロールを保持して表示するそのコントロールで非表示にする。あなたのコントロールで何らかのアニメーションが必要な場合は、デザインの時間制約を変更する必要はありません。

私はこれがあなたの質問に直接答えないことを知っていますが、あなたはどのように制約を使用するかの理解を得ることを望みます。

あなたのスクリーンショットからは、あなたのUIがどのようなものかを正確に理解できません。あなたのUIがどのように見えるか少し詳しく知ることができますか?私は制約を与える方法のいくつかのアイデアを提案することができます...

+0

こんにちは、はい、UIは基本的に一番上の行にあります3 UILabels:R、G、B各UILabelの直下にはUITextFieldがあります。私が達成しようとしているのは、垂直UISliderを各UITextFieldの直下に追加することです。そして、各列、つまりR、その下のテキストフィールド、および追加されたスライダは、水平に中央に配置され、GとBについても同じになります – RubberDucky4444

+0

translatesAutoresizingMaskIntoConstraints = trueのままにしましたか? – DShah

+0

はい、悪化しました – RubberDucky4444

0

まあ、実際問題は実際には最初から解決するのが簡単だったことが判明しました。私はそれを見落としてしまったのは、垂直なUISliderによって脅かされたからです。下のコンテナを追加してアプリを走らせると、上記のコンテナに固定された高さが与えられていないので、コンテナが均等にスペースを埋めて、内部の内容がそれに応じて乱されます。私は単に上部のコンテナにラベルとテキストフィールドを固定した高さ61を与え、今はそれに近い状態にしました。申し訳ありません

関連する問題