mirror of
https://github.com/Swiftgram/Telegram-iOS.git
synced 2025-12-24 07:05:35 +00:00
[ASImageNode] Add documentation for image effects #trivial (#263)
* Add documentation for doing image effects * Link to image modification documentation in the image node documentation
This commit is contained in:
committed by
Huy Nguyen
parent
326925839d
commit
0a7f8ea1d6
@@ -33,44 +33,13 @@ imageNode.contentMode = .scaleAspectFill
|
||||
</div>
|
||||
|
||||
|
||||
### Image Modification Block
|
||||
### Image transformations and effects
|
||||
|
||||
Many times, operations that would affect the appearance of an image you're displaying are big sources of main thread work. Naturally, you want to move these to a background thread. By assigning an `imageModificationBlock` to your `imageNode`, you can define a set of transformations that need to happen asynchronously to any image that gets set on the `imageNode`.
|
||||
Many times, operations that would affect the appearance of an image you're displaying are big sources of main thread work. Naturally, you want to move these to a background thread.
|
||||
|
||||
<div class = "highlight-group">
|
||||
<span class="language-toggle"><a data-lang="swift" class="swiftButton">Swift</a><a data-lang="objective-c" class = "active objcButton">Objective-C</a></span>
|
||||
By assigning an `imageModificationBlock` to your `imageNode`, you can define a set of transformations that need to happen asynchronously to any image that gets set on the `imageNode`, including image effects such as rounding, adding borders, or other pattern overlays, without extraneous display calls.
|
||||
|
||||
<div class = "code">
|
||||
<pre lang="objc" class="objcCode">
|
||||
_backgroundImageNode.imageModificationBlock = ^(UIImage *image) {
|
||||
UIImage *newImage = [image applyBlurWithRadius:30
|
||||
tintColor:[UIColor colorWithWhite:0.5 alpha:0.3]
|
||||
saturationDeltaFactor:1.8
|
||||
maskImage:nil];
|
||||
return newImage ? newImage : image;
|
||||
};
|
||||
|
||||
//some time later...
|
||||
|
||||
_backgroundImageNode.image = someImage;
|
||||
</pre>
|
||||
|
||||
<pre lang="swift" class = "swiftCode hidden">
|
||||
backgroundImageNode.imageModificationBlock = { image in
|
||||
let newImage = image.applyBlurWithRadius(30, tintColor: UIColor(white: 0.5, alpha: 0.3),
|
||||
saturationDeltaFactor: 1.8,
|
||||
maskImage: nil)
|
||||
return (newImage != nil) ? newImage : image
|
||||
}
|
||||
|
||||
//some time later...
|
||||
|
||||
backgroundImageNode.image = someImage
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
The image named "someImage" will now be blurred asynchronously before being assigned to the `imageNode` to be displayed.
|
||||
You can read more about it at <a href="image-modification-block.html">Image Modification Blocks</a>.
|
||||
|
||||
### Image Cropping
|
||||
|
||||
@@ -82,7 +51,7 @@ By default, the expanded image will be centered within the bounds of the view. T
|
||||
|
||||
That's messed up. To fix it, you can set the `cropRect` property to move the image over. By default it is set to `CGRectMake(0.5, 0.5, 0.0, 0.0)`.
|
||||
|
||||
The rectangle is specified as a "unit rectangle," using percentages of the source image's width and height. To show the image starting at the left side, you can set the `cropRect`'s `x` value to be `0.0`, meaning the image's origin should start at `{0, 0}` as opposed to the default.
|
||||
The rectangle is specified as a "unit rectangle," using percentages of the source image's width and height. To show the image starting at the left side, you can set the `cropRect`'s `x` value to be `0.0`, meaning the image's origin should start at `{0, 0}` as opposed to the default.
|
||||
|
||||
<div class = "highlight-group">
|
||||
<span class="language-toggle"><a data-lang="swift" class="swiftButton">Swift</a><a data-lang="objective-c" class = "active objcButton">Objective-C</a></span>
|
||||
|
||||
Reference in New Issue
Block a user