Android實(shí)現(xiàn)透明度可變的標(biāo)題欄效果
我們?cè)谧鲱愃朴趥€(gè)人主頁類應(yīng)用的時(shí)候,可能會(huì)遇到這樣的需求,效果如下


相信大家應(yīng)該看明白是什么效果了,就是隨著列表的滑動(dòng),上面的標(biāo)題欄的透明度會(huì)隨之變化。在IOS中,有很多的軟件有這種效果,下面,我們看一下這種效果是如何實(shí)現(xiàn)的。
先看一下項(xiàng)目的目錄

我們可以看到,目錄結(jié)構(gòu)很簡(jiǎn)單,因?yàn)槲疫@個(gè)地方是使用的XListview代替的Listview,有很多文件都是XListview自帶的,所以顯得文件多一些,如果沒使用過XListview,請(qǐng)先百度XListview看看。
這里面,我們需要重點(diǎn)關(guān)注的只有一個(gè)文件,就是MainActivity,我們的關(guān)鍵代碼都在這里,下面,我們看一下代碼實(shí)現(xiàn)
/**
* 透明度可變的標(biāo)題欄
*
* @author Zhao KaiQiang
*
* @Time 2014-6-20 上午11:46:42
*/
public class MainActivity extends Activity implements OnScrollListener {
private XListView listView;
// 標(biāo)題欄的布局
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());
// 設(shè)置滾動(dòng)監(jiān)聽
listView.setOnScrollListener(this);
// 設(shè)置可以刷新與加載更多
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 {
// 默認(rèn)顯示10個(gè)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) {
}
// 最重要的方法,標(biāo)題欄的透明度變化在這個(gè)方法實(shí)現(xiàn)
@Override
public void onScroll(AbsListView listView, int firstVisibleItem,
int visibleItemCount, int totalItemCount) {
// 判斷當(dāng)前最上面顯示的是不是頭布局,因?yàn)閄listview有刷新控件,所以頭布局的位置是1,即第二個(gè)
if (firstVisibleItem == 1) {
// 獲取頭布局
View view = listView.getChildAt(0);
if (view != null) {
// 獲取頭布局現(xiàn)在的最上部的位置的相反數(shù)
int top = -view.getTop();
// 獲取頭布局的高度
headerHeight = view.getHeight();
// 滿足這個(gè)條件的時(shí)候,是頭布局在XListview的最上面第一個(gè)控件的時(shí)候,只有這個(gè)時(shí)候,我們才調(diào)整透明度
if (top <= headerHeight && top >= 0) {
// 獲取當(dāng)前位置占頭布局高度的百分比
float f = (float) top / (float) headerHeight;
rl_title.getBackground().setAlpha((int) (f * 255));
// 通知標(biāo)題欄刷新顯示
rl_title.invalidate();
}
}
} else if (firstVisibleItem > 1) {
rl_title.getBackground().setAlpha(255);
} else {
rl_title.getBackground().setAlpha(0);
}
}
}
代碼是不是不復(fù)雜?我們只需要實(shí)現(xiàn)onScroll方法就可以,在這里面,完成我們對(duì)HeaderView的位置的檢測(cè),然后通過HeaderView的高度和顯示的高度來計(jì)算比例,設(shè)置到TitleBar的背景圖片的透明度即可。
是不是很神奇,希望大家喜歡。
相關(guān)文章
Android編程實(shí)現(xiàn)通話錄音功能的方法
這篇文章主要介紹了Android編程實(shí)現(xiàn)通話錄音功能的方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了Android廣播接收機(jī)制實(shí)現(xiàn)錄音功能的操作技巧,需要的朋友可以參考下2017-06-06
Android三種方式實(shí)現(xiàn)ProgressBar自定義圓形進(jìn)度條
這篇文章主要介紹了Android三種方式實(shí)現(xiàn)ProgressBar自定義圓形進(jìn)度條的相關(guān)資料,需要的朋友可以參考下2016-03-03
Android使用ViewPager實(shí)現(xiàn)啟動(dòng)引導(dǎo)頁
這篇文章主要為大家詳細(xì)介紹了Android使用ViewPager實(shí)現(xiàn)第一次啟動(dòng)引導(dǎo)頁,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-07-07
Flutter實(shí)現(xiàn)彈窗攔截器的示例代碼
彈窗的排隊(duì)執(zhí)行在App中是一個(gè)很常見的應(yīng)用場(chǎng)景,這篇文章為大家介紹了兩個(gè)Flutter實(shí)現(xiàn)彈窗攔截器的示例代碼,感興趣的小伙伴可以學(xué)習(xí)一下2023-09-09
Kotlin面向?qū)ο笾R(shí)點(diǎn)講解
面向?qū)ο缶幊掏ㄟ^對(duì)事物的抽象,大大的簡(jiǎn)化了程序的開發(fā)難度。我們常用的編程語言:Java、C++、Python都屬于面向?qū)ο缶幊?。Kotlin與java類似,也是一種面向?qū)ο缶幊陶Z言。本文從面向?qū)ο笕齻€(gè)基本特征:封裝、繼承、多態(tài),來闡述一下Kotlin中的面向?qū)ο缶幊?/div> 2022-12-12
Android 中兩個(gè)Activity 之間的傳值問題
這篇文章主要介紹了Android 中兩個(gè)Activity 之間的傳值問題的相關(guān)資料,需要的朋友可以參考下2017-08-08最新評(píng)論

