Safari插件机制研究(二) 插件的视图管理

我不是女神ヾ 2022-01-29 11:49 178阅读 0赞

*Note:首先相对于WebKit官网的代码，iOS上的版本使用WAKView代替了NSView。　比如Mac OS中将PlatformWidget定义为 NSView\*, 而在iOS中则是WAKView \*. 详细的内容可以参考Hursing的*[博客][Link 1]*。*

## Overview ##

观察一份含有视频的页面的视图结构:

**Hierarchy of UIWebView**

<UIWebView: 0x8d8c160; frame = (0 78; 768 926);

| <\_UIWebViewScrollView: 0x8d95310; frame = (0 0; 768 926);

|    | <UIImageView: 0x8d96eb0; frame = (0 0; 10 10);

|    | ...

|    | <**UIWebBrowserView**: 0xa2a3c00; frame = (0 0; 768 926);

|    |    | <TileHostLayer: 0x8d8d4a0> (layer)

|    |    |    | <TileLayer: 0x8a81e20> (layer)

|    |    | <CALayer: 0x7579a70> (layer)

|    |    |    | <WebLayer: 0x71ab2b0> (layer)

|    |    |    |    |    |    |    | <FigPluginView: 0xb1d6670; frame = (0 0; 631 278);

|    | <UIImageView: 0x8c650d0; frame = (0 919; 768 7);

|    | <UIImageView: 0x8c7d760; frame = (761 0; 7 926);

**Hierarchy of WebView**

**UIWebBrowserView (UIView)**

| \_webView <WebView: WAK: 0x7541e70 (WK: 0x7541ee0)>

|    | <WebFrameView: WAK: 0x75428c0 (WK: 0x7542910)>

|    |    |<WAKScrollView: WAK: 0x7542c90 (WK: 0x7542cf0)>

|    |    |    |<WAKClipView: WAK: 0x7542e80 (WK: 0x7542ed0)>

|    |    |    |    |<WebHTMLView:WAK: 0x8e226e0 (WK: 0x8e2c5a0)>

|    |    |    |    |    |<**UIWebPlugInView**:WAK: 0x8e31a60 (WK: 0x8e31ad0)>

\*这里不是直接的子视图的关系，而是由UIWebBrowserView的成员变量\_webView所管理的一个WAKView树。

在从UIWebView向下展开，在视图层次上有播件的视图FigPluginView。下面的树是从WebView层展开会看到UIWebPlugInView(注意第二个大写的i)。而FigPluginView是由UIWebPluginView管理的([见前一篇][Link 2])。

UIWebPluginView只关心plugin视图、layer和交互，所以通过下图可以看到它除了提供４个WebKit Plugin的接口函数，一些绘制操作的接口(setFrame,layout….), 剩下的基本都和layer有关了。Widget中的m\_widget指向一个WAKView, 在WebFrameView创建WebHTMLView会将它指定给一个Widget。而Widget会由RenderWidget在加载插件时添加到FrameView上。

![20130608110019062][]

关于Widget可以参考这里:[WebCore::Widget浅探][WebCore_Widget]。

## **UIPlugInView - 初始化视图 (视频插件)** ##

这个创建过程是建立好插件视图FigPluginView、UIWebPlugInViiew和WebPluginController的关系。

![20130606202858781][]

## **UIPlugInView - 添加插件视图到页面视图** ##

UIWebPlugInView接收到setFrame来设置大小时会将插件视图FigPluginView添加到UIBrowserView中，然后将视频插件的layer关联进来。

![20130606202930046][]

## **UIPlugInView - attach/detach视图** ##

在排版过程中，会通过RenderBox (Step 1)触发UIWebPlugInView attach插件视图。当视图移除时(Step 4)将插件的layer detach出去。

![20130606203004671][]

转载请注明出处: [http://blog.csdn.net/horkychen][http_blog.csdn.net_horkychen]

[Link 1]: http://blog.csdn.net/hursing
[Link 2]: http://blog.csdn.net/horkychen/article/details/9033179
[20130608110019062]: /images/20220129/82194c00529140d684a1fad0ba39c3ca.png
[WebCore_Widget]: http://blog.csdn.net/hursing/article/details/8688873
[20130606202858781]: /images/20220129/c5c99e1ab5ad4a5db757901752f1815e.png
[20130606202930046]: /images/20220129/7d318576b52b46b4aef725b778126f65.png
[20130606203004671]: /images/20220129/9569d3dc2a2845fc96521fde4aee680f.png
[http_blog.csdn.net_horkychen]: http://blog.csdn.net/horkychen