2017-04-23 4 views
0

enter image description hereAppleTV 버튼을 만드는 방법은 무엇입니까?

언뜻보기에는 정상적인 UIButton처럼 보이지만 아래에는 레이블이 있습니다. 또한 단추의 배경이 흐린 효과로 보입니다.

내 생각에 그들은 CollectionView (가로)에 배치됩니다. 각 셀에는 UIButton과 UILabel이 포함되어 있습니다. 그 UIButton 무료로 이동 효과를 얻을 것 같지 않습니다 작동 할 수 있지만.

enter image description here

는 사용자 정의 행위인가? 그렇다면 어떻게 그런 효과를 낼 수 있습니까?

답변

0

UICollectionView가 아니라 UIButton 및 UILabel이 수직으로 정렬 된 사용자 정의보기의 수평 UIStackView 일 가능성이 있습니다. 여기

당신은 stackViews를 사용하여, 예를 들어 있습니다

import UIKit 

class ViewController: UIViewController { 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     let stackView = UIStackView() 
     stackView.axis = .horizontal 
     stackView.distribution = .equalSpacing 
     stackView.alignment = .center 
     stackView.spacing = 30 
     view.addSubview(stackView) 

     ["One", "Two", "Three", "Caramba"].forEach { 
      let buttonStackView = UIStackView() 
      buttonStackView.axis = .vertical 
      buttonStackView.distribution = .fillProportionally 
      buttonStackView.alignment = .center 
      buttonStackView.spacing = 15 

      let button = UIButton(type: .system) 
      button.setTitle($0, for: .normal) 
      buttonStackView.addArrangedSubview(button) 

      let label = UILabel() 
      label.text = $0 
      label.font = UIFont.systemFont(ofSize: 20) 
      buttonStackView.addArrangedSubview(label) 

      stackView.addArrangedSubview(buttonStackView) 
     } 

     stackView.translatesAutoresizingMaskIntoConstraints = false 
     stackView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true 
     stackView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true 
    } 
} 

StackView

시차 효과를 포함하여 초점을 때의 레이아웃을 사용자 정의 할 수 있습니다 것입니다 각 버튼의 사용자 정의보기 대신 수직 uistackview을 가졌어요.

스택의 각 버튼에 시차 효과를 추가하려면, 또 다른 stackview 이미 다른 버튼이 전체 너비를 채우기 위해 늘어나는 것과됩니다 아니었다면 그것은 또한 stackview 수행 할 수 How to get Parallax Effect on UIButton in tvOS?

+0

에 대해 살펴 설명 텍스트. 그러나 UIButton에는 상자 밖으로 이동 효과가 없습니다. 혹시 그러한 효과를 어떻게 얻을 수 있는지 알고 있습니까? 제스처 패닝으로 스스로해야합니까? 아니면 더 쉬운 방법이 있습니까? – Mark

+0

@ 마크이 코드를 추가하는 코드를 업데이트했습니다. –

+0

이 예제를 실제로 사용해 주셔서 감사합니다. 정말 감사합니다. 나는 오늘 밤 직장에서 내릴 때 그것을 시험 할 것이다. – Mark