快捷方式Bar + ViewGroup - 自定义

最新推荐文章于 2025-01-20 08:46:46 发布

最新推荐文章于 2025-01-20 08:46:46 发布 · 104 阅读

文章标签：

#Android #XML

anddev 专栏收录该内容

95 篇文章

订阅专栏

本文介绍了一种使用两个LinearLayout来自定义实现TabActivity的方法，通过这种方式可以在标签页过多时避免界面变得难以阅读。文中详细介绍了实现步骤，包括定义布局、创建标签页、添加点击监听等。

TabActivity - 自定义

其实这篇感觉极鸡肋但是 TabActivity 在标签页太多情况下会导致界面比较难看所以今天尝试自己扩展一下

[原理]

用2 LinearLayout 完成之一个用于存放Image 另一用于显示具体布局

可能有人会说干嘛不用Gallery组件显示Image 这是因为Gallery显示特性比较固定只能水平显示或者是我不知道有知道的望告知

[代码步骤]

1. 定义布局：main.xml 其中 shortcut显示图片索引 info显示选择id content显示布局内容

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<LinearLayout  
	android:orientation="vertical"
    android:layout_width="50dip" 
    android:layout_height="wrap_content" 
    android:background="@drawable/dot"
    android:id="@+id/shortcut"
    >
<TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:id="@+id/info"
    />
</LinearLayout>
<LinearLayout  
	android:orientation="vertical"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:paddingLeft="10dip"
    android:id="@+id/content"
    >
</LinearLayout>
</LinearLayout>

2. 定义List 用于存放各个标签布局

List<View> viewList;

3. View初始化

public void init(){
    	shortcutLinear = (LinearLayout)findViewById(R.id.shortcut);
    	contentLinearLayout = (LinearLayout)findViewById(R.id.content);
    	infoText = (TextView)findViewById(R.id.info);
    	
    	viewList = new ArrayList<View>();
    	
    	inflatorHelper = this.getLayoutInflater();
    }

4. 定义addTab() 用于接受图标索引布局文件

public void addTab(int id,Drawable drawable,View view){
    	//1. to add ImageView into shortcut LinearLayout
    	ImageView iv = new ImageView(this);
    	iv.setImageDrawable(drawable);
    	shortcutLinear.addView(iv, id);
    	
    	//2. to add View into List<View>
    	viewList.add(id,view);
    }
    
    public void addTab(Drawable drawable,View view){
    	//1. to add ImageView into shortcut LinearLayout
    	ImageView iv = new ImageView(this);
    	iv.setImageDrawable(drawable);
    	shortcutLinear.addView(iv);
    	
    	//2. to add View into List<View>
    	viewList.add(view);
    }

5. 如何添加标签页

public void addExampleView(){
    	ImageView image = new ImageView(this);
    	image.setImageResource(R.drawable.robot);
    	addTab(this.getResources().getDrawable(R.drawable.icon),image);
    	
    	EditText edit = new EditText(this);
    	edit.setWidth(100);
    	addTab(1,this.getResources().getDrawable(R.drawable.hat),edit);
    	
    	TextView text = new TextView(this);
    	text.setText("Hello ~ Text!");
    	addTab(this.getResources().getDrawable(R.drawable.wyj),text);
    	
    	View panel1 = inflatorHelper.inflate(R.layout.panel1, null);
    	addTab(1,getResources().getDrawable(R.drawable.robot),panel1);
    }

6. 定义addClickListener() 用于注册LinearLasyout 所有ImageView

public void addClickListener(){
    	clickListener = new OnClickListener(){
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				int id = v.getId();
				
				infoText.setText(" id:"+id);
				
				//to remove all ori View, and then add new View
				contentLinearLayout.removeAllViews();
				if(id < viewList.size()){
					contentLinearLayout.addView(viewList.get(id));
				}
			}
    		
    	};
    	
    	for(int i=1;i<shortcutLinear.getChildCount();i++){
    		ImageView iv = (ImageView)shortcutLinear.getChildAt(i);
    		iv.setId(i);
    		
    		iv.setOnClickListener(clickListener);
    	}
    }

7. panel1.xml 布局如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="name:"
    />
<EditText  
    android:layout_width="200dip" 
    android:layout_height="wrap_content" 
    />
<Button  
    android:layout_width="100dip" 
    android:layout_height="wrap_content" 
    android:text="OK"
    />
</LinearLayout>

8. emulator 运行截图：