iOS Texture ＜AsyncDisplayKit＞ 学习之入门

入门

Texture的基本单位是node。ASDisplayNode是UIView上的抽象，而UIView又是CALayer上的抽象。与只能在主线程上使用的视图不同，node是线程安全的：您可以在后台线程上并行实例化和配置它们的整个层次结构。

为了保持用户界面的流畅和响应，你的应用程序应该以每秒60帧的速度呈现——这是iOS上的黄金标准。这意味着主线程有六十分之一秒的时间来推动每个帧。执行所有布局和绘图代码需要16毫秒！而且由于系统开销，在导致帧丢失之前，代码的运行时间通常少于10毫秒。

Texture允许您将图像解码、文本大小和渲染以及其他昂贵的UI操作从主线程中移出，以使主线程能够响应用户交互。Texture也有其他的诀窍…但我们稍后再讨论。

Nodes(节点)

如果您习惯于使用view，那么您已经知道如何使用node。大多数方法都有一个node等价物，大多数UIView和CALayer属性也可用。在任何命名不一致的情况下（例如.clipsToBounds vs.masksToBounds），node将默认为UIView名称。唯一的例外是node使用position而不是center。

当然，您始终可以通过node.view或者node.layer，确保在主线程上执行！

Texture提供了各种各样的node来替换您所使用的大多数UIKit组件。大型应用已经能够完全使用Texture node来编写用户界面。

Node Subclasses

Texture提供以下node。

与UIKit组件相比，使用node的一个关键优势是，所有node都在主线程之外执行布局和显示，因此主线程可以立即响应用户交互事件。

Texture Node	等同UIKit中
ASDisplayNode	代替UIKit的UIView根Texturenode，所有其他node都从该node继承。
ASCellNode	代替UIKit的UITableViewCell和UICollectionViewCell ASCellNodes用于ASTableNode、ASCollectionNode和ASPagerNode。
ASScrollNode	代替UIKit的UIScrollView 此node对于创建包含其他node的自定义可滚动区域非常有用。
ASEditableTextNode	代替UIKit的UITextView
ASTextNode	代替UIKit的 UILabel
ASImageNode ASNetworkImageNode ASMultiplexImageNode	代替UIKit的UIImageView
ASVideoNode	代替UIKit AVPlayerLayer
ASVideoPlayerNode	代替UIKit的UIMoviePlayer
ASControlNode	代替UIKit的UIControl
ASButtonNode	代替UIKit 的ASButtonNode
ASMapNode	代替UIKit的MKMapView

尽管与UIKit组件有大致的等价性，但一般来说，Texture node提供了更高级的功能和便利性。例如，ASNetworkImageNode执行自动加载和缓存管理，甚至支持渐进式jpeg和动画gif。

AsyncDisplayKitOverview示例应用程序提供了上面列出的每个node的基本实现。

node继承层次结构

node容器

将应用程序转换为使用Texture时，一个常见的错误是将node直接添加到现有view层次结构中。这样做实际上可以保证node在渲染时闪烁。

相反，您应该添加node作为多个node容器类之一的子node。这些容器负责告诉包含的node它们当前处于什么状态，以便可以加载数据并尽可能高效地呈现node。您应该将这些类视为UIKit和Texture之间的集成点。

在node容器中使用node

强烈建议在node容器中使用Texture的node。Texture提供以下node容器。

对应关系表格

Texture Node Container	UIKit
ASCollectionNode	UICollectionView
ASPagerNode	UIPageViewController
ASTableNode	UITableView
ASViewController	UIViewController
ASNavigationController	UINavigationController 实现ASVisibility协议
ASTabBarController	UITabBarController 实现ASVisibility协议

每个node容器的文档中都突出显示了示例代码和特定的示例项目。

使用node容器有什么好处？

node容器自动管理其node的智能预加载。这意味着所有node的布局测量、数据获取、解码和渲染都将异步完成。除了其他便利，这就是为什么建议在node容器中使用node的原因。

请注意，虽然可以直接使用node（不使用Texturenode容器），但除非添加其他调用，否则只有在它们出现在屏幕上时才会开始显示（就像UIKit一样）。这可能导致性能下降和内容闪烁。

布局引擎

Texture的布局引擎既是它最强大的功能之一，也是它最独特的功能之一。基于cssflexbox模型，它提供了一种声明性的方法来指定自定义node的大小及其子node的布局。默认情况下，所有node都是并发呈现的，异步测量和布局是通过为每个node提供一个ASLayoutSpec来执行的。

Texture的布局引擎基于CSS框模型。虽然框架的特性与UIKit等价物（AutoLayout）最不相似，但一旦你习惯了，它也是最有用的特性之一。经过足够的实践，您可能会更喜欢创建声明性布局而不是基于约束的方法。;]

参与这个系统的主要方法是在node子类中实现-layoutSpecThatFits:。在这里，您可以声明性地从内到外构建布局规范，返回包含其余部分的最终规范。

- (ASLayoutSpec *)layoutSpecThatFits:(ASSizeRange)constrainedSize
{
  ASStackLayoutSpec *verticalStack = [ASStackLayoutSpec verticalStackLayoutSpec];
  verticalStack.direction          = ASStackLayoutDirectionVertical;
  verticalStack.spacing            = 4.0;
  [verticalStack setChildren:_commentNodes];

  return verticalStack;
}

虽然这个例子非常简单，但它让你了解了如何使用布局规范。例如，堆栈布局规范定义了一个node布局，在该布局中，chlidren将按照指定的方向和指定的间距相邻地布局。它与UIStackView非常相似，但它还具有向后兼容性的优点。

ASLayoutable

布局规范的子级可以是类符合<ASLayoutable>协议的任何对象。所有node以及所有布局规范都符合<ASLayoutable>协议。这意味着您的布局可以构建在可组合的块中，直到您得到您想要的。

假设您想在已经设置的堆栈中添加8像素填充：

- (ASLayoutSpec *)layoutSpecThatFits:(ASSizeRange)constrainedSize
{
  ASStackLayoutSpec *verticalStack = [ASStackLayoutSpec verticalStackLayoutSpec];
  verticalStack.direction          = ASStackLayoutDirectionVertical;
  verticalStack.spacing            = 4.0;
  [verticalStack setChildren:_commentNodes];
  
  UIEdgeInsets insets = UIEdgeInsetsMake(8, 8, 8, 8);
  ASInsetLayoutSpec *insetSpec = [ASInsetLayoutSpec insetLayoutSpecWithInsets:insets 
                                      child:verticalStack];
  
  return insetSpec;
}

您可以通过将该堆栈作为inset布局规范的子级来轻松实现这一点。

高级开发人员功能

Texture提供了UIKit或Foundation中无法找到的各种高级开发人员功能。我们的开发人员发现，Texture可以简化他们的架构，并提高开发人员的开发速度。
（很快就会有完整的列表！）

向应用程序添加Texture

如果你是个Texture新手，我们建议你看看我们的ASDKgram示例应用程序。我们已经创建了一个方便的指南（即将推出！）一步一步的指导和一个后续的例子如何添加Texture到一个应用程序。

使用安装方法

Texture 可以通过 CocoaPods .记得引入头文件:

#import <AsyncDisplayKit/AsyncDisplayKit.h>

CocoaPods

CocoaPods上有Texture。在Podfile中添加以下内容：

target 'MyApp' do
	pod "Texture"
end

或者直接在GitHub上查找:

github "texturegroup/texture" "master"