UIScrollView上的掩码覆盖 [英] Mask overlay on UIScrollView

问题描述

你如何在UIScrollView上覆盖各种掩码图像？

how would you go about overlaying a mask image of sorts on top of a UIScrollView?

例如，我左右褪色的图像是黑色的在中心白色。我想使用它，以便滚动视图中的项目逐渐淡出到两侧，中心项目完全不透明。

For example, I have an image with black on the left and right fading to white in the center. I'd like to use this so that the items in my scroll view gradually fade out to the sides and the center item is completely opaque.

此外，背景为查看滚动视图放置的是一个动态且可以更改的图像（不是纯色）。

Also, the background of the view the scrollview is placed on is an image (not a solid color) which is dynamic and can change.

任何想法？

推荐答案

你的问题是我在基本问题上找到的最佳来源，所以我决定在这里发布我的解决方案。

Your question wound up being the best source I could find on the basic problem, so I decided to post my solution here.

如果您将蒙版直接添加到滚动视图，最终会出于某种原因将蒙版应用于内容本身 - i。即滚动时透明度不会改变。根据其他帖子的建议，我将渐变放在（或更确切地说，包含）滚动视图的视图中。因此，scrollContainer是一个UIViewObject，其唯一的子视图是有问题的滚动视图。

If you add the mask directly to the scroll view, you wind up applying the mask to the content itself for some reason -- i. e. the transparency doesn't shift as you scroll. As per the suggestions of other posts, I put the gradient in a view over (or rather, containing) the scroll view. As a result, scrollContainer is a UIViewObject whose sole subview is the scroll view in question.

此掩码配置为从左向右滚动。您可以通过操纵渐变的起点和终点属性将其更改为从上到下。

This mask is configured for left-to-right scrolling. You could change it to top to bottom by manipulating the start and end point properties of the gradient.

一个缺点是它还会剪切滚动位置条指示器滚动视图。由于我的情况不需要，这是可以接受的，但你的里程可能会有所不同。

The one down side is that this also clips the scroll position bar indicator of the scroll view. Since my scenario doesn't need one, that's acceptable, but your mileage may vary.

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = scrollView.bounds;
gradient.colors = [NSArray arrayWithObjects:
                   (id)[[UIColor colorWithWhite:0 alpha:0] CGColor],
                   (id)[[UIColor colorWithWhite:0 alpha:1] CGColor],
                   (id)[[UIColor colorWithWhite:0 alpha:1] CGColor],
                   (id)[[UIColor colorWithWhite:0 alpha:0] CGColor], nil];
gradient.locations=[NSArray arrayWithObjects:
                    [NSNumber numberWithFloat:0],
                    [NSNumber numberWithFloat:.1],
                    [NSNumber numberWithFloat:.9],
                    [NSNumber numberWithFloat:1], nil];
gradient.startPoint=CGPointMake(0, .5);
gradient.endPoint=CGPointMake(1, .5);
[scrollContainer.layer setMask:gradient];

这篇关于UIScrollView上的掩码覆盖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！