Animated color transition

问题:

Hi this is a more general question on how to approach this. As you can see in the image below I have 4 textLabels in a stack view, and behind the stack view is a red UIVew.

When the UIView slides over the next text, I would like the text to change color whenever the view is over the text. I don't want an abrupt change, but rather a masking/sliding color effect, driven by the red UIView.

Currently its only changing colours once the transition is done.

How would you approach this?

on request the basic sliding code:

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    if isScrolling {
        let factor = (scrollView.contentOffset.x/UIScreen.main.bounds.width) * (margin.left/2)
        self.navigationBar.indicatorConstraint.constant = (scrollView.contentOffset.x / 4) - factor
    }
}

回答1:

It is possible to achieve but it is not straight forward.

You would have to add white and black text UILabels. These labels contained on a view, for example the WhiteLabelsView and the BlackLabelsView. The red view should mask the WhiteLabelsView, and the BlackLabelsView should be behind them.

Your view should look like this (RedView is the top most view):

• [ RedView ]
• [ WhiteLabelsView ]
• [ BlackLabelsView ]