1、什麼是AR Quick Look
1.1、概述
AR Quick Look是用於在AR場景中預覽3D模型的技術，通過它開發者能快速在自己的App中展示高質量的3D內容。
1.2、優點
使用簡單，內置AR場景設置，使用者不需要了解AR技術。
1.3、使用環境
iOS12
1.4、usdz文件
AR Quick Look技術是基於usdz文件的，這是一種全新的用於描述3D模型的文件格式，它基於Pixar的開源USD文件格式，將模型和模型的紋理打包在一個文件當中，同時支持iOS和macOS系統。利用這一文件，我們可以很容易預覽或者分享3D內容。
Xcode10中提供了usdz_converter工具用以生成usdz文件。
2、App中集成AR Quick Look
2.1、QLPreviewController概述
該類是用於展示QLPreviewItem內容的控制器，QLPreviewItem中包含了3D模型的URL和標題。
2.2、QLPreviewController使用
開發者需要實現QLPreviewControllerDataSource和QLPreviewControllerDelegate中3個關鍵方法。
- (NSInteger)numberOfPreviewItemsInPreviewController:(QLPreviewController *)controller;//指明需要展示的Item數量{return 1;}- (id)previewController:(QLPreviewController *)controller previewItemAtIndex:(NSInteger)index;//根據index指明需要展示的QLPreviewItem，這裡關鍵是通過usdz資源文件的路徑生成QLPreviewItem{QLPreviewItem *item = [[QLPreviewItem alloc] init];item.previewItemURL = [[NSBundle mainBundle] URLForResource:@"3d_model" withExtension:@"usdz"];return item;}- (CGRect)previewController:(QLPreviewController *)controller frameForPreviewItem:(id)item inSourceView:(UIView * _Nullable *)view;//指明展示預覽頁面時轉場動畫的參數{return zoom_orginal_rect;} 2.3、Demo
先看效果:
代碼也很簡單：
#import "ViewController.h"#import@interface ViewController () @property (nonatomic) UIButton *button;@end@implementation ViewController- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. self.navigationItem.title=@"預覽"; _button = [[UIButton alloc] init]; _button.frame = CGRectMake(100, 100, 100, 100); _button.backgroundColor = [UIColor yellowColor]; [_button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; [_button setTitle:@"tap" forState:UIControlStateNormal]; [_button addTarget:self action:@selector(tap:) forControlEvents:UIControlEventTouchUpInside]; [self.view addSubview:_button]; }- (void)tap:(id)sender{ QLPreviewController *qlVc = [[QLPreviewController alloc] init]; qlVc.delegate = self; qlVc.dataSource = self; qlVc.navigationController.navigationBar.userInteractionEnabled = YES; qlVc.view.userInteractionEnabled = YES; [self presentViewController:qlVc animated:YES completion:nil];}#pragma mark - QLPreviewController 代理方法- (NSInteger)numberOfPreviewItemsInPreviewController:(QLPreviewController *)controller{ return 1;}- (id )previewController:(QLPreviewController *)controller previewItemAtIndex:(NSInteger)index{ return [[NSBundle mainBundle] URLForResource:@"retrotv" withExtension:@"usdz"];}- (CGRect)previewController:(QLPreviewController *)controller frameForPreviewItem:(id )item inSourceView:(UIView * _Nullable * __nonnull)view{ return _button.frame;}@end
可以在這裡下載usdz文件
3、Safari中預覽3D內容
HTML中可以通過標籤直接嵌入usdz文件的鏈接，這樣就可以在Safari中預覽3D內容了。
4、創建3D模型
4.1、位置
渲染時會進行模型座標系到真實世界座標系的變化，因此3D模型在模型座標系中的位置會直接影響渲染效果。AR Quick Look要求3D模型在模型座標系中的位置符合以下要求：
1.面向攝像機鏡頭
模型座標系如圖所示，z軸的正方向指向鏡頭
2.模型底部平面位於y=0的平面
3.模型底部平面的中心點位於原點 (x=0,y=0,z=0)
4.2、物理尺寸
模型的物理尺寸需要與現實世界相吻合。對於在現實世界中不存在的形象，可以把模型尺寸設置成動態，因而可以隨使用者需要進行縮放。
4.3、動畫
給模型添加動畫可以讓渲染更生動，交互效果更好。因此建議給3D模型添加一個默認的動畫。動畫在渲染時是循環播放的，可以由骨骼動畫和變換動畫混合而成。
這裡有一些給模型添加動畫的建議：
1.選擇增強AR沉浸感的動畫
2.不要讓物體遠離原點製作動畫
3.在整個動畫中保持一致的邊界框
4.創建的動畫在靜態的位置有意義
5.創建的動畫作為獨立場景
4.4、陰影
AR Quick Look 在渲染時會根據現實場景生成陰影，這意味著：你可以選擇打開或者關閉陰影效果，也可以選擇環境光照的條件。需要注意的是，不要在3D模型中設置陰影，因為這樣的話，AR Quick Look生成的陰影會跟模型自帶的陰影重合了。
AR Quick Look會選擇動畫的第一幀作去生成陰影。因此要仔細選擇動畫的第一幀，讓生成的陰影效果與後面的動畫幀契合。
錯誤的陰影例子，動畫的第一幀選擇不當，導致在後續的動畫播放中，即使小球運動到水平位置，左側的陰影依然存在，導致失真。
正確的例子，選擇小球在水平位置的狀態作為動畫第一幀，這樣在小球運動的動畫播放時，陰影不會失真。
4.5、外觀
AR Quick Look使用基於物理的渲染著色器（PBR Shader），提供六個維度去控制3D模型的外觀。
沒有外觀描述的基礎模型：
4.5.1反照率（基礎色）
4.5.2金屬光澤
4.5.3粗糙度
4.5.4表面細節
4.5.5環境光遮蔽
4.5.6發光程度
4.5.7透明度
除了上述6個維度，透明度也能影響模型的渲染效果。透明度是通過改變反照率的alpha通道實現的。官方建議為模型的透明和不透明部分使用單獨的mesh，在模型的透明區域使用透明度。
不透明區域的mesh：
透明區域的mesh：
4.5.8紋理文件格式
描述反照率、表面細節、發光度的文件應該是RGB圖像（反照率可以是RGBA圖像以實現透明度），而描述金屬光澤、粗超度、環境光遮蔽的文件是灰度圖像。這些圖像文件格式可以是任意的iOS系統支持的圖像文件格式，比如.png，圖像長寬必須是2的指數（2048，1024，512...）。
4.5.9設備兼容性
AR Quick Look建議開發者在內存較大的設備上測試模型，比如iPhone 7 Plus，iPhone 8 Plus，iphone X，iPad Pro12.9。在使用這些模型時，AR Quick Look會根據設備需要，動態對模型的圖像文件進行降採樣以優化內存使用（比如在舊的設備上），但是網格和動畫不會修改。
4.5.10模型尺寸約束
影響模型渲染時的內存消耗主要有網格和動畫的複雜度，紋理文件大小和數量。官方建議：
1.單個物體模型，網格中多邊形數量在100k左右
2.紋理圖像為2048*2048
3.10秒的動畫
4.在真實設備上測試你的模型
4.6、優化並輸出模型
4.6.1優化模型
官方給出的優化建議包括：
1.凍結變換併合並相鄰的頂點
2.如果可能，請為整個模型使用單個材質/紋理集
3.不要包含你不需要的紋理
4.把你的紋理預算花在增加最大價值和體現模型現實性的方面
5.請記住像素在AR中具有物理大小
6.在紋理的質量和文件大小間平衡
4.6.2 usdz Converter
Xcode 10自帶的命令行工具，用來生成usdz文件
工具的輸入是：
OBJ 文件
單幀的Alembic文件
USD文件（.usda 或.usdc）
一個usdz文件包含下面內容：
通過usdz_converter命令，可以把3D模型素材轉化為usdz文件:
5、總結
AR Quick Look給開發者提供了便捷的3D模型預覽和分享的工具，在生成usdz文件後，可以很輕鬆的在App或者HTML中展示AR效果。
閱讀更多 今日頭條技術團隊 的文章
