不超100行代碼,實現Android上拉停靠

osag6609 8年前發布 | 9K 次閱讀 安卓開發 Android開發 移動開發

不超過100行代碼的實現,先上圖~

效果圖

簡單的效果圖

MyAdapter

由效果圖分析可知,我們需要一個ListView,所以這里先貼出MyAdapter的代碼,由于主題是實現上拉停靠效果,這里就不對MyAdapter進行優化了。

public class MyAdapter extends BaseAdapter{    

    private List<String> mData;    

    public MyAdapter(List<String> data) {
        mData = data;    
    }    

    @Override    
    public int getCount() {        
        return mData.size();   
    }    

    @Override    
    public Object getItem(int position) 
    {        
        return null;    
    }   

    @Override    
    public long getItemId(int position) 
    {        
        return 0;    
    }   

    @Override    
    public View getView(int position, View convertView, ViewGroup parent) {
        View view=LayoutInflater.from(parent.getContext())
                .inflate(android.R.layout.simple_list_item_1, parent, false);
        ((TextView) view.findViewById(android.R.id.text1)).setText(mData.get(position));                  
        return view;    
    }
}

思路分析

  1. ListView有兩個頭布局,分別為粉色塊和褐色塊
  2. ListView有個監聽器OnScrollListener,在這個監聽器中有onScroll方法可以獲取當前第一個顯示的view的position(即方法的參數firstVisibleItem)
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount)
  3. 滑動邏輯,但firstVisibleItem為1時,此時褐色塊已經滑出屏幕,屏幕只有粉色塊和ListView,此時再往上滑粉色塊不動,實現這種邏輯的方法有兩個,我們可以通過監聽手勢來判斷是否是否移動粉色塊,這種方式稍微復雜。而這里我選擇的是 在activity_main.xml布局中添加一個Visibility為gone的粉色塊 , 每當粉色塊的頭布局要停靠時我們就顯示activity_main.xml布局中的粉色塊 ,事實上,粉色塊的頭布局并沒有停靠,但是我們用activity_main.xml布局的粉色塊就從視覺上起到了這樣的作用!!!
  4. 接下來貼出剩下的代碼,并在注釋中寫出我遇到的坑=。=

head1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"   
android:layout_width="match_parent"    
android:layout_height="match_parent"    
android:orientation="vertical">    
        <LinearLayout
        //坑1: ListView的頭布局(ViewGroup)必須有個View或ViewGroup        
        android:layout_width="match_parent"
        //褐色塊高度100dp 粉色塊高度50dp 只是用于區分而已        
        android:layout_height="100dp"
        //褐色       
        android:background="#c2461d" />
</LinearLayout>

head2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android"    
android:orientation="vertical" android:layout_width="match_parent"    
android:layout_height="match_parent">    
        <LinearLayout   
        android:layout_width="match_parent"        
        android:layout_height="50dp"
        //粉色
        android:background="#FF4081"        
        android:orientation="vertical">    
        </LinearLayout>
</LinearLayout>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
//坑2: 這里用FrameLayout并將粉色塊定義在ListView的后面,
//      這樣顯示粉色塊時會蓋在ListView的粉色塊頭布局上。
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"    
android:layout_width="match_parent"    
android:layout_height="match_parent"    
android:orientation="vertical">    
        <ListView        
        android:id="@+id/lv"        
        android:layout_width="match_parent"        
        android:layout_height="match_parent"/>   

        <LinearLayout        
        android:id="@+id/tab" 
        //這里一開始要設置為gone,在代碼中需要停靠時顯示       
        android:visibility="gone"        
        android:layout_width="match_parent"        
        android:layout_height="50dp"
        //粉色塊 用于實現視覺上是停靠的~        
        android:background="#FF4081"        
        android:orientation="vertical"/>
</FrameLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity 
                        implements AbsListView.OnScrollListener {    
        private View tab;    
        @Override    
        protected void onCreate(Bundle savedInstanceState) {        
                super.onCreate(savedInstanceState);        
                setContentView(R.layout.activity_main);
                //開始創建假數據   
                List<String> list = new ArrayList<>();        
                for (int i = 0; i < 200; i++) {            
                        list.add(i + "");
                    }
                //假數據創建完畢
//-------------------華麗分隔線----------------------------        
                ListView listView = (ListView) findViewById(R.id.lv);        
                listView.setAdapter(new MyAdapter(list));        
                LayoutInflater inflater = LayoutInflater.from(this);        
                View view1 = inflater.inflate(R.layout.head1, null);        
                View view2 = inflater.inflate(R.layout.head2, null);        
                tab = findViewById(R.id.tab);        
                listView.addHeaderView(view1);        
                listView.addHeaderView(view2);        
                listView.setOnScrollListener(this);    
        }    


        @Override    
        public void onScrollStateChanged(AbsListView view, int scrollState) {
        //沒用的方法 pass
        }  

        @Override    
        public void onScroll(AbsListView view, int firstVisibleItem, 
                                int visibleItemCount, int totalItemCount) {        
                if (firstVisibleItem == 1) 
                {       
                        //褐色塊移除屏幕時,粉色塊進行'停靠'     
                        tab.setVisibility(View.VISIBLE);        
                }        
                if (firstVisibleItem == 0) {        
                        //褐色塊移入屏幕時,粉色塊取消'停靠'
                        //此時必須得gone掉,不然看起來還是停靠在上面
                        tab.setVisibility(View.GONE);        
                }    
        }
}

 

 

來自:http://www.jianshu.com/p/c37b16a6157d

 

 本文由用戶 osag6609 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!