我正在尝试在其 iOS 应用程序上复制 eBay 的列表菜单，用户可以在其中滚动浏览列表的不同图像。我注意到背景颜色是纯色，复制每个图像中背景的周围颜色。
当我滚动浏览具有不同环绕背景的不同图像(不同页面)时，UICollectionView 的实际背景会发生变化以某种方式反射(reflect)它。
这就是我的意思:
正如您在第一张图片中看到的，背景是浅色的，有点类似于图像的背景。当我滚动到第二张图片的一半时，背景变暗。
最后:
我的设置类似:
使用DominantColor ，我能够使用每个 UIImage 的主色设置 UICollectionView 的背景颜色。当用户在第一页和第二页之间滚动一半时，UICollectionView 背景色将设置为第二页 UIImage 的主色。
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as UICollectionViewCell
let frame: CGRect = CGRect(x: 0, y: 0, width: imagesView.frame.size.width, height: imagesView.frame.size.height)
let subView: UIImageView = UIImageView(frame: frame)
subView.image = imagesArray[indexPath.row].image
subView.contentMode = UIViewContentMode.scaleAspectFit
if colorsArray.count > 0
{
// Set background dominant color of first image
collectionView.backgroundColor = colorsArray[0]
}
cell.addSubview(subView)
return cell
}
func scrollViewDidScroll(_ scrollView: UIScrollView)
{
let scrollValue = (scrollView.contentOffset.x / UIScreen.main.bounds.width)
let pageWidth: CGFloat = imagesCollectionView.bounds.size.width
let currentPage: Int = Int( floor( (imagesCollectionView.contentOffset.x - pageWidth / 2) / pageWidth) + 1)
if scrollValue != 1
{
UIView.animate(withDuration: 1, animations: {
self.imagesCollectionView.backgroundColor = self.colorsArray[currentPage]
})
}
else
{
UIView.animate(withDuration: 1, animations: {
self.imagesCollectionView.backgroundColor = self.colorsArray[currentPage]
})
}
}
但是，我在如何在用户开始滚动时很快缓慢地从当前背景颜色过渡到下一个背景颜色方面遇到了困难，如上面第二张图片所示。
当前在 scrollViewDidScroll 中实现的方式，当页面在下一页之间滚动一半时，它开始淡入下一种颜色，并且1秒 动画，无论下一页是显示一半还是完全显示，它都会在 1 秒内变成该颜色。
我怎样才能实现这个目标？
最佳答案
使用Fogmeister obj-C 中的答案和 user3344977很好地将其转换为 Swift，以及 Tonton在老师的指导下，我想出了解决办法:
func scrollViewDidScroll(_ scrollView: UIScrollView)
{
let pageWidth: CGFloat = imagesCollectionView.bounds.size.width
let currentPage: Int = Int( floor( (imagesCollectionView.contentOffset.x - pageWidth / 2) / pageWidth) + 1)
let maximumHorizontalOffset: CGFloat = scrollView.contentSize.width - scrollView.frame.size.width
let currentHorizontalOffset: CGFloat = scrollView.contentOffset.x
let percentageHorizontalOffset: CGFloat = currentHorizontalOffset / maximumHorizontalOffset
if percentageHorizontalOffset < 0.5
{
imagesCollectionView.backgroundColor = fadeFromColor(fromColor: colorsArray[currentPage], toColor: colorsArray[currentPage + 1], withPercentage: percentageHorizontalOffset)
}
else
{
imagesCollectionView.backgroundColor = fadeFromColor(fromColor: colorsArray[currentPage - 1], toColor: colorsArray[currentPage], withPercentage: percentageHorizontalOffset)
}
}
func fadeFromColor(fromColor: UIColor, toColor: UIColor, withPercentage: CGFloat) -> UIColor
{
var fromRed: CGFloat = 0.0
var fromGreen: CGFloat = 0.0
var fromBlue: CGFloat = 0.0
var fromAlpha: CGFloat = 0.0
// Get the RGBA values from the colours
fromColor.getRed(&fromRed, green: &fromGreen, blue: &fromBlue, alpha: &fromAlpha)
var toRed: CGFloat = 0.0
var toGreen: CGFloat = 0.0
var toBlue: CGFloat = 0.0
var toAlpha: CGFloat = 0.0
toColor.getRed(&toRed, green: &toGreen, blue: &toBlue, alpha: &toAlpha)
// Calculate the actual RGBA values of the fade colour
let red = (toRed - fromRed) * withPercentage + fromRed;
let green = (toGreen - fromGreen) * withPercentage + fromGreen;
let blue = (toBlue - fromBlue) * withPercentage + fromBlue;
let alpha = (toAlpha - fromAlpha) * withPercentage + fromAlpha;
// Return the fade colour
return UIColor(red: red, green: green, blue: blue, alpha: alpha)
}
现在，当用户开始滚动到下一页/上一页时，由于 percentageHorizontalOffset 中的颜色 Alpha 变化，背景颜色将缓慢变化。
感谢所有提到的人!
关于ios - 当用户滚动到不同页面时，如何在 `UICollectionView` 的不同背景颜色之间淡入淡出？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41215206/