高仿網(wǎng)易新聞頂部滑動(dòng)條效果實(shí)現(xiàn)代碼

這個(gè)是網(wǎng)易新聞的主界面,我們知道底部可以用tabhost實(shí)現(xiàn),這個(gè)很容易,我們在其他軟件中也會(huì)經(jīng)常用到。
至于頂部的滑動(dòng)條,個(gè)人感覺還是比較漂亮的所以今天也模仿了下,網(wǎng)易頂部滑動(dòng)條的效果,由于初次模仿這種效果,可能有些地方還不夠完美,不過基本已經(jīng)實(shí)現(xiàn),希望大家能夠喜歡。
廢話不多說,下面上代碼:
首先是布局layout下的main.xml
<?xmlversion="1.0"encoding="utf-8"?>
<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/root"
android:background="#ffffff"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="@+id/layoutBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/big_button_up"
android:orientation="horizontal">
<RelativeLayout
android:id="@+id/layout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.0">
<TextView
android:id="@+id/tab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="新聞"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/layout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.0">
<TextView
android:id="@+id/tab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="體育"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/layout3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.0">
<TextView
android:id="@+id/tab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="娛樂"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/layout4"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.0">
<TextView
android:id="@+id/tab4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="更多"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/page"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_below="@+id/layoutBar"
android:background="#ffffff"
android:orientation="vertical"
>
</LinearLayout>
</RelativeLayout>
下面是核心類,
packagecn.com.karl.slider;
importandroid.app.Activity;
importandroid.os.Bundle;
importandroid.view.Gravity;
importandroid.view.LayoutInflater;
importandroid.view.View;
importandroid.view.View.OnClickListener;
importandroid.view.ViewGroup.LayoutParams;
importandroid.view.animation.TranslateAnimation;
importandroid.widget.LinearLayout;
importandroid.widget.RelativeLayout;
importandroid.widget.TextView;
publicclassSliderBarActivityextendsActivity{
/**Calledwhentheactivityisfirstcreated.*/
privateRelativeLayoutlayout;
privateRelativeLayoutlayout1;
privateRelativeLayoutlayout2;
privateRelativeLayoutlayout3;
privateRelativeLayoutlayout4;
privateTextViewtab1;
privateTextViewtab2;
privateTextViewtab3;
privateTextViewtab4;
privateTextViewfirst;
privateintcurrent=1;
privateLinearLayoutpage;
privatebooleanisAdd=false;
privateintselect_width;
privateintselect_height;
privateintfirstLeft;
privateintstartLeft;
@Override
publicvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
init();
}
privatevoidinit(){
layout=(RelativeLayout)findViewById(R.id.root);
layout1=(RelativeLayout)findViewById(R.id.layout1);
layout2=(RelativeLayout)findViewById(R.id.layout2);
layout3=(RelativeLayout)findViewById(R.id.layout3);
layout4=(RelativeLayout)findViewById(R.id.layout4);
page=(LinearLayout)this.findViewById(R.id.page);
tab1=(TextView)findViewById(R.id.tab1);
tab1.setOnClickListener(onClickListener);
tab2=(TextView)findViewById(R.id.tab2);
tab2.setOnClickListener(onClickListener);
tab3=(TextView)findViewById(R.id.tab3);
tab3.setOnClickListener(onClickListener);
tab4=(TextView)findViewById(R.id.tab4);
tab4.setOnClickListener(onClickListener);
RelativeLayout.LayoutParamsrl=newRelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
rl.addRule(RelativeLayout.CENTER_IN_PARENT,RelativeLayout.TRUE);
first=newTextView(this);
first.setTag("first");
first.setGravity(Gravity.CENTER);
first.setBackgroundResource(R.drawable.slidebar);
first.setText(tab1.getText());
Viewview1=LayoutInflater.from(getApplicationContext()).inflate(R.layout.page1,null);
page.addView(view1);
switch(current){
case1:
layout1.addView(first,rl);
current=R.id.tab1;
break;
case2:
layout2.addView(first,rl);
current=R.id.tab2;
break;
case3:
layout3.addView(first,rl);
current=R.id.tab3;
break;
case4:
layout4.addView(first,rl);
current=R.id.tab4;
break;
default:
break;
}
}
privatevoidreplace(){
switch(current){
caseR.id.tab1:
changeTop(layout1);
break;
caseR.id.tab2:
changeTop(layout2);
break;
caseR.id.tab3:
changeTop(layout3);
break;
caseR.id.tab4:
changeTop(layout4);
break;
default:
break;
}
}
privatevoidchangeTop(RelativeLayoutrelativeLayout){
TextViewold=(TextView)relativeLayout.findViewWithTag("first");;
select_width=old.getWidth();
select_height=old.getHeight();
RelativeLayout.LayoutParamsrl=newRelativeLayout.LayoutParams(select_width,select_height);
rl.leftMargin=old.getLeft()+((RelativeLayout)old.getParent()).getLeft();
rl.topMargin=old.getTop()+((RelativeLayout)old.getParent()).getTop();
firstLeft=old.getLeft()+((RelativeLayout)old.getParent()).getLeft();
TextViewtv=newTextView(this);
tv.setTag("move");
tv.setBackgroundResource(R.drawable.slidebar);
layout.addView(tv,rl);
relativeLayout.removeView(old);
}
privateOnClickListeneronClickListener=newOnClickListener(){
publicvoidonClick(Viewv){
if(!isAdd){
replace();
isAdd=true;
}
TextViewtop_select=(TextView)layout.findViewWithTag("move");
top_select.setGravity(Gravity.CENTER);
top_select.setText(tab1.getText());
inttabLeft;
intendLeft=0;
booleanrun=false;
switch(v.getId()){
caseR.id.tab1:
if(current!=R.id.tab1){
page.removeAllViews();
tabLeft=((RelativeLayout)tab1.getParent()).getLeft()+tab1.getLeft()+tab1.getWidth()/2;
endLeft=tabLeft-select_width/2;
current=R.id.tab1;
top_select.setText(tab1.getText());
run=true;
Viewview1=LayoutInflater.from(getApplicationContext()).inflate(R.layout.page1,null);
page.addView(view1);
}
break;
caseR.id.tab2:
if(current!=R.id.tab2){
page.removeAllViews();
tabLeft=((RelativeLayout)tab2.getParent()).getLeft()+tab2.getLeft()+tab2.getWidth()/2;
endLeft=tabLeft-select_width/2;
current=R.id.tab2;
top_select.setText(tab2.getText());
run=true;
Viewview2=LayoutInflater.from(getApplicationContext()).inflate(R.layout.page2,null);
page.addView(view2);
}
break;
caseR.id.tab3:
if(current!=R.id.tab3){
page.removeAllViews();
tabLeft=((RelativeLayout)tab3.getParent()).getLeft()+tab3.getLeft()+tab3.getWidth()/2;
endLeft=tabLeft-select_width/2;
current=R.id.tab3;
top_select.setText(tab3.getText());
run=true;
Viewview3=LayoutInflater.from(getApplicationContext()).inflate(R.layout.page3,null);
page.addView(view3);
}
break;
caseR.id.tab4:
if(current!=R.id.tab4){
page.removeAllViews();
tabLeft=((RelativeLayout)tab4.getParent()).getLeft()+tab3.getLeft()+tab4.getWidth()/2;
endLeft=tabLeft-select_width/2;
current=R.id.tab4;
top_select.setText(tab4.getText());
run=true;
Viewview4=LayoutInflater.from(getApplicationContext()).inflate(R.layout.page4,null);
page.addView(view4);
}
break;
default:
break;
}
if(run){
TranslateAnimationanimation=newTranslateAnimation(startLeft,endLeft-firstLeft,0,0);
startLeft=endLeft-firstLeft;
animation.setDuration(100);
animation.setFillAfter(true);
top_select.bringToFront();
top_select.startAnimation(animation);
}
}
};
}
由于時(shí)間比較緊,我沒有做注釋,有時(shí)間再做注釋啊。
看一下效果是不是一樣啊!

