四種方案解決ScrollView巢狀ListView問題
以下文章轉自@安卓泡麵
在工作中,曾多次碰到ScrollView巢狀ListView的問題,網上的解決方法有很多種,但是雜而不全。我試過很多種方法,它們各有利弊。
在這裡我將會從使用ScrollView巢狀ListView結構的原因、這個結構碰到的問題、幾種解決方案和優缺點比較,這4個方面來為大家闡述、分析、總結。
實際上不光是ListView,其他繼承自AbsListView的類也適用,包括ExpandableListView、GridView等等,為了方便說明,以下均用ListView來代表。
一、 為什麼要使用ScrollView巢狀ListView的奇怪的結構
ScrollView和ListView都是滾動結構,按理說,這兩個控制元件在UI上的功能是一樣的,但是看看下面這個設計:
這是天貓商城的確認訂單的頁面,ScrollView中嵌套了ExpandableListView,ExpandableListView上面有固定的一些控制元件,下面也有固定的一些控制元件,整體又要能夠滾動。 列表資料要嵌在固定資料中間,並且作為整體一起滾動,有了這樣的設計需求,於是就有了ScrollView巢狀ListView的奇怪結構。
二、 ScrollView、ListView巢狀結構碰到的問題
不多說,直接看失敗例子:
- <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上方資料\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下方資料\n" />
- </LinearLayout>
-
</ScrollView>
ScrollView中只能放一個控制元件,一般都放LinearLayout,orientation屬性值為vertical。在LinearLayout中放需要呈現的內容。ListView也在其中,ListView的高度設為適應自身內容(wrap_content)。粗略一看,應該沒有什麼問題。但是看下面的實際效果圖:
圖中黑框的部分就是ListView,裡面放了20條資料,但是卻只顯示了1條。
控制元件的屬性設定上沒有問題,但是為什麼沒有按照我的想法走呢?
看看下面這個圖:
是否有點明白了呢?原因就是scroll事件的消費處理以及ListView控制元件的高度設定問題。
雖然我看原始碼也看了不少,但是要說出來卻不知到該怎麼下手,我是大概知道原因,但是不知道怎麼整理完全。求高手賜教…
三、問題解決方案
1、手動設定ListView高度
經過測試發現,在xml中直接指定ListView的高度,是可以解決這個問題的,但是ListView中的資料是可變的,實際高度還需要實際測量。於是手動程式碼設定ListView高度的方法就誕生了。
- /**
- * 動態設定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);
-
}
上面這個方法就是設定ListView的高度了,在為ListView設定了Adapter之後使用,就可以解決問題了。
但是這個方法有個兩個細節需要注意:
一是Adapter中getView方法返回的View的必須由LinearLayout組成,因為只有LinearLayout才有measure()方法,如果使用其他的佈局如RelativeLayout,在呼叫listItem.measure(0, 0);時就會拋異常,因為除LinearLayout外的其他佈局的這個方法就是直接拋異常的,沒理由…。我最初使用的就是這個方法,但是因為子控制元件的頂層佈局是RelativeLayout,所以一直報錯,不得不放棄這個方法。
二是需要手動把ScrollView滾動至最頂端,因為使用這個方法的話,預設在ScrollView頂端的項是ListView,具體原因不瞭解,求大神解答…可以在Activity中設定:
-
sv = (ScrollView) findViewById(R.id.act_solution_1_sv);
2、使用單個ListView取代ScrollView中所有內容
這個方法是我在試了幾個方法都失敗的情況下自己琢磨出來的。
用一張圖來解釋這個方法的思想:
就是說,把整個需要放在ScrollView中的內容,統統放在ListView中,原ListView上方的資料和下方資料,都作為現ListView的一個itemView,和原ListView中的單條資料是平級的關係。
xml佈局方面十分簡單:
- <ListView
- android:id="@+id/act_solution_2_lv"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ListView>
一個單獨的ListView就可以了。
原ListView上方資料和下方資料,都寫進兩個xml佈局檔案中:
Java程式碼方面,需要自定義一個Adapter,在Adapter中的getView方法中進行position值的判斷,根據position值來決定inflate哪個佈局:
- public View getView(int position, View convertView, ViewGroup parent) {
- //列表第一項
- if(position == 0){
- convertView = inflater.inflate(R.layout.item_solution2_top, null);
- return convertView;
- }
- //列表最後一項
- else if(position == 21){
- convertView = inflater.inflate(R.layout.item_solution2_bottom, null);
- return convertView;
- }
- //普通列表項
- 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 + "條資料");
- return convertView;
- }
在Activty中,只需要直接為ListView設定自定義的Adapter就行了。
- lv = (ListView) findViewById(R.id.act_solution_2_lv);
- adapter = new AdapterForListView2(this);
- lv.setAdapter(adapter);
3、使用LinearLayout取代ListView
既然ListView不能適應ScrollView,那就換一個可以適應ScrollView的控制元件,幹嘛非要吊死在ListView這一棵樹上呢?而LinearLayout是最好的選擇。但如果我仍想繼續使用已經定義好的Adater呢?我們只需要自定義一個類繼承自LinearLayout,為其加上對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);
上面的程式碼拷貝儲存為LinearLayoutForListView.class,或者直接拷貝Demo中的這個類在自己的工程裡。我們只需要把原來xml佈局檔案中的ListView替換為這個類就行了:
- <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,就能成功運行了。
- mylinearlayout = (LinearLayoutForListView) findViewById(R.id.act_solution_3_mylinearlayout);
- adapter = new AdapterForListView(this);
- mylinearlayout.setAdapter(adapter);
4、自定義可適應ScrollView的ListView
這個方法和上面的方法是異曲同工,方法3是自定義了LinearLayout以取代ListView的功能,但如果我脾氣就是倔,就是要用ListView怎麼辦?那就只好自定義一個類繼承自ListView,通過重寫其onMeasure方法,達到對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
- /**
- * 重寫該方法,達到使ListView適應ScrollView的效果
- */
- protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
- int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2,
- MeasureSpec.AT_MOST);
- super.onMeasure(widthMeasureSpec, expandSpec);
- }
- }
三個構造方法完全不用動,只要重寫onMeasure方法,需要改動的地方比起方法3少了不是一點半點…
在xml佈局中和Activty中使用的ListView改成這個自定義ListView就行了。程式碼就省了吧…
這個方法和方法1有一個同樣的毛病,就是預設顯示的首項是ListView,需要手動把ScrollView滾動至最頂端。
- sv = (ScrollView) findViewById(R.id.act_solution_4_sv);
- sv.smoothScrollTo(0, 0);
5、設定ScrollView的屬性,使ListView能夠成功巢狀(無法達到預定效果)
這個方法是我在寫Demo的時候找到的,第一反應是有這個方法我還寫這個Demo幹嘛,只要在佈局檔案中新增一個屬性就搞定了。不過結果確實是ListView的大小把ScrollView的剩餘部分填滿了,但卻不能滾動,真是個致命的問題…
不廢話了,佈局檔案中:
- <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">
設定fillViewport的屬性為true即可。簡單吧?
但是不能滾動這個致命的問題我卻不知道該怎麼解決了,繼續求大神解答…
四、幾種種方法的優缺點比較
上面一共給出了4中親測可用的方法,各自有使用條件,複雜程度也各不相同。
下面我來從幾個方面來分析幾種方法的優勢和劣勢。
方法1的優點是不用對使用的控制元件做任何修改,只需要使用一個現成的方法就好了,而最大的限制是ListView的item只能由LinearLayout這一個佈局組成,對於一些複雜的佈局就不適用了。如果你的工程急需解決這個問題,而且滿足方法的使用條件,即ListView的item佈局簡單,完全有LinearLayout組成,你就只需要把setListViewHeightBasedOnChildren方法拿過去就行了。
方法2的優點是佈局檔案設計簡單、Activity中的程式碼也很少,而缺點卻是自定義Adapter變得十分複雜,而且執行效率會變低,因為findViewById是十分費時的操作,而使用ViewHolder結構可以解決費時的問題(有興趣的童鞋可以去搜一艘ViewHolder結構),然而使用了方法2的話,會破壞這種結構。如果你的工程設計上偏簡單,ListView子項相對少、ListView上下方資料少、子項間互動少的話,可以嘗試一下。
方法3的優點是完全解決了ScrollView巢狀ListView的問題,同時代碼較少,你甚至可以直接使用LinearLayout,而在Activity中手動為LinearLayout新增子項控制元件,不過需要注意的是,在新增前需要呼叫其removeAllViews的方法,否則可能會出現預想不到的事情,那時你會想念天國的ListView的。缺點不是很明顯,但還是有兩個:一是使用的不是系統控制元件,不能在xml佈局的Graphical Layout檢視中直接看到效果;二是不能向ListView那樣可以使用ViewHolder結構,在載入大量子項時會費很多時間在findViewById中。如果你的列表資料比較少的話,不妨試試這個方法,除了不能使用ViewHolder結構,使用方法幾乎和ListView一樣。
方法4…比方法3更簡單,程式碼更少,同時保留了ListView原有的所有方法,包括notifyDataSetChanged方法,相比其他方法是最趨近於完美的方法,只是需要在Activity中設定ScrollView滾動至頂端。如果你還在猶豫不決的話就選這個方法吧,我想我以後是隻會用這個方法了…
相關推薦
四種方案解決ScrollView巢狀ListView問題
以下文章轉自@安卓泡麵 在工作中,曾多次碰到ScrollView巢狀ListView的問題,網上的解決方法有很多種,但是雜而不全。我試過很多種方法,它們各有利弊。 在這裡我將會從使用ScrollView巢狀ListView結構的原因、這個結構碰到的問題、幾種解決方案和
四種方案解決ScrollView嵌套ListView問題
復雜 添加 col 表數據 中間 divider etc 高手 abs 四種方案解決ScrollView嵌套ListView問題 以下文章轉自@安卓泡面 在工作中,曾多次碰到ScrollView嵌套ListView的問題,網上的解決方法有很多種,但是雜而不全。我試過很多
解決ScrollView巢狀ListView或GridView置頂顯示問題
今天無意間發現一個小小的問題,當我們使用ScrollView裡面巢狀ListView或GridView的時候頁面顯示會停留在ListView的item當前,而不是置頂顯示整個頁面,不要慌,解決辦法來了。 1.在java程式碼中ListView或GridView初始化後面新增以下程式碼: sc
解決ScrollView巢狀ListView顯示不完全和滑動衝突的問題
</pre>在開發中我們往往會遇到這樣奇葩的需求,讓一個ScrollView巢狀ListView,那麼我們就會遇到這樣一個問題,就是listView 顯示不完全和滾動衝突的問題。下面就來解決一下這個問題</p><p></p>&
Android 事件分發實踐(一),解決ScrollView巢狀ListView滑動的問題
需要在ScrollView裡面巢狀一個ListView,讓ScrollView和它裡面的ListView都能滑動(ListView寬度沒有佔滿ScrollView),先貼上佈局程式碼: <com.example.xujiang.viewlearn.tou
android進階-----解決scrollview巢狀listview的問題
在android開發中,經常會碰到在ScrollView中巢狀ListView的介面的開發,在ScrollView中巢狀ListView會帶來幾個問題,經過反覆的實踐,總結出完美解決的辦法如下: 1.繼承ListView 複寫其中的方法 @Override public void onMeasu
解決ScrollView巢狀ListView不滑動,只顯示一條,ListView滑到頂部問題
問題:在ScrollView中巢狀ListView,出現的效果是ListView只顯示一行,無論高度設定的是match_parent還是wrap_content。五種任你選。 1、設定ListView的高度為固定值 這樣ListView可以滑動,整體Sc
利用事件分發機制解決ScrollView巢狀ListView滑動衝突
記得以前面試的時候,面試官問了ScrollView巢狀ListView使用的問題。那麼ScrollView巢狀ListView使用會出現什麼效果呢? 如佈局檔案如下: <?xml version="1.0" encoding="utf-8"?>
ScrollView巢狀ListView設定預設位置為最頂部的解決方案
描述: Scrollview裡面嵌套了一個listview ,這是開發中最尋常的一種佈局,遇到的問題是:在這個Scrollview頁面預設的起始位置不是最頂部,而是listview的底部。 原因: 在Activity計算視窗的高度時,是在listview沒有填充資料時候就完成的,由於ScrollV
ScrollView巢狀ListView或GridView等,使得其高度自適應解決方案
這類的文章有很多,寫此文的目的是為了備忘吧。ScrollView裡面巢狀ListView或GridView等,兩個View都有滾動的效果,在巢狀使用時起了衝突,一般不建議兩者套用。解決的方案有很多但是
Android ScrollView巢狀ListView正常分頁載入顯示解決方案
一般其他元件與ListView嵌合在一起滾動的方案有如下幾種: 1.整個頁面變為一個ListView,其他元件(如頂部)成為ListView的一個Item或者Header; 2.使用ScrollView巢狀ListView; 開發場景 某一app在1.0版本Activi
ScrollView巢狀ListView,顯示不全和位置不是頂部的解決辦法
(1)首先寫一個listview的頁面,用ScrollView進行巢狀,注意ScrollView裡面只能有一個佈局屬性,多個可以用Linearout進行包含 <?xml version="1.0" encoding="utf-8"?> <RelativeL
ScrollView 巢狀listview自動滑動到底部的解決辦法
ScrollView 巢狀listview時,當listview自動載入時,會自動滑動到scrollview到底部, 解決方法:在listView的父層加上 android:descendantFocusability="blocksDescendants";即可,每次載
《Android那些事》——ScrollView巢狀ListView只顯示一行的問題的解決方法
在實際開發過程中,經常會碰到ScrollView中巢狀ListView的情景 可是如果直接使用ScrollView巢狀ListView的話,我們會發現,ListView只能顯示一行 對於這個問題網上有很多解決方案, 1.手動設定ListView的高度,但ListView中的資料
解決ScrollView巢狀viewPager中巢狀listView滑動事件衝突問題(水平方向)
我們在開發中經常會碰到view滑動衝突的情況。滑動衝突的解決辦法就兩種:1.外部攔截法:是指在點選事件先經過父容器的攔截處理,如果父容器需要處理此事件就進行攔截,如果不需要此事件就不攔截,這樣就可以解決滑動衝突的問題,外部攔截法需要重寫父容器的onInterceptTouch
ScrollView巢狀RecyclerView、ScrollView巢狀Listview、ScrollView巢狀各種佈局,預設不在頂部和回到頂部的解決方法;
如果:ScrollView.scrollTo(0,0);ScrollView.fullScroll(View.FOCUS_UP) ;ScrollView.smoothScrollTo(0, 0);這三種方法都解決不了你的問題,那麼請往下看;佈局有點複雜:最外層是SwipeRe
Android4.x中ScrollView巢狀ListView,ListView不能完全顯示總結、解決辦法
當ScrollView巢狀ListView時,使用listview設定setAdpter後,需要重新設定listview控制元件的寬高。在網上嘗試了一些方法,重新設定高度之後,仍然不能完全顯示,經過除錯,使用下面的方法,可以使ListView完全顯示。在setAdapter
ScrollView巢狀ListView,GridView,ViewPager,以及這些控制元件自動滾動到底部問題的解決
Google是不推薦在ScrollView 中放入一個可滾動的選單的,比如放置一個ListView、GridView、ViewPager這些控制元件的,儘量不要讓兩者巢狀,但有時候還是有這個需求,先不管它合不合理。如果直接在ScrollView中巢狀只會出現一行,然後在其中滾動,這樣不是很好,下面是我的整理
ScrollView巢狀ListView時Bug解決以及ExpandableListView設定全部展開
1.ExpandableListView設定預設展 mExpandListview.setAdapter(adapter); //設定ExpandableListView全部展開 for (int i = 0;i < adapter.getGroupCount();
ScrollView、RecyclerView、ScrollView巢狀ListView效能優化方案
/** * NestFullListView 的ViewHolder ,使用者無需關心 * Created by zhangxutong . * Date: 16/03/11 */ public class NestFullViewHolder { private SparseArray<