Android實現透明度可變的標題列效果_Android

我們在做類似於個人首頁類應用的時候，可能會遇到這樣的需求，效果如下

相信大家應該看明白是什麼效果了，就是隨著列表的滑動，上面的標題列的透明度會隨之變化。在IOS中，有很多的軟體有這種效果，下面，我們看一下這種效果是如何?的。
先看一下項目的目錄

我們可以看到，目錄結構很簡單，因為我這個地方是使用的XListview代替的Listview，有很多檔案都是XListview內建的，所以顯得檔案多一些，如果沒使用過XListview，請先百度XListview看看。
這裡面，我們需要重點關注的只有一個檔案，就是MainActivity，我們的關鍵代碼都在這裡，下面，我們看一下代碼實現

/** * 透明度可變的標題列 *  * @author Zhao KaiQiang *  * @Time 2014-6-20 上午11:46:42 */public class MainActivity extends Activity implements OnScrollListener { private XListView listView; // 標題列的布局 private RelativeLayout rl_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.activity_main); rl_title = (RelativeLayout) findViewById(R.id.rl_title); listView = (XListView) findViewById(R.id.list); rl_title.getBackground().setAlpha(0); inflater = LayoutInflater.from(this); headerView = inflater.inflate(R.layout.header_listview, 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;   rl_title.getBackground().setAlpha((int) (f * 255));   // 通知標題列重新整理顯示   rl_title.invalidate();  }  } } else if (firstVisibleItem > 1) {  rl_title.getBackground().setAlpha(255); } else {  rl_title.getBackground().setAlpha(0); } }}

代碼是不是不複雜？我們只需要實現onScroll方法就可以，在這裡面，完成我們對HeaderView的位置的檢測，然後通過HeaderView的高度和顯示的高度來計算比例，設定到TitleBar的背景圖片的透明度即可。

是不是很神奇，希望大家喜歡。