天天看点

Android UI开发第六篇——仿QQ的滑动Tab

<a target="_blank" href="http://blog.51cto.com/attachment/201203/142342131.png"></a>

使用了ActivityGroup。

public class MainActivity extends ActivityGroup { 

     private RelativeLayout layout; 

     private RelativeLayout layout1; 

     private RelativeLayout layout2; 

     private RelativeLayout layout3; 

     private RelativeLayout bodylayout; 

     private ImageView tab1; 

     private ImageView tab2; 

     private ImageView tab3; 

     private ImageView first; 

     private int current = 1; //默认选中第一个,可以动态的改变此参数值 

     public void onCreate(Bundle savedInstanceState) { 

         super.onCreate(savedInstanceState); 

         setContentView(R.layout.main); 

         initUI(); 

     } 

     private void initUI(){ 

         layout = (RelativeLayout) findViewById(R.id.root); 

         layout1 = (RelativeLayout) findViewById(R.id.layout1); 

         layout2 = (RelativeLayout) findViewById(R.id.layout2); 

         layout3 = (RelativeLayout) findViewById(R.id.layout3); 

         bodylayout = (RelativeLayout) findViewById(R.id.bodylayout); 

         tab1 = (ImageView) findViewById(R.id.tab1); 

         tab1.setOnClickListener(onClickListener); 

         tab2 = (ImageView) findViewById(R.id.tab2); 

         tab2.setOnClickListener(onClickListener); 

         tab3 = (ImageView) findViewById(R.id.tab3); 

         tab3.setOnClickListener(onClickListener); 

         RelativeLayout.LayoutParams rl = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 

         rl.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE); 

         first = new ImageView(this); 

         first.setTag("first"); 

         first.setImageResource(R.drawable.topbar_select); 

         // 默认选中项 

         switch (current) { 

         case 1: 

             layout1.addView(first, rl); 

             current = R.id.tab1; 

             break; 

         case 2: 

             layout2.addView(first, rl); 

             current = R.id.tab2; 

         case 3: 

             layout3.addView(first, rl); 

             current = R.id.tab3; 

         default: 

         } 

         View view = getLocalActivityManager().startActivity("index", 

                 new Intent(MainActivity.this, Tab1.class)) 

                 .getDecorView(); 

         bodylayout.addView(view); 

     private boolean isAdd = false; // 是否添加过 top_select 

     private int select_width; // top_select_width 

     private int select_height; // top_select_height 

     private int firstLeft; // 第一次添加后的左边距***** 

     private int startLeft; // 起始左边距 

     // 添加一个view,移除一个view 

     private void replace() { 

         case R.id.tab1: 

             changeTop(layout1); 

         case R.id.tab2: 

             changeTop(layout2); 

         case R.id.tab3: 

             changeTop(layout3); 

     private void changeTop(RelativeLayout relativeLayout){ 

         ImageView old = (ImageView) relativeLayout.findViewWithTag("first");; 

         select_width = old.getWidth(); 

         select_height = old.getHeight(); 

         RelativeLayout.LayoutParams rl = new RelativeLayout.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(); 

         ImageView iv = new ImageView(this); 

         iv.setTag("move"); 

         iv.setImageResource(R.drawable.topbar_select); 

         layout.addView(iv , rl); 

         relativeLayout.removeView(old); 

     private OnClickListener onClickListener = new OnClickListener(){ 

         public void onClick(View v) { 

             if(!isAdd){ 

                 replace(); // 初次使用移除old 添加新的top_select为RelativeLayout所使用 

                 isAdd = true; 

             } 

             ImageView top_select = (ImageView) layout.findViewWithTag("move"); 

             int tabLeft; 

             int endLeft = 0; 

             boolean run = false; 

             switch (v.getId()) { 

             case R.id.tab1: 

                 if (current != R.id.tab1) { 

                     // 中心位置 

                     tabLeft = ((RelativeLayout) tab1.getParent()).getLeft() + tab1.getLeft() + tab1.getWidth() / 2; 

                     // 最终位置 

                     endLeft = tabLeft - select_width / 2; 

                     current = R.id.tab1; 

                     run = true; 

                     bodylayout.removeAllViews(); 

                     View view = getLocalActivityManager().startActivity("index", 

                             new Intent(MainActivity.this, Tab1.class)) 

                             .getDecorView(); 

                     bodylayout.addView(view); 

                 } 

                 break; 

             case R.id.tab2: 

                 if (current != R.id.tab2) { 

                     tabLeft = ((RelativeLayout) tab2.getParent()).getLeft() + tab2.getLeft() + tab2.getWidth() / 2; 

                     current = R.id.tab2; 

                             new Intent(MainActivity.this, Tab2.class)) 

             case R.id.tab3: 

                 if (current != R.id.tab3) { 

                     tabLeft = ((RelativeLayout) tab3.getParent()).getLeft() + tab3.getLeft() + tab3.getWidth() / 2; 

                     endLeft = tabLeft - select_width/2; 

                     current = R.id.tab3; 

                             new Intent(MainActivity.this, Tab3.class)) 

             default: 

             if(run){ 

                 TranslateAnimation animation = new TranslateAnimation(startLeft, endLeft - firstLeft, 0, 0); 

                 startLeft = endLeft - firstLeft; // 重新设定起始位置 

                 animation.setDuration(400); 

                 animation.setFillAfter(true); 

                 top_select.bringToFront(); 

                 top_select.startAnimation(animation); 

     }; 

&lt;?xml version="1.0" encoding="utf-8"?&gt; 

&lt;RelativeLayout  

     xmlns:android="http://schemas.android.com/apk/res/android" 

     android:id="@+id/root" 

     android:layout_width="fill_parent"  

     android:layout_height="fill_parent"  

     &gt; 

     &lt;LinearLayout  

         android:orientation="vertical" 

         android:layout_width="fill_parent"  

         android:layout_height="fill_parent"  

         android:background="@drawable/default_bg" 

         &gt; 

         &lt;LinearLayout  

             android:orientation="horizontal" 

             android:layout_width="fill_parent"  

             android:layout_height="fill_parent"  

             android:layout_weight="6.0" 

             &gt; 

             &lt;RelativeLayout  

                 android:id="@+id/layout1" 

                 android:layout_width="fill_parent"  

                 android:layout_height="wrap_content"  

                 android:layout_weight="1.0" 

                 android:layout_gravity="center_vertical" 

                 &gt; 

                 &lt;ImageView 

                     android:id="@+id/tab1" 

                     android:layout_width="wrap_content"  

                     android:layout_height="wrap_content"  

                     android:src="@drawable/tab1" 

                     android:layout_centerInParent="true" 

                     /&gt; 

             &lt;/RelativeLayout&gt; 

                 android:id="@+id/layout2" 

                     android:id="@+id/tab2" 

                     android:src="@drawable/tab2" 

                 android:id="@+id/layout3" 

                     android:id="@+id/tab3" 

                     android:src="@drawable/tab3" 

         &lt;/LinearLayout&gt; 

         &lt;RelativeLayout  

             android:layout_weight="1.0" 

             android:background="#ffffff" 

             android:gravity="center" 

             android:id="@+id/bodylayout" 

         &lt;/RelativeLayout&gt; 

     &lt;/LinearLayout&gt; 

&lt;/RelativeLayout&gt; 

本文转自xyz_lmn51CTO博客,原文链接:http://blog.51cto.com/xyzlmn/817371,如需转载请自行联系原作者

继续阅读