天天看點

Android布局優化----ViewStub、include、merge

1 StubView

作用:StubView标簽中的布局隻有在需要的時候才會被渲染加載。

注意:StubView的渲染加載操作隻能執行一次;不支援merge标簽

使用示例:

(1)ViewStub中引用的布局

<code>&lt;?</code><code>xml</code> <code>version</code><code>=</code><code>"1.0"</code> <code>encoding</code><code>=</code><code>"utf-8"</code><code>?&gt;</code>

<code>&lt;</code><code>LinearLayout</code>

<code>    </code><code>android:id</code><code>=</code><code>"@+id/stublayout"</code>

<code>    </code><code>xmlns:android</code><code>=</code><code>"http://schemas.android.com/apk/res/android"</code>

<code>    </code><code>android:orientation</code><code>=</code><code>"vertical"</code> <code>android:layout_width</code><code>=</code><code>"match_parent"</code>

<code>    </code><code>android:layout_height</code><code>=</code><code>"match_parent"</code><code>&gt;</code>

<code>    </code><code>&lt;</code><code>TextView</code>

<code>        </code><code>android:id</code><code>=</code><code>"@+id/sbtv"</code>

<code>        </code><code>android:layout_width</code><code>=</code><code>"300dp"</code>

<code>        </code><code>android:layout_height</code><code>=</code><code>"300dp"</code>

<code>        </code><code>android:text</code><code>=</code><code>"this is sub text view"</code><code>/&gt;</code>

<code>&lt;/</code><code>LinearLayout</code><code>&gt;</code>

(2)使用ViewStub

<code>&lt;</code><code>ViewStub</code>

<code>    </code><code>android:id</code><code>=</code><code>"@+id/viewstub"</code>

<code>    </code><code>android:layout_width</code><code>=</code><code>"100dp"</code>

<code>    </code><code>android:layout_height</code><code>=</code><code>"100dp"</code>

<code>    </code><code>android:layout</code><code>=</code><code>"@layout/sublayout"</code><code>/&gt;</code>

(3)java代碼中渲染加載

<code>ViewStub stub = (ViewStub)findViewById(R.id.viewstub);</code>

<code>stub.inflate();</code>

<code>TextView stubtv = (TextView)layout.findViewById(R.id.sbtv);</code>

<code>stubtv.setText(</code><code>"hello stub!"</code><code>);</code>

2 include标簽

作用:将引用的布局替換到目前布局中該标簽所處的位置;

注意:引用的布局非merge,設定inlude的id屬性後會覆寫掉引用布局頂層layout的id;

示例1 引用布局非merge

(1)引用布局

<code>&lt;</code><code>LinearLayout</code> <code>xmlns:android</code><code>=</code><code>"http://schemas.android.com/apk/res/android"</code>

<code>    </code><code>android:id</code><code>=</code><code>"@+id/sharedlayout2"</code>

<code>    </code><code>android:layout_width</code><code>=</code><code>"200dp"</code>

<code>    </code><code>android:layout_height</code><code>=</code><code>"200dp"</code>

<code>    </code><code>android:background</code><code>=</code><code>"@android:color/black"</code><code>&gt;</code>

<code>        </code><code>android:id</code><code>=</code><code>"@+id/mytv"</code>

<code>        </code><code>android:layout_width</code><code>=</code><code>"100dp"</code>

<code>        </code><code>android:layout_height</code><code>=</code><code>"100dp"</code>

<code>        </code><code>android:background</code><code>=</code><code>"@android:color/holo_blue_light"</code>

<code>        </code><code>android:text</code><code>=</code><code>"這時一個公用的布局"</code><code>/&gt;</code>

(2)使用include标簽

<code>&lt;include</code>

<code>    </code><code>android:id=</code><code>"@+id/include1"</code><code>&lt;!--該id會覆寫布局(</code><code>1</code><code>)中LinearLayout的id;--&gt;</code>

<code>    </code><code>layout=</code><code>"@layout/my"</code>

<code>    </code><code>android:layout_width=</code><code>"50dp"</code>

<code>    </code><code>android:layout_height=</code><code>"50dp"</code><code>&gt;&lt;/include&gt;</code>

(3)java中使用

