edualb/focustv

Library to create a `UIFocusGuide` with simple syntax.

FocusTv

A framework for creating UIFocusGuide elements with simple syntax.

Example

• The goal of this example is navigate from an origin button to a destiny button:

• Without FocusTv framework:

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var destinyButton: UIButton!
    @IBOutlet weak var originButton: UIButton!
    
    private var focusGuideBottomRight: UIFocusGuide? = nil;
    
    override func viewDidLoad() {
      super.viewDidLoad()
      
      self.focusGuideBottomRight = UIFocusGuide()
      
      self.focusGuideBottomRight.widthAnchor.constraint(equalTo: destiny.widthAnchor).isActive = true
      self.focusGuideBottomRight.heightAnchor.constraint(equalTo: origin.heightAnchor).isActive = true
      self.focusGuideBottomRight.topAnchor.constraint(equalTo: origin.topAnchor).isActive = true
      self.focusGuideBottomRight.leadingAnchor.constraint(equalTo: destiny.leadingAnchor).isActive = true
    }
    
    override func didUpdateFocus(in context: UIFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
      super.didUpdateFocus(in: context, with: coordinator)
      guard let nextFocusedView = context.nextFocusedView else { return }
        
      switch nextFocusedView {
        case self.destinyButton:
            self.focusGuideBottomRight.preferredFocusEnvironments = [self.originButton]
        case self.originButton:
            self.focusGuideBottomRight.preferredFocusEnvironments = [self.destinyButton]
        default:
            self.focusGuideBottomRight.preferredFocusEnvironments = nil
      }
    }
}

• With FocusTv framework:

import UIKit
import FocusTv

class ViewController: UIViewController {
    @IBOutlet weak var destinyButton: UIButton!
    @IBOutlet weak var originButton: UIButton!
    
    private var focusGuideBottomRight: FocusTv? = nil;
    
    override func viewDidLoad() {
      super.viewDidLoad()
      
      self.focusGuideBottomRight = FocusTv(from: originButton, to: destinyButton)
      self.focusGuideBottomRight?.toBottomRight(view: self.view)
    }
    
    override func didUpdateFocus(in context: UIFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
      super.didUpdateFocus(in: context, with: coordinator)
      self.focusGuideBottomRight?.didUpdateFocus(in: context, with: coordinator)
    }
}

How does it work?

1 - When a FocusTv object is created, we need to pass two parameters: an origin UIView and a destiny UIView. In other words, we give the FocusTv object a view that is the initial focus and another view that will be the final focus.

    self.focusGuideBottomRight = FocusTv(from: destinyButton, to: originButton)

2 - After the FocusTv object is created, we need pass the quadrant that will be the focus:

In our case, we want to pass the bottom right quadrant because when we drag to the right, the focus will go to the bottom right quadrant.

To do this, add the following code:

    self.focusGuideBottomRight?.toBottomRight(view: self.view)

3 - And finally, to make it intelligent we add the didUpdateFocus(in: context, with: coordinator) method of the FocusTv object into the override func didUpdateFocus(in context: UIFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) method like this:

    override func didUpdateFocus(in context: UIFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
      super.didUpdateFocus(in: context, with: coordinator)
      self.focusGuideBottomRight?.didUpdateFocus(in: context, with: coordinator)
    }

focustv's Issues

FocusTv needs tests

Title

FocusTv needs tests

Context

FocusTv needs tests for UIFocusGuide because any additional feature might break the application.

Proposal

• Create an UIView

var view: UIView

• Create two UIButton with itself constraints.

var button1: UIButton
var button2: UIButton

• Add the UIButtons in UIView like it:

self.view.addSubview(self.button1)

• Test if toUIFocusGuide method was built right.

QuadrantBottomRight.toUIFocusGuide(self.button1, self.button2, self.view)

Review README

Title

Review README

Context

For my native language don't be English, I would like some other people to review the README.md

Proposal

Not applicable