Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Docs] Update 'Corner Rounding' document for Texture 2 #359

Merged
merged 6 commits into from
Jun 15, 2017
Merged

[Docs] Update 'Corner Rounding' document for Texture 2 #359

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
6e780ef
Merge remote-tracking branch 'TextureGroup/master'
ArchimboldiMao Jun 13, 2017
03eaa0e
Texture 2.0 has been released.
ArchimboldiMao Jun 13, 2017
a9aacd0
Remove duplicate words.
ArchimboldiMao Jun 13, 2017
fda6d04
Texture 2.0 has been released.
ArchimboldiMao Jun 13, 2017
d96e94a
Remove duplicate words.
ArchimboldiMao Jun 13, 2017
10a1d06
Merge remote-tracking branch 'origin/master'
ArchimboldiMao Jun 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 2 additions & 6 deletions docs/_docs/corner-rounding.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ There are only three things to consider when picking a corner rounding strategy:

Movement **underneath the corner** is any movement behind the corner. For example, as a rounded-corner collection cell scrolls over a background, the background will move underneath and out from under the corners.

To describe movement **through the corner,** imagine a small rounded-corner scroll view containing a much larger photo. As you zoom and pan the photo inside of the scroll view, the photo will move through the corners of the of the scroll view.
To describe movement **through the corner,** imagine a small rounded-corner scroll view containing a much larger photo. As you zoom and pan the photo inside of the scroll view, the photo will move through the corners of the scroll view.

<img src="/static/images/corner-rounding-movement.png" width="60%" height="60%">

Expand Down Expand Up @@ -64,7 +64,7 @@ A key limitation of precomposited corners is that the corners must only touch on
Note that Texture nodes have a special optimization of `.cornerRadius` that automatically implements precomposited corners **only when using** `.shouldRasterizeDescendants`. It's important to think carefully before you enable rasterization, so don't use this option without first reading all about the <a href = "subtree-rasterization.html">concept</a>.

<div class = "note">
If you're looking for a simple, flat-color rounded rectangle or circle, Texture offers a variety of conveniences to provide this. See `UIImage+ASConveniences.h` for methods to create flat-colored, rounded-corner resizable images using precomposited corners (both alpha and opaque are supported). These are great for use as placeholders for image nodes or backgrounds for ASButtonNode. <b>More precomposited corner methods will be released with Texture 2.0 release</b>.
If you're looking for a simple, flat-color rounded rectangle or circle, Texture offers a variety of conveniences to provide this. See `UIImage+ASConveniences.h` for methods to create flat-colored, rounded-corner resizable images using precomposited corners (both alpha and opaque are supported). These are great for use as placeholders for image nodes or backgrounds for ASButtonNode.
</div>

### Clip Corner
Expand All @@ -80,10 +80,6 @@ Clip corners applies to two main types of corner rounding situations:
<li>Rounded corners on top of a stationary texture or photo background. The photo clip corner method is tricky, but useful!</li>
</ul>

<div class = "note">
<b>Check back soon! Clip corner methods may be released in Texture 2.0 release</b>.
</div>

## Is it ever okay to use CALayer's .cornerRadius property?

There are a few, quite rare cases in which it is appropriate to use `.cornerRadius.` These include when there is dynamic content moving _both_ through the inside and underneath the corner. For certain animations, this is impossible to avoid. However, in many cases, it is easy to adjust your design to eliminate one of the sources of movement. One such case was discussed in the section on corner movement.
Expand Down