博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
巧妙运用ViewStub写出类似Tab选项卡(想怎么写tab就怎么写,横着写竖着写随你)(转)...
阅读量:5264 次
发布时间:2019-06-14

本文共 4812 字,大约阅读时间需要 16 分钟。

不提倡这么写法,可以结合Tab来写,然后每个Activity对应一个Tab选项,这样代码冗余性比较小(博客会在稍后更新到),下面仅做参考

网上找了半天也没找到如何运用ViewStub写出一个选项卡,而且关于ViewStub也都是基本介绍(基础知识请参照网上,一大坨的转载).之前看到一个老兄写的模拟iphone选项卡的界面,但是那个太麻烦了,本人天生懒惰,没办法只好自己动手写一个了。

先睹为快,看下面截图(有点类QQ通讯录),最底下是一个类似于Tab的选项卡(有点iphone选项卡感觉吧)。

 

为了简单起见,这里就不用这个截图做例子了,下面就用写一个最简单的Demo。

第一步:还是先建立底部的选项卡(其实就是一个TableLayout布局),代码如下(main.xml):

[html]

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout
  3. xmlns:android="http://schemas.android.com/apk/res/android"
  4. android:layout_width="wrap_content"
  5. android:layout_height="wrap_content"
  6. android:background="#ffffff">
  7. <TableLayout android:layout_width="fill_parent"
  8. android:layout_height="54dip"
  9. android:orientation="horizontal"
  10. android:layout_gravity="bottom"
  11. android:layout_alignParentBottom="true"
  12. xmlns:android="http://schemas.android.com/apk/res/android"
  13. >
  14. <TableRow
  15. android:layout_width="fill_parent"
  16. android:layout_height="54dip"
  17. >
  18. <Button
  19. android:id="@+id/btn1"
  20. android:background="#888888"
  21. android:layout_width="70dip"
  22. android:layout_height="54dip"
  23. android:layout_weight="1"
  24. android:text="Button 1"
  25. />
  26. <Button
  27. android:id="@+id/btn2"
  28. android:background="#888888"
  29. android:layout_width="70dip"
  30. android:layout_height="54dip"
  31. android:layout_weight="1"
  32. android:text="Button 2"
  33. />
  34. <Button
  35. android:background="#888888"
  36. android:id="@+id/btn3"
  37. android:layout_width="70dip"
  38. android:layout_height="54dip"
  39. android:layout_weight="1"
  40. android:text="Button 3"
  41. />
  42. <Button
  43. android:background="#888888"
  44. android:id="@+id/btn4"
  45. android:layout_width="70dip"
  46. android:layout_height="54dip"
  47. android:layout_weight="1"
  48. android:text="Button 4"
  49. />
  50. </TableRow>
  51. </TableLayout>
  52. </RelativeLayout>

效果图:

第二步:就是建立4个xml布局文件,里面可以只写一个TextView,命名为btn1_layout.xml,btn2_layout.xml,btn3_layout.xml,btn4_layout.xml.类似如下:

[html]

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3. xmlns:android="http://schemas.android.com/apk/res/android"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent">
  6. <TextView
  7. android:layout_width="fill_parent"
  8. android:layout_height="fill_parent"
  9. android:text="Button 1"
  10. android:textSize="36sp"
  11. android:textColor="#4a9ad8"
  12. />
  13. </LinearLayout>

第三步:

将下列代码插入到第一步中main.xml中,位于TableLayout之上

[html]

  1. <ViewStub
  2. android:id="@+id/btn1ViewStub"
  3. android:layout="@layout/btn1_layout"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent"
  6. />
  7. <ViewStub
  8. android:id="@+id/btn2ViewStub"
  9. android:layout="@layout/btn2_layout"
  10. android:layout_width="fill_parent"
  11. android:layout_height="fill_parent"
  12. />
  13. <ViewStub
  14. android:id="@+id/btn3ViewStub"
  15. android:layout="@layout/btn3_layout"
  16. android:layout_width="fill_parent"
  17. android:layout_height="fill_parent"
  18. />
  19. <ViewStub
  20. android:id="@+id/btn4ViewStub"
  21. android:layout="@layout/btn4_layout"
  22. android:layout_width="fill_parent"
  23. android:layout_height="fill_parent"
  24. />

第四步:Activity中,产生点击事件后,首先要将所有的ViewStub设置成不可见,否则将会出问题(你可以试试),java代码如下,具体就不解释了,能用ViewStub相信能看懂。

