Texture——保持最复杂的用户界面的流畅和响应

翻译自Texture

Texture 是建立在UIKit之上的iOS框架，可以保持最复杂的用户界面的流畅和响应。它最初是为了使Facebook的页面尽可能的流畅，并与流行的基于物理的动画相辅相成 - 但它与UIKit Dynamics和常规应用程序设计一样强大。最近，它被用来加强Pinterest的应用重写。

随着框架的发展，增加了许多功能，通过消除现代iOS应用程序中常见的常见样板结构，可以节省开发人员的时间。如果您曾经处理过cell重复使用的错误，那么尝试预先为页面或滚动样式界面预加载数据，甚至只是试图让您的应用程序丢弃太多的框架，从而可以从集成纹理获益。

一、入门

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

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

Texture使您可以从主线程移除图像解码，文本大小和渲染以及其他昂贵的UI操作到其它线程，以保持主线程可用于响应用户交互。 Texture还有其他的技巧，但是我们稍后会介绍。

节点

如果习惯于使用视图，您已经知道如何使用节点。
大多数方法有一个节点相当于大部分 UIView和CALayer性能也是可用的。在任何情况下，如果存在命名差异（如.clipsToBoundsvs .masksToBounds），节点将默认为该UIView
`名称。唯一的例外是节点使用位置而不是中心。

当然，您可以直接通过node.view或直接访问底层视图或图层node.layer
，只需确保在主线程上执行！

Texture提供了各种节点来替代您以前使用的大多数UIKit组件。大规模应用程序已经能够使用Texture节点完全编写UI。

节点容器

将应用转换为使用纹理时，常见的错误是将节点直接添加到现有的视图层次结构中。这样做将几乎保证您的节点在呈现时将闪烁。

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

布局引擎

纹理的布局引擎既是其最强大的功能之一，也是其最独特的功能之一。基于CSS FlexBox模型，它提供了一种声明性的方式来指定自定义节点的大小和子节点的布局。虽然默认情况下同时渲染所有节点，但是通过ASLayoutSpec为每个节点提供异步测量和布局来执行。

高级开发者功能

纹理提供了在UIKit或Foundation中无法找到的各种高级开发人员功能。我们的开发人员发现，AsyncDisplyKit可以简化其架构并提高开发人员的速度。

（全部列表即将推出！）

添加纹理到您的应用程序

如果您是Texture的新手，建议您查看我们的ASDKgram示例应用程序。
我们已经创建了一个方便的指南（即将推出），并提供了一步一步的指导，并提供了关于如何向应用程序添加纹理的示例。

如果您遇到任何问题，请联系我们GitHub或Texture
Slack社区寻求帮助。

二、资源

浏览我们的许多示例项目。

如果您刚开始使用Texture，我们建议您先从[ASDKgram(https://github.com/texturegroup/texture/tree/master/examples/ASDKgram)示例应用程序开始，该应用程序将使用UIKit实现的照片Feed与使用Texture实现的相同Feed进行比较。应用功能：

• 一个无限滚动的家庭饲料，显示纹理更平滑的滚动表现。

• 一个显着大小的代码库，以演示使用纹理设计应用程序所需的代码少得多。

视频

• AsyncDisplayKit 2.0：定义第七个抽象层 **[Pinterest HQ 2016]

• 使用AsyncDisplayKit 2.0进行规模布局 [NSMeetup 2016]

• ASCollectionNode [Pinterest HQ 2016]

• AsyncDisplayKit代码状态 [WWDC 2016]

• AsyncDisplayKit 2.0：智能用户界面 **[NSSpain 2015]

• AsyncDisplayKit的轻松回应 **[MCE 2015]

• 异步UI [NSLondon 2014]

教程/文章

• 使用AsyncDisplayKit在iOS中开发响应式UI **[Ziad Tamim，12.29.2016]

• AsyncDisplayKit 2.0教程：自动布局 **[Luke Parham，12.19.2016]

• AsyncDisplayKit 2.0教程：入门 **[Luke Parham，12.5.2016]

• iOS平滑滚动在缓冲区为iOS：如何（和为什么）我们实现AsyncDisplayKit **[安迪Yates，11.4.2016]

布局资源

Texture强大的布局系统是基于CSS FlexBox模型。
这些网站可用于学习此系统的基础知识。

• ASStackLayout游戏
• [CSS3 Flexbox视觉指南](https://demos.scotch.io/visual-guide-to-css3-
• flexbox-flexbox-playground/demos/)
• FlexBox模式

三、安装

Texture可以通过CocoaPods或Carthage添加到您的项目中。不要忘记导入框架头：

#import <AsyncDisplayKit / AsyncDisplayKit.h>```

或创建一个[Objective-C桥接头](https://developer.apple.com/library/ios/documentation/swift/conceptual/buildingcocoaapps/MixandMatch.html)（Swift）。
如果您在安装纹理时遇到任何问题，请通过Github或[Slack](http://texturegroup.org/slack.html)联系我们！

#### 1、CocoaPods

CocoaPods提供[Texture](https://cocoapods.org/pods/Texture)。
将以下内容添加到您的Podfile中：

target 'MyApp' do
pod "Texture"
end

在运行前完全退出Xcode
在终端的项目目录里，

pod install

要更新您的Texture版本，请在终端的项目目录里运行

pod update Texture

#### 2、Carthage (standard build)

>使用Carthage的标准方法是将Cartfile列出为依赖关系，然后运行`carthage update`将依赖关系下载到`Cathage / Checkouts`文件夹中，并将其中的每一个构建到位于“Carthage / Build”文件夹中的框架中，最后开发人员必须手动整合项目。

Texture 也可以通过[Carthage](https://github.com/Carthage/Carthage)安装。

将以下内容添加到您的Cartfile以获取**最新版本**的分支：

github“texturegroup / texture”

或者是，主分支

github“facetexturegroup / textureaster”

Texture有自己的Cartfile列出它的依赖关系，所以这是您需要包含在您的Cartfile中的唯一一行。

carthage update

在终端，这将获取`Carthage/Checkouts`文件夹的依赖关系，然后构建每个文件夹。

查找终端输出确认`Texture`，`PINRemoteImage (3.0.0-beta.2)`并且`PINCache`都被取出和建立。Texture框架Cartfile应正确处理依赖关系。

在Xcode中，在应用程序目标的**“常规”**设置选项卡上的 **“链接框架和库”**部分中，从`Carthage/Build`磁盘上的文件夹中拖放要使用的每个框架。


#### 3、Carthage (light)

`Texture`不支持使用`Carthage`的轻量级的方法，您可以手动添加项目文件。这是因为它的一个依赖关系`PINCache`（一个嵌套的依赖关PINRemoteImage）还没有一个项目文件。

如果不包括`PINRemoteImage`与`PINCache`，你不会得到纹理的完整图像的功能集。