本帖最后由 echohe 于 2014-4-9 10:13 編輯
以下文章轉(zhuǎn)自@安卓泡面
在工作中,,曾多次碰到ScrollView嵌套ListView的問(wèn)題,網(wǎng)上的解決方法有很多種,,但是雜而不全,。我試過(guò)很多種方法,它們各有利弊,。 在這里我將會(huì)從使用ScrollView嵌套ListView結(jié)構(gòu)的原因,、這個(gè)結(jié)構(gòu)碰到的問(wèn)題、幾種解決方案和優(yōu)缺點(diǎn)比較,,這4個(gè)方面來(lái)為大家闡述,、分析、總結(jié),。 實(shí)際上不光是ListView,,其他繼承自AbsListView的類也適用,包括ExpandableListView,、GridView等等,,為了方便說(shuō)明,以下均用ListView來(lái)代表,。
一,、 為什么要使用ScrollView嵌套ListView的奇怪的結(jié)構(gòu)
ScrollView和ListView都是滾動(dòng)結(jié)構(gòu),按理說(shuō),,這兩個(gè)控件在UI上的功能是一樣的,,但是看看下面這個(gè)設(shè)計(jì): ![141.png 141.png](http://image95.360doc.com/DownloadImg/2016/03/1609/67838008_6.png) 這是天貓商城的確認(rèn)訂單的頁(yè)面,ScrollView中嵌套了ExpandableListView,,ExpandableListView上面有固定的一些控件,,下面也有固定的一些控件,整體又要能夠滾動(dòng),。 列表數(shù)據(jù)要嵌在固定數(shù)據(jù)中間,,并且作為整體一起滾動(dòng),有了這樣的設(shè)計(jì)需求,,于是就有了ScrollView嵌套ListView的奇怪結(jié)構(gòu),。
二,、 ScrollView、ListView嵌套結(jié)構(gòu)碰到的問(wèn)題
不多說(shuō),,直接看失敗例子: - <ScrollView
- android:id="@+id/act_solution_1_sv"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <LinearLayout
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical">
- <TextView
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:text="\nListView上方數(shù)據(jù)\n" />
- <ListView
- android:id="@+id/act_solution_1_lv"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ListView>
- <TextView
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:text="\nListView下方數(shù)據(jù)\n" />
- </LinearLayout>
- </ScrollView>
ScrollView中只能放一個(gè)控件,,一般都放LinearLayout,orientation屬性值為vertical,。在LinearLayout中放需要呈現(xiàn)的內(nèi)容,。ListView也在其中,ListView的高度設(shè)為適應(yīng)自身內(nèi)容(wrap_content),。粗略一看,,應(yīng)該沒有什么問(wèn)題。但是看下面的實(shí)際效果圖:
![142.png 142.png](http://image95.360doc.com/DownloadImg/2016/03/1609/67838008_7.png) 圖中黑框的部分就是ListView,,里面放了20條數(shù)據(jù),,但是卻只顯示了1條。 控件的屬性設(shè)置上沒有問(wèn)題,,但是為什么沒有按照我的想法走呢,? 看看下面這個(gè)圖: ![143.png 143.png](http://image95.360doc.com/DownloadImg/2016/03/1609/67838008_8.png) 是否有點(diǎn)明白了呢?原因就是scroll事件的消費(fèi)處理以及ListView控件的高度設(shè)定問(wèn)題,。 雖然我看源碼也看了不少,,但是要說(shuō)出來(lái)卻不知到該怎么下手,我是大概知道原因,,但是不知道怎么整理完全,。求高手賜教…
三、問(wèn)題解決方案
1,、手動(dòng)設(shè)置ListView高度 經(jīng)過(guò)測(cè)試發(fā)現(xiàn),,在xml中直接指定ListView的高度,是可以解決這個(gè)問(wèn)題的,,但是ListView中的數(shù)據(jù)是可變的,,實(shí)際高度還需要實(shí)際測(cè)量。于是手動(dòng)代碼設(shè)置ListView高度的方法就誕生了,。
- /**
- * 動(dòng)態(tài)設(shè)置ListView的高度
- * @param listView
- */
- public static void setListViewHeightBasedOnChildren(ListView listView) {
- if(listView == null) return;
- ListAdapter listAdapter = listView.getAdapter();
- if (listAdapter == null) {
- // pre-condition
- return;
- }
- int totalHeight = 0;
- for (int i = 0; i < listAdapter.getCount(); i++) {
- View listItem = listAdapter.getView(i, null, listView);
- listItem.measure(0, 0);
- totalHeight += listItem.getMeasuredHeight();
- }
- ViewGroup.LayoutParams params = listView.getLayoutParams();
- params.height = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
- listView.setLayoutParams(params);
- }
上面這個(gè)方法就是設(shè)定ListView的高度了,,在為L(zhǎng)istView設(shè)置了Adapter之后使用,就可以解決問(wèn)題了,。 但是這個(gè)方法有個(gè)兩個(gè)細(xì)節(jié)需要注意: 一是Adapter中g(shù)etView方法返回的View的必須由LinearLayout組成,,因?yàn)橹挥蠰inearLayout才有measure()方法,,如果使用其他的布局如RelativeLayout,,在調(diào)用listItem.measure(0, 0);時(shí)就會(huì)拋異常,因?yàn)槌齃inearLayout外的其他布局的這個(gè)方法就是直接拋異常的,,沒理由…,。我最初使用的就是這個(gè)方法,,但是因?yàn)樽涌丶捻攲硬季质荝elativeLayout,所以一直報(bào)錯(cuò),,不得不放棄這個(gè)方法,。 二是需要手動(dòng)把ScrollView滾動(dòng)至最頂端,因?yàn)槭褂眠@個(gè)方法的話,,默認(rèn)在ScrollView頂端的項(xiàng)是ListView,,具體原因不了解,求大神解答…可以在Activity中設(shè)置:
- sv = (ScrollView) findViewById(R.id.act_solution_1_sv);
2,、使用單個(gè)ListView取代ScrollView中所有內(nèi)容 這個(gè)方法是我在試了幾個(gè)方法都失敗的情況下自己琢磨出來(lái)的,。 用一張圖來(lái)解釋這個(gè)方法的思想:
就是說(shuō),把整個(gè)需要放在ScrollView中的內(nèi)容,,統(tǒng)統(tǒng)放在ListView中,,原ListView上方的數(shù)據(jù)和下方數(shù)據(jù),都作為現(xiàn)ListView的一個(gè)itemView,,和原ListView中的單條數(shù)據(jù)是平級(jí)的關(guān)系,。 xml布局方面十分簡(jiǎn)單:
- <ListView
- android:id="@+id/act_solution_2_lv"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ListView>
一個(gè)單獨(dú)的ListView就可以了。 原ListView上方數(shù)據(jù)和下方數(shù)據(jù),,都寫進(jìn)兩個(gè)xml布局文件中:
Java代碼方面,,需要自定義一個(gè)Adapter,在Adapter中的getView方法中進(jìn)行position值的判斷,,根據(jù)position值來(lái)決定inflate哪個(gè)布局:
- public View getView(int position, View convertView, ViewGroup parent) {
- //列表第一項(xiàng)
- if(position == 0){
- convertView = inflater.inflate(R.layout.item_solution2_top, null);
- return convertView;
- }
- //列表最后一項(xiàng)
- else if(position == 21){
- convertView = inflater.inflate(R.layout.item_solution2_bottom, null);
- return convertView;
- }
- //普通列表項(xiàng)
- ViewHolder h = null;
- if(convertView == null || convertView.getTag() == null){
- convertView = inflater.inflate(R.layout.item_listview_data, null);
- h = new ViewHolder();
- h.tv = (TextView) convertView.findViewById(R.id.item_listview_data_tv);
- convertView.setTag(h);
- }else{
- h = (ViewHolder) convertView.getTag();
- }
- h.tv.setText("第"+ position + "條數(shù)據(jù)");
- return convertView;
- }
在Activty中,,只需要直接為L(zhǎng)istView設(shè)置自定義的Adapter就行了。
- lv = (ListView) findViewById(R.id.act_solution_2_lv);
- adapter = new AdapterForListView2(this);
- lv.setAdapter(adapter);
3,、使用LinearLayout取代ListView 既然ListView不能適應(yīng)ScrollView,,那就換一個(gè)可以適應(yīng)ScrollView的控件,干嘛非要吊死在ListView這一棵樹上呢,?而LinearLayout是最好的選擇,。但如果我仍想繼續(xù)使用已經(jīng)定義好的Adater呢?我們只需要自定義一個(gè)類繼承自LinearLayout,,為其加上對(duì)BaseAdapter的適配,。
- import android.content.Context;
- import android.util.AttributeSet;
- import android.util.Log;
- import android.view.View;
- import android.widget.BaseAdapter;
- import android.widget.LinearLayout;
- /**
- * 取代ListView的LinearLayout,使之能夠成功嵌套在ScrollView中
- * @author terry_龍
- */
- public class LinearLayoutForListView extends LinearLayout {
- private BaseAdapter adapter;
- private OnClickListener onClickListener = null;
- /**
- * 綁定布局
- */
- public void bindLinearLayout() {
- int count = adapter.getCount();
- this.removeAllViews();
- for (int i = 0; i < count; i++) {
- View v = adapter.getView(i, null, null);
- v.setOnClickListener(this.onClickListener);
- addView(v, i);
- }
- Log.v("countTAG", "" + count);
- }
- public LinearLayoutForListView(Context context) {
- super(context);
上面的代碼拷貝保存為L(zhǎng)inearLayoutForListView.class,,或者直接拷貝Demo中的這個(gè)類在自己的工程里,。我們只需要把原來(lái)xml布局文件中的ListView替換為這個(gè)類就行了:
- <pm.nestificationbetweenscrollviewandabslistview.mywidgets.LinearLayoutForListView
- android:id="@+id/act_solution_3_mylinearlayout"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </pm.nestificationbetweenscrollviewandabslistview.mywidgets.LinearLayoutForListView>
在Activity中也把ListView改成LinearLayoutForListView,就能成功運(yùn)行了,。
- mylinearlayout = (LinearLayoutForListView) findViewById(R.id.act_solution_3_mylinearlayout);
- adapter = new AdapterForListView(this);
- mylinearlayout.setAdapter(adapter);
4,、自定義可適應(yīng)ScrollView的ListView 這個(gè)方法和上面的方法是異曲同工,方法3是自定義了LinearLayout以取代ListView的功能,,但如果我脾氣就是倔,,就是要用ListView怎么辦,?那就只好自定義一個(gè)類繼承自ListView,通過(guò)重寫其onMeasure方法,,達(dá)到對(duì)ScrollView適配的效果,。 下面是繼承了ListView的自定義類:
- import android.content.Context;
- import android.util.AttributeSet;
- import android.widget.ListView;
- public class ListViewForScrollView extends ListView {
- public ListViewForScrollView(Context context) {
- super(context);
- }
- public ListViewForScrollView(Context context, AttributeSet attrs) {
- super(context, attrs);
- }
- public ListViewForScrollView(Context context, AttributeSet attrs,
- int defStyle) {
- super(context, attrs, defStyle);
- }
- @Override
- /**
- * 重寫該方法,達(dá)到使ListView適應(yīng)ScrollView的效果
- */
- protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
- int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2,
- MeasureSpec.AT_MOST);
- super.onMeasure(widthMeasureSpec, expandSpec);
- }
- }
三個(gè)構(gòu)造方法完全不用動(dòng),,只要重寫onMeasure方法,,需要改動(dòng)的地方比起方法3少了不是一點(diǎn)半點(diǎn)… 在xml布局中和Activty中使用的ListView改成這個(gè)自定義ListView就行了。代碼就省了吧… 這個(gè)方法和方法1有一個(gè)同樣的毛病,,就是默認(rèn)顯示的首項(xiàng)是ListView,,需要手動(dòng)把ScrollView滾動(dòng)至最頂端。
- sv = (ScrollView) findViewById(R.id.act_solution_4_sv);
- sv.smoothScrollTo(0, 0);
5,、設(shè)置ScrollView的屬性,,使ListView能夠成功嵌套(無(wú)法達(dá)到預(yù)定效果) 這個(gè)方法是我在寫Demo的時(shí)候找到的,第一反應(yīng)是有這個(gè)方法我還寫這個(gè)Demo干嘛,,只要在布局文件中添加一個(gè)屬性就搞定了,。不過(guò)結(jié)果確實(shí)是ListView的大小把ScrollView的剩余部分填滿了,但卻不能滾動(dòng),,真是個(gè)致命的問(wèn)題… 不廢話了,,布局文件中:
- <ScrollView
- android:id="@+id/act_solution_5_sv"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:layout_below="@+id/act_solution_5_vg_top"
- android:fillViewport="true">
設(shè)置fillViewport的屬性為true即可。簡(jiǎn)單吧,? 但是不能滾動(dòng)這個(gè)致命的問(wèn)題我卻不知道該怎么解決了,,繼續(xù)求大神解答…
四、幾種種方法的優(yōu)缺點(diǎn)比較
上面一共給出了4中親測(cè)可用的方法,,各自有使用條件,,復(fù)雜程度也各不相同。 下面我來(lái)從幾個(gè)方面來(lái)分析幾種方法的優(yōu)勢(shì)和劣勢(shì),。 方法1的優(yōu)點(diǎn)是不用對(duì)使用的控件做任何修改,,只需要使用一個(gè)現(xiàn)成的方法就好了,而最大的限制是ListView的item只能由LinearLayout這一個(gè)布局組成,,對(duì)于一些復(fù)雜的布局就不適用了,。如果你的工程急需解決這個(gè)問(wèn)題,而且滿足方法的使用條件,,即ListView的item布局簡(jiǎn)單,,完全有LinearLayout組成,你就只需要把setListViewHeightBasedOnChildren方法拿過(guò)去就行了,。 方法2的優(yōu)點(diǎn)是布局文件設(shè)計(jì)簡(jiǎn)單,、Activity中的代碼也很少,而缺點(diǎn)卻是自定義Adapter變得十分復(fù)雜,,而且執(zhí)行效率會(huì)變低,,因?yàn)閒indViewById是十分費(fèi)時(shí)的操作,而使用ViewHolder結(jié)構(gòu)可以解決費(fèi)時(shí)的問(wèn)題(有興趣的童鞋可以去搜一艘ViewHolder結(jié)構(gòu)),,然而使用了方法2的話,,會(huì)破壞這種結(jié)構(gòu)。如果你的工程設(shè)計(jì)上偏簡(jiǎn)單,,ListView子項(xiàng)相對(duì)少,、ListView上下方數(shù)據(jù)少、子項(xiàng)間交互少的話,,可以嘗試一下,。 方法3的優(yōu)點(diǎn)是完全解決了ScrollView嵌套ListView的問(wèn)題,同時(shí)代碼較少,,你甚至可以直接使用LinearLayout,,而在Activity中手動(dòng)為L(zhǎng)inearLayout添加子項(xiàng)控件,不過(guò)需要注意的是,,在添加前需要調(diào)用其removeAllViews的方法,,否則可能會(huì)出現(xiàn)預(yù)想不到的事情,那時(shí)你會(huì)想念天國(guó)的ListView的,。缺點(diǎn)不是很明顯,,但還是有兩個(gè):一是使用的不是系統(tǒng)控件,不能在xml布局的Graphical Layout視圖中直接看到效果,;二是不能向ListView那樣可以使用ViewHolder結(jié)構(gòu),,在加載大量子項(xiàng)時(shí)會(huì)費(fèi)很多時(shí)間在findViewById中。如果你的列表數(shù)據(jù)比較少的話,,不妨試試這個(gè)方法,,除了不能使用ViewHolder結(jié)構(gòu),使用方法幾乎和ListView一樣,。 方法4…比方法3更簡(jiǎn)單,,代碼更少,同時(shí)保留了ListView原有的所有方法,,包括notifyDataSetChanged方法,,相比其他方法是最趨近于完美的方法,只是需要在Activity中設(shè)定ScrollView滾動(dòng)至頂端,。如果你還在猶豫不決的話就選這個(gè)方法吧,,我想我以后是只會(huì)用這個(gè)方法了…
|