[java]

  1. package com.tab.activity; 
  2. import android.app.Activity; 
  3. import android.graphics.Color; 
  4. import android.os.Bundle; 
  5. import android.view.View; 
  6. import android.view.ViewStub; 
  7. import android.widget.Button; 
  8. public class MainActivity extends Activity { 
  9. private ViewStub[] viewStub = new ViewStub[4]; 
  10. private Button currentBtn; 
  11. private Button lastBtn; 
  12. private int[] tabBtnIds = {R.id.btn1, R.id.btn2, 
  13.             R.id.btn3, R.id.btn4}; 
  14. private Button[] tabBtn = new Button[4]; 
  15. @Override
  16. public void onCreate(Bundle savedInstanceState) { 
  17. super.onCreate(savedInstanceState); 
  18.         setContentView(R.layout.main); 
  19.         viewStub[0] = (ViewStub) findViewById(R.id.btn1ViewStub); 
  20.         viewStub[1] = (ViewStub) findViewById(R.id.btn2ViewStub); 
  21.         viewStub[2] =(ViewStub) findViewById(R.id.btn3ViewStub); 
  22.         viewStub[3] = (ViewStub) findViewById(R.id.btn4ViewStub); 
  23.         currentBtn = (Button) findViewById(R.id.btn2); 
  24.         TabBtnClickListener tabBtnListener = new TabBtnClickListener(); 
  25. for(int i=0; i<tabBtnIds.length; i++) { 
  26.             tabBtn[i] = (Button) findViewById(tabBtnIds[i]); 
  27.             tabBtn[i].setOnClickListener(tabBtnListener); 
  28.         } 
  29.     } 
  30. class TabBtnClickListener implements View.OnClickListener { 
  31. @Override
  32. public void onClick(View v) { 
  33.             lastBtn = currentBtn; 
  34.             currentBtn = (Button) v; 
  35. if(currentBtn.getId() == lastBtn.getId()) { 
  36. return; 
  37.             } 
  38.             currentBtn.setBackgroundColor(Color.BLUE); 
  39.             lastBtn.setBackgroundColor(Color.GRAY); 
  40. int currentIndex = -1; 
  41. switch(currentBtn.getId()) { 
  42. case R.id.btn1: 
  43.                     currentIndex = 0; 
  44. break; 
  45. case R.id.btn2: 
  46.                     currentIndex = 1; 
  47. break; 
  48. case R.id.btn3: 
  49.                     currentIndex = 2; 
  50. break; 
  51. case R.id.btn4: 
  52.                     currentIndex = 3; 
  53. break; 
  54.             } 
  55. for(int i=0; i<viewStub.length; i++) { 
  56.                 viewStub[i].setVisibility(View.INVISIBLE); 
  57.             } 
  58. for(int i=0; i<viewStub.length; i++) { 
  59. if(currentIndex == -1) { 
  60. break; 
  61.                 } 
  62. if(currentIndex != i) { 
  63.                     viewStub[i].setVisibility(View.INVISIBLE); 
  64.                 } else { 
  65.                     viewStub[i].setVisibility(View.VISIBLE); 
  66.                 } 
  67.             } 
  68.         } 
  69.     } 

最后截个图,比上面那个通讯录难看,但是Activity基本上是一样的。

源码地址:

转载于:https://www.cnblogs.com/tom-zhu/archive/2013/05/01/3053727.html

你可能感兴趣的文章
Servlet+JSP+JDBC设计实现图书系统——管理功能实现
查看>>
REST和SOAP区别
查看>>
arguments.callee 调用函数自身用法----JSON.parse()和JSON.stringify()前端js数据转换json格式...
查看>>
Android 分包 MultiDex 策略总结
查看>>
探寻 JavaScript 精度问题
查看>>
java配置定时任务的几种配置方式及示例
查看>>
WINDOWS xp用户账户怎么没了怎么办?
查看>>
区分多态和重载的区别
查看>>
抓取天猫手机评论
查看>>
模板设计模式的应用
查看>>
【井字游戏】做一款回忆童年的游戏
查看>>
testNG中@Factory详解
查看>>
[模拟赛] StopAllSounds
查看>>
高性能的异步爬虫
查看>>
数据结构(二):栈
查看>>
实训第五天
查看>>
平台维护流程
查看>>
SQL (FMDB)
查看>>
2012暑期川西旅游之总结
查看>>
Linux发行版的排行
查看>>