<code>LinearLayout sharedlayout = (LinearLayout) findViewById(R.id.include1);</code>

<code>TextView tv = (TextView) sharedlayout.findViewById(R.id.mytv);</code>

<code>tv.setText(</code><code>"hello include1"</code><code>);</code>

示例2 引用merge布局

<code>&lt;</code><code>merge</code> <code>xmlns:android</code><code>=</code><code>"http://schemas.android.com/apk/res/android"</code><code>&gt;</code>

<code>    </code><code>&lt;</code><code>LinearLayout</code>

<code>        </code><code>android:id</code><code>=</code><code>"@+id/mergetlayout"</code>

<code>        </code><code>android:layout_width</code><code>=</code><code>"wrap_content"</code>

<code>        </code><code>android:layout_height</code><code>=</code><code>"wrap_content"</code><code>&gt;</code>

<code>        </code><code>&lt;</code><code>TextView</code>

<code>            </code><code>android:id</code><code>=</code><code>"@+id/mergetv1"</code>

<code>            </code><code>android:layout_width</code><code>=</code><code>"40dp"</code>

<code>            </code><code>android:layout_height</code><code>=</code><code>"40dp"</code>

<code>            </code><code>android:background</code><code>=</code><code>"@android:color/holo_blue_bright"</code>

<code>            </code><code>android:text</code><code>=</code><code>"merge text1"</code> <code>/&gt;</code>

<code>            </code><code>android:id</code><code>=</code><code>"@+id/mergetv2"</code>

<code>            </code><code>android:background</code><code>=</code><code>"@android:color/darker_gray"</code>

<code>            </code><code>android:text</code><code>=</code><code>"merge text2"</code> <code>/&gt;</code>

<code>    </code><code>&lt;/</code><code>LinearLayout</code><code>&gt;</code>

<code>&lt;/</code><code>merge</code><code>&gt;</code>

(2)include标簽:merge布局沒有id屬性,是以這裡的id其實沒有意義

<code>&lt;</code><code>include</code>

<code>    </code><code>android:id</code><code>=</code><code>"@+id/include2"</code>

<code>    </code><code>layout</code><code>=</code><code>"@layout/mymerge"</code><code>&gt;&lt;/</code><code>include</code><code>&gt;</code>

<code>//LinearLayout layout = (LinearLayout)findViewById(R.id.include2);//通過該代碼無法擷取(1)                                                    中的LinearLayout,這裡的layout為null</code>

<code>TextView mTV1 = (TextView)findViewById(R.id.mergetv1);</code>

<code>mTV1.setText(</code><code>"hello merge tv1"</code><code>);</code>

<code>TextView mtv2 = (TextView)findViewById(R.id.mergetv2);</code>

<code>mtv2.setText(</code><code>"hello merge tv2"</code><code>);</code>

3 merge标簽

    merge标簽相當于控件的簡單集合,被include到其他布局中後根據所處容器布局結合各個控件的相關屬性進行布局。

注意:merge标簽沒有id屬性

(1)merge布局

<code>        </code><code>android:id</code><code>=</code><code>"@+id/mergetv1"</code>

<code>        </code><code>android:layout_width</code><code>=</code><code>"40dp"</code>

<code>        </code><code>android:layout_height</code><code>=</code><code>"40dp"</code>

<code>        </code><code>android:background</code><code>=</code><code>"@android:color/holo_blue_bright"</code>

<code>        </code><code>android:text</code><code>=</code><code>"merge text1"</code> <code>/&gt;</code>

<code>        </code><code>android:id</code><code>=</code><code>"@+id/mergetv2"</code>

<code>        </code><code>android:background</code><code>=</code><code>"@android:color/darker_gray"</code>

<code>        </code><code>android:text</code><code>=</code><code>"merge text2"</code> <code>/&gt;</code>

此時的布局為兩個textview重疊并且mergetv2處于上層;

(2)merge标簽使用

(3)由于該include标簽處于一個豎直的linearlayout中,此時merge布局的顯示效果如下:

merge text 1

merge text 2

(4)java中使用

<code></code>

本文轉自wauoen51CTO部落格,原文連結:http://blog.51cto.com/7183397/1847175 ,如需轉載請自行聯系原作者

繼續閱讀