效果還請大家自行體驗(yàn)并改進(jìn),由于時(shí)間倉促,代碼并未做注釋,希望大家能夠原諒
相關(guān)文章
使用SignalR推送服務(wù)在Android的實(shí)現(xiàn) SignalA
SignalA是老外寫的用于實(shí)現(xiàn).net端推送消息至安卓端的實(shí)現(xiàn),支持版本為android 2.3或以上2014-07-07
Android網(wǎng)絡(luò)判斷知識小結(jié)
本文通過兩段實(shí)例代碼分別給大家介紹Android中判斷當(dāng)前網(wǎng)絡(luò)是否可用和Android 關(guān)于判斷應(yīng)用是否有網(wǎng)絡(luò)的相關(guān)知識,對android網(wǎng)絡(luò)判斷相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧2015-12-12
Android ActionBar制作時(shí)鐘實(shí)例解析
這篇文章主要為大家詳細(xì)介紹了Android ActionBar制作時(shí)鐘的實(shí)現(xiàn)代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05
Android RetainFragment狀態(tài)保存的方法
本篇文章主要介紹了Android RetainFragment狀態(tài)保存的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-02-02
Flutter以兩種方式實(shí)現(xiàn)App主題切換的代碼
這篇文章主要介紹了Flutter以兩種方式實(shí)現(xiàn)App主題切換的代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-04-04
詳解Retrofit2.0 公共參數(shù)(固定參數(shù))
這篇文章主要介紹了Retrofit2.0 公共參數(shù)(固定參數(shù)),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-04-04
Android Intent啟動(dòng)別的應(yīng)用實(shí)現(xiàn)方法
我們知道Intent的應(yīng)用,可以啟動(dòng)別一個(gè)Activity,那么是否可以啟動(dòng)別外的一個(gè)應(yīng)用程序呢,答案是可以的2013-04-04
android中okhttp實(shí)現(xiàn)斷點(diǎn)上傳示例
本篇文章主要介紹了android中okhttp實(shí)現(xiàn)斷點(diǎn)上傳示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02

