`

TabHost 切换带滑动及tab页的数据添加

 
阅读更多

一、在layout下创建TabHost的home.xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >

            <LinearLayout
                android:id="@+id/widget_layout_Blue"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >

                <ListView
                    android:id="@+id/listView"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent" />
            </LinearLayout>

           <LinearLayout
                android:id="@+id/widget_layout_red"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:orientation="vertical" >

                <AnalogClock
                    android:id="@+id/widget36"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" >
                </AnalogClock>
               
            </LinearLayout>

            <LinearLayout
                android:id="@+id/widget_layout_green"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:orientation="vertical" >

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="这是第三个标签页" />

                <RadioGroup
                    android:id="@+id/widget43"
                    android:layout_width="166px"
                    android:layout_height="98px"
                    android:orientation="vertical" >

                    <RadioButton
                        android:id="@+id/widget44"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="RadioButton" >
                    </RadioButton>

                    <RadioButton
                        android:id="@+id/widget45"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="RadioButton" >
                    </RadioButton>
                </RadioGroup>
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>

</TabHost>

二、在layout下创建加载条的footer.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <ProgressBar android:id="@+id/c81_forthBar"
        android:layout_width="50dp"
    	android:layout_height="wrap_content"
         style="?android:attr/progressBarStyle" /> 
    <TextView android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:textSize="20sp"
    android:text="数据正在加载..."
    />
</LinearLayout>

 

三、在menu目录下添加menu文件addphone_menu.xml、chatting_menu.xml、phonebook_menu.xml、userapp_menu.xml , 文件内容一致

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
</menu>

四、在drawable目录下添加menu1h.png、menu1n.png和ic_tab_artists.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">    
	<!-- When selected, use grey -->
	<item android:drawable="@drawable/menu1h"
		android:state_selected="true" />    
	<!-- When not selected, use white -->
	<item android:drawable="@drawable/menu1n" />
</selector>

五、在layout目录下创建icon.xml , 用于显示TabHost的图片和文字

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

	<ImageView
        android:id="@+id/icon"
        android:layout_width="30dip"
        android:layout_height="30dip"
        android:layout_gravity="center"
        android:layout_margin="0dip" />
	
   <TextView
       android:id="@+id/tabsText"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:paddingTop="1dip"
       android:text=""
       android:textSize="12dip" />

</LinearLayout>

 

六、在src目录下HomeActivity.java文件

 

package com.app.activity;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.util.Log;
import android.view.GestureDetector;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.AbsListView.OnScrollListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;
import android.widget.TabHost.TabSpec;
import android.widget.TextView;

import com.app.R;

@SuppressLint("NewApi")
public class HomeActivity extends Activity {

	private TabHost mTabHost;
	private Menu myMenu;
	private int myMenuSettingTag;
	private ListView listView;
	private int number = 15;// 每次获取多少条数据
	private int maxpage = 5;// 总共有多少页
	private boolean loadfinish = true;
	private View footer;
	private SimpleAdapter adapter;
	private List<HashMap<String, Object>> data = new ArrayList<HashMap<String, Object>>();
	private static final int myMenuResources[] = { R.menu.phonebook_menu,
			R.menu.addphone_menu, R.menu.chatting_menu, R.menu.userapp_menu };// 将menu添加到数组当中

	private void setupTabHost() {
		// mTabHost = getTabHost();//继承TabActivity使用 , 4.0以后TabActivity过期, 不建议使用
		setContentView(R.layout.home);// 继承Activity使用
		mTabHost = (TabHost) this.findViewById(R.id.tabhost);// 继承Activity使用
		mTabHost.setup();
	}

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		// construct the tabhost
		setupTabHost();
		mTabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));// 设置tabhost的颜色

		// 继承Activity使用
		TabSpec tabSpec = mTabHost.newTabSpec("one");
		// tabSpec.setIndicator("",
		// getResources().getDrawable(R.drawable.ic_tab_artists));
		tabSpec.setIndicator(createTabView(mTabHost.getContext(), "",
				R.drawable.ic_tab_artists));
		tabSpec.setContent(R.id.widget_layout_Blue);
		mTabHost.addTab(tabSpec);

		tabSpec = mTabHost.newTabSpec("two");
		// tabSpec.setIndicator("",
		// getResources().getDrawable(R.drawable.ic_tab_artists));
		tabSpec.setIndicator(createTabView(mTabHost.getContext(), "",
				R.drawable.ic_tab_artists));
		tabSpec.setContent(R.id.widget_layout_red);
		mTabHost.addTab(tabSpec);

		tabSpec = mTabHost.newTabSpec("three");
		// tabSpec.setIndicator("",
		// getResources().getDrawable(R.drawable.ic_tab_artists));
		tabSpec.setIndicator(createTabView(mTabHost.getContext(), "",
				R.drawable.ic_tab_artists));
		tabSpec.setContent(R.id.widget_layout_green);
		mTabHost.addTab(tabSpec);

		tabSpec = mTabHost.newTabSpec("four");
		// tabSpec.setIndicator("",
		// getResources().getDrawable(R.drawable.ic_tab_artists));
		tabSpec.setIndicator(createTabView(mTabHost.getContext(), "",
				R.drawable.ic_tab_artists));
		tabSpec.setContent(R.id.widget_layout_green);
		mTabHost.addTab(tabSpec);

		/**
		// 继承TabActivity使用
		LayoutInflater.from(this).inflate(R.layout.home,
				mTabHost.getTabContentView(), true);
		mTabHost.addTab(mTabHost.newTabSpec("one")
				// tabid
				.setIndicator("TTT",// tab名称
						getResources().getDrawable(R.drawable.ic_tab_artists))
				.setContent(R.id.widget_layout_Blue));// tab内容
		mTabHost.addTab(mTabHost
				.newTabSpec("two")
				.setIndicator("AAA",
						getResources().getDrawable(R.drawable.ic_tab_artists))
				.setContent(R.id.widget_layout_red));
		mTabHost.addTab(mTabHost
				.newTabSpec("three")
				.setIndicator("BBB",
						getResources().getDrawable(R.drawable.ic_tab_artists))
				.setContent(R.id.widget_layout_green));
		**/
		
		mTabHost.setCurrentTab(0);//默认显示第一个tab,可以不设
		if (mTabHost.getCurrentTab() == 0) {
			show();//默认显示
		}
		mTabHost.setOnTabChangedListener(new OnTabChangeListener() {
			@Override
			public void onTabChanged(String tabId) {
				if (tabId.equals("one")) {
					myMenuSettingTag = 1;
				}
				if (tabId.equals("two")) {
					myMenuSettingTag = 2;
				}
				if (tabId.equals("three")) {
					myMenuSettingTag = 3;
				}
				if (tabId.equals("four")) {
					myMenuSettingTag = 4;
				}
				if (myMenu != null) {
					onCreateOptionsMenu(myMenu);
				}

			}

		});
	}

	// 通过MenuInflater过滤器动态加入MENU
	public boolean onCreateOptionsMenu(Menu menu) {
		myMenu = menu;
		myMenu.clear();
		MenuInflater inflater = getMenuInflater();
		switch (myMenuSettingTag) {
		case 1:
			inflater.inflate(myMenuResources[0], menu);
			menu.close();
			break;
		case 2:
			inflater.inflate(myMenuResources[1], menu);
			menu.close();
			break;
		case 3:
			inflater.inflate(myMenuResources[2], menu);
			menu.close();
		default:
			inflater.inflate(myMenuResources[0], menu);
			menu.close();
			break;
		}

		return super.onCreateOptionsMenu(menu);
	}

	/**
	 * 显示列表数据
	 */
	public void show() {
		footer = getLayoutInflater().inflate(R.layout.footer, null);
		listView = (ListView) this.findViewById(R.id.listView);
		listView.setOnScrollListener(new ScrollListener());
		data = load(0, 0);// 第一次加载数据
		adapter = new SimpleAdapter(this, data, R.layout.item, new String[] {
				"name", "phone", "amount" }, new int[] { R.id.name, R.id.phone,
				R.id.amount });
		listView.addFooterView(footer);// 添加页脚(放在ListView最后)
		listView.setAdapter(adapter);
		listView.setOnItemClickListener(new OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				// TODO Auto-generated method stub

			}

		});
		
		//为ListView添加屏幕的触摸事件 , 如果不加此方法, ListView列表左右滑动无效
		listView.setOnTouchListener(new OnTouchListener() {
			@Override
			public boolean onTouch(View v, MotionEvent event) {
				detector.onTouchEvent(event);
				return onTouchEvent(event);
			}
		});
		listView.removeFooterView(footer);
	}

	private final class ScrollListener implements OnScrollListener {
		public void onScrollStateChanged(AbsListView view, int scrollState) {
			Log.i("MainActivity", "onScrollStateChanged(scrollState="
					+ scrollState + ")");
		}

		public void onScroll(AbsListView view, int firstVisibleItem,
				int visibleItemCount, int totalItemCount) {
			Log.i("MainActivity", "onScroll(firstVisibleItem="
					+ firstVisibleItem + ",visibleItemCount="
					+ visibleItemCount + ",totalItemCount=" + totalItemCount
					+ ")");

			final int loadtotal = totalItemCount;
			int lastItemid = listView.getLastVisiblePosition();// 获取当前屏幕最后Item的ID
			if ((lastItemid + 1) == totalItemCount) {// 达到数据的最后一条记录
				if (totalItemCount > 0) {
					// 当前页
					int currentpage = totalItemCount % number == 0 ? totalItemCount
							/ number
							: totalItemCount / number + 1;
					int nextpage = currentpage + 1;// 下一页
					if (nextpage <= maxpage && loadfinish) {// 加载完了加载下一页
						loadfinish = false;
						listView.addFooterView(footer);
						new Thread(new Runnable() {
							public void run() {
								try {
									Thread.sleep(1000);
								} catch (InterruptedException e) {
									e.printStackTrace();
								}
								List<HashMap<String, Object>> result = load(
										loadtotal, number);
								handler.sendMessage(handler.obtainMessage(100,
										result));
							}
						}).start();
					}
				}

			}
		}

	}

	Handler handler = new Handler() {
		public void handleMessage(Message msg) {
			data.addAll((List<HashMap<String, Object>>) msg.obj);
			adapter.notifyDataSetChanged();// 告诉ListView数据已经发生改变,要求ListView更新界面显示
			if (listView.getFooterViewsCount() > 0)
				listView.removeFooterView(footer);
			loadfinish = true;
		}
	};

	/**
	 * 测试数据
	 * 
	 * @param loadtotal
	 * @param number
	 * @return
	 */
	public List<HashMap<String, Object>> load(int loadtotal, int number) {
		List<HashMap<String, Object>> data = new ArrayList<HashMap<String, Object>>();
		for (int i = 0; i < 15; i++) {
			HashMap<String, Object> item = new HashMap<String, Object>();
			item.put("name", "xxx");
			item.put("phone", "jjj");
			item.put("amount", "vvv");
			item.put("id", "ooo");
			data.add(item);
		}
		return data;
	}

	/**
	 * 当前页面索引
	 */
	int i = 0;

	/**
	 * 屏幕的触摸事件,如果返回true 则消耗掉这个事件 返回false则未消耗传递下去
	 */
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		int d = listView.getVisibility();
		Log.i("DDD---", d + "");
		i = mTabHost.getCurrentTab();
		detector.onTouchEvent(event);
		return super.onTouchEvent(event);
	}

	private GestureDetector detector = new GestureDetector(
			new GestureDetector.SimpleOnGestureListener() {
				@Override
				public boolean onFling(MotionEvent e1, MotionEvent e2,
						float velocityX, float velocityY) {
					if ((e2.getRawX() - e1.getRawX()) > 80) {// 滑动的距离

						showNext();// 向右滑动,显示下一个页面
						return true;
					}

					if ((e1.getRawX() - e2.getRawX()) > 80) {
						showPre();// 向左滑动,显示上一个页面
						return true;
					}
					return super.onFling(e1, e2, velocityX, velocityY);
				}

			});

	/**
	 * 显示下一个页面
	 */
	protected void showNext() {
		// 三元表达式控制3个页面的循环.
		mTabHost.setCurrentTab(i = i == 3 ? i = 0 : ++i);
		Log.i("kennet", i + "");
	}

	/**
	 * 显示前一个页面
	 */
	protected void showPre() {
		// 三元表达式控制3个页面的循环.
		mTabHost.setCurrentTab(i = i == 0 ? i = 3 : --i);
	}

	private View createTabView(String name) {
		// View tabView = getLayoutInflater().inflate(R.layout.tab, null);
		LinearLayout linearLayout = new LinearLayout(this);
		linearLayout.setOrientation(LinearLayout.VERTICAL);
		linearLayout.setBackgroundColor(0xFFFFFF);

		TextView textView = new TextView(this);
		textView.setText(name);
		textView.setBackgroundResource(R.drawable.ic_tab_artists);
		textView.setTextColor(0xFFFFFF);
		textView.setTextSize(18.0f);
		textView.setGravity(Gravity.CENTER);
		ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(
				ViewGroup.LayoutParams.MATCH_PARENT,
				ViewGroup.LayoutParams.MATCH_PARENT);
		linearLayout.addView(textView, params);
		return linearLayout;
	}

	private static View createTabView(final Context context, final String text,
			int drawable) {
		View view = LayoutInflater.from(context).inflate(R.layout.icon, null);
		TextView tv = (TextView) view.findViewById(R.id.tabsText);
		tv.setText(text);// 名称
		ImageView iv = (ImageView) view.findViewById(R.id.icon);
		iv.setImageResource(drawable);// 背景图
		return view;
	}
}

 

  • 大小: 35.6 KB
  • 大小: 26.9 KB
  • 大小: 27.3 KB
  • 大小: 2.8 KB
  • 大小: 3.2 KB
分享到:
评论

相关推荐

    Android可以点击切换和滑动切换的tabhost

    2. 添加动画效果:通过设置TabHost的OnTabChangeListener监听Tab切换事件,然后添加平滑过渡的动画效果。 3. 适配屏幕尺寸:根据设备的屏幕尺寸和方向调整TabHost的布局和样式。 总之,实现点击和滑动切换的TabHost...

    Tab选项卡页面滑动切换

    在IT领域,尤其是在Web开发和移动应用设计中,"Tab选项卡页面滑动切换"是一种常见的用户界面(UI)设计模式。它允许用户通过点击或滑动在不同的内容区域之间轻松切换,通常用于展示多个相关但独立的部分。下面将详细...

    tab切换之tabhost模式

    在Android应用开发中,TabHost是一种常见的用于实现标签页切换的组件,它允许开发者在一个Activity中展示多个Fragments或者Views,通过不同的标签页来切换显示不同的内容。本篇将深入探讨TabHost的工作原理、实现...

    自定义Android中TabHost组件显示在屏幕底部,并实现滑动切换页面(源码下载)

    在Android应用开发中,TabHost组件是一个非常常用的工具,它用于创建带有标签页的应用界面,让用户可以在多个视图间切换。本教程将详细介绍如何自定义TabHost组件使其显示在屏幕底部,并实现通过滑动切换页面的功能...

    TabHost切换

    你可以将`TabHost`与`ViewPager`结合,通过`PagerAdapter`为每个Tab创建一个单独的Fragment,然后在`ViewPager`中滑动切换这些Fragment。 3. **按钮点击事件处理**: - 在每个Tab的内容区域,可以添加按钮或者其他...

    Android代码-fleep滑动切换tab切换带动画.zip

    综上所述,这个项目"Android代码-fleep滑动切换tab切换带动画.zip"提供了实现滑动切换Tab并带有动画效果的实例,开发者可以通过学习和修改这段代码,来提升自己在Android界面设计和用户体验上的能力。通过实际操作,...

    左右滑动可以切换的TabHost

    根据提供的标题和描述,这里我们将讨论如何实现一个具有下拉菜单并且能通过左右滑动切换Activity的自定义TabHost。 首先,让我们理解基本的TabHost工作原理。TabHost是Android框架提供的一种布局容器,它可以包含一...

    tabhost的滑动翻页效果

    传统的TabHost切换Tab是通过点击事件完成的,但随着触摸屏设备的普及,滑动翻页成为了更自然的交互方式。 要实现TabHost的滑动翻页效果,我们可以利用ViewPager组件。ViewPager是一个可以左右滑动查看多个页面的...

    tabhost listview 左右滑动实现

    在这个场景中,我们要实现一个`TabHost`,其中每个标签页的内容是一个`ListView`,并且整个`TabHost`可以通过左右滑动来切换标签页。下面将详细介绍如何实现这样的功能。 首先,我们需要理解`TabHost`的工作原理。`...

    Android代码,TabHost+Fragment实现多标签页,可滑动切换

    本示例介绍如何使用TabHost结合Fragment来实现这一功能,同时支持滑动切换,以适应API级别19及以上的设备。在API 13之后,原生的TabHost组件不再推荐使用,因此我们需要使用更现代的方式来实现类似的功能。 首先,...

    Tab页滑动切换

    在Android中,我们可以使用`TabHost`和`TabWidget`组件来创建传统的Tab布局,但随着Android设计风格的演变,现在更推荐使用`ViewPager`配合`TabLayout`(自Android Design Support Library引入)来实现滑动Tab页。...

    底部导航(TabHost)可滑动切换

    本文将详细介绍如何使用TabHost实现底部导航并实现滑动切换选项卡的功能。 首先,我们需要了解TabHost的基本结构。TabHost是一个可以容纳多个TabWidget(标签)和一个FrameLayout(内容区域)的容器。每个TabWidget...

    TabHost + ViewFlipper实现滑动翻页、切换tab动画效果

    历史最牛、绝对原创、代码简洁、功能强大,华丽的使用TabHost与ViewFlipper结合实现滑动翻页效果,支持tab背景图片自动切换.之前看到别人写的实现方法是重写TabHost,但是代码太繁琐。本程序虽然资源分高点儿,但...

    使用Fragment+Tabhost实现切换

    在实际开发中,你还需要考虑如何加载和解析新闻数据,以及如何优化用户体验,如添加滑动切换Tab、处理网络错误等。文件列表中的"TabFragment"可能包含了实现这一功能的示例代码,你可以参考并进行学习。总的来说,...

    可以滑动的TabHost

    然而,原生的`TabHost`并不支持滑动切换标签页,这使得用户体验受限。为了解决这个问题,开发者通常会结合`ViewPager`来实现可滑动的TabHost效果。 `ViewPager` 是Android Support Library中的一个组件,它主要用于...

    TabHost+ViewPager实现滑动tabhost

    在Android开发中,TabHost和ViewPager是两种常用的组件,它们可以结合起来创建出具有滑动切换效果的界面。本文将深入探讨如何使用TabHost与ViewPager来实现这一功能,并提供相关的源码解析。 首先,TabHost是...

    android 可以滑动的tabhost

    在Android开发中,"可滑动的TabHost"是一种常见的用户界面组件,它结合了TabHost和ViewPager的优点,提供了一种动态、可滑动的方式来切换不同的内容片段。TabHost是Android原生的一个组件,用于创建带有多个选项卡的...

    android左右滑动切换Tab

    在Android应用开发中,"左右滑动切换Tab"是一种常见的用户界面交互设计,它使得用户可以通过手势在不同的页面或视图之间切换,提供更流畅的浏览体验。这种设计通常与TabHost组件结合使用,TabHost是Android SDK提供...

    TabHost切换动画及基本原理

    在Android开发中,`TabHost`是一个非常重要的组件,它用于创建具有标签页风格的用户界面,让用户可以在多个视图间轻松切换。本资源主要关注`TabHost`的切换动画及其基本工作原理。 首先,`TabHost`是Android提供的...

    一个android带动画效果的TabHost(类似微博客户端的切换效果)

    在项目中,`ShopListDownLoad`可能是一个与购物清单下载相关的类或资源文件,虽然它不直接关联到TabHost的动画效果,但在实际应用中,可能用于加载或处理每个Tab页面的数据。例如,这个类可能负责从网络下载商品列表...

Global site tag (gtag.js) - Google Analytics