仿百度手機助手標題欄透明度隨ListView或ScrollView滾動改變的實現方法


有時做項目遇到ListView或ScrollView上方加圖片和標題欄布局,在滾動時要求改變標題欄的透明度,即上滑標題欄出現,下拉標題欄變透明,類似百度手機助手6.0裝機必備界面效果

要實現這種標題欄透明度隨滾動漸變的動畫很簡單,我們只需要實現onScroll方法就可以,完成對HeaderView的位置檢測,然后通過HeaderView的高度和顯示的高度來計算比例,設置TitleBar的背景圖片的透明度即可,此種實現方法與FadingActionBar是不同的。詳細實現源碼如下:

public class MainActivity extends Activity implements OnScrollListener {

    private XListView listView;
    // 標題欄的布局
    private RelativeLayout title;
    // ListView的頭布局
    private View headerView;
    // 頭布局的高度
    private int headerHeight;
    private LayoutInflater inflater;
    private Handler handler = new Handler();
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        title = (RelativeLayout) findViewById(R.id.title);
        listView = (XListView) findViewById(R.id.list);
 
        title.getBackground().setAlpha(0);
        inflater = LayoutInflater.from(this);
        headerView = inflater.inflate(R.layout.header, null);
        // 添加頭布局
        listView.addHeaderView(headerView);
        listView.setAdapter(new MyAdapter());
        // 設置滾動監聽
        listView.setOnScrollListener(this);
        // 設置可以刷新與加載更多
        listView.setPullLoadEnable(true);
        listView.setPullRefreshEnable(true);
        listView.setXListViewListener(new IXListViewListener() {
 
            @Override
            public void onRefresh() {
                // 單純的模擬刷新過程
                handler.postDelayed(new Runnable() {
 
                    @Override
                    public void run() {
                        listView.stopRefresh();
                    }
                }, 500);
            }
 
            @Override
            public void onLoadMore() {
                // 單純的模擬加載過程
                handler.postDelayed(new Runnable() {
 
                    @Override
                    public void run() {
                        listView.stopLoadMore();
                    }
                }, 500);
            }
        });
 
    }
 
    // 自定義適配器
    private class MyAdapter extends BaseAdapter {
 
        // 默認顯示10個item
        @Override
        public int getCount() {
            return 10;
        }
        @Override
        public Object getItem(int position) {
            return position;
        }
 
        @Override
        public long getItemId(int position) {
            return position;
        }
        @Override
       public View getView(int position, View convertView, ViewGroup parent) {
            if (convertView == null) {
                convertView = inflater.inflate(R.layout.item_list, null);
            }
 
            return convertView;
        }
 
    }
    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
 
    }
 
    // 最重要的方法,標題欄的透明度變化在這個方法實現
    @Override
    public void onScroll(AbsListView listView, int firstVisibleItem,
            int visibleItemCount, int totalItemCount) {
        // 判斷當前最上面顯示的是不是頭布局,因為Xlistview有刷新控件,所以頭布局的位置是1,即第二個
        if (firstVisibleItem == 1) {
            // 獲取頭布局
            View view = listView.getChildAt(0);
            if (view != null) {
                // 獲取頭布局現在的最上部的位置的相反數
                int top = -view.getTop();
                // 獲取頭布局的高度
                headerHeight = view.getHeight();
                // 滿足這個條件的時候,是頭布局在XListview的最上面第一個控件的時候,只有這個時候,我們才調整透明度
                if (top <= headerHeight && top >= 0) {
                    // 獲取當前位置占頭布局高度的百分比
                    float f = (float) top / (float) headerHeight;
                    title.getBackground().setAlpha((int) (f * 255));
                    // 通知標題欄刷新顯示
                    title.invalidate();
                }
            }
        } else if (firstVisibleItem > 1) {
            title.getBackground().setAlpha(255);
        } else {
            title.getBackground().setAlpha(0);
        }
    }
 
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM