标签:des android style blog http io ar color os
上一篇使用过时的ActivityGroup简单实现了顶部底部均有Tab标签的效果,是页面底部只有文字的样式,今天想完善一下效果,底部实现文字加图标的样式。
本文属于半成品,本来想着放弃的,想着先放博客吧,好歹也是一种思路,以后作参考用!追求完美效果的可以忽略本篇,我会在后续文章中实现更优的效果!
先看下效果图
首先是主页面MainActivity.java,这种方式其实不是真正意义上的Tab,只是实现了这样的效果。底部用了GridView实现三个切换开关,放到页面底部。
package sun.geoffery.tabtopbottom; import android.app.ActivityGroup; import android.content.Intent; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.view.MotionEvent; import android.view.View; import android.view.View.OnTouchListener; import android.view.Window; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.GridView; import android.widget.LinearLayout; import android.widget.LinearLayout.LayoutParams; /** * All rights Reserved, Designed By GeofferySun * * @Title: MainActivity.java * @Package sun.geoffery.tabtopbottom * @Description:上下都有Tab的界面 * @author: GeofferySun * @date: 2014-12-9 下午3:41:04 * @version V1.0 */ public class MainActivity extends ActivityGroup { public static Class mTabClassAry[]= { HomeActivity.class, OrderActivity.class, WalletActivity.class}; public static String mTabTxtAry[] = {"主页", "订单", "钱包"}; public static int mTabImgAry[] = { R.drawable.ic_launcher, R.drawable.ic_launcher, R.drawable.ic_launcher}; private int mCurTab; private final static int FLAG_EVENT = 0X100; private GridView mTabGridView; private GridViewAdapter mTabAdapter; private LinearLayout mContainer; // 装载sub Activity的容器 public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); initView(); } private void initView() { mContainer = (LinearLayout) findViewById(R.id.Container); mTabGridView = (GridView) findViewById(R.id.bottom_tab); // 禁止GridView滚动 mTabGridView.setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { return MotionEvent.ACTION_MOVE == event.getAction() ? true : false; } }); mTabAdapter = new GridViewAdapter(this, mTabImgAry, mTabTxtAry); mTabGridView.setAdapter(mTabAdapter); mTabGridView.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { switchActivity(position); } }); mCurTab = -1; mHandler.sendEmptyMessageDelayed(FLAG_EVENT, 100); } Handler mHandler = new Handler() { @Override public void handleMessage(Message msg) { switch (msg.what) { case FLAG_EVENT: switchActivity(0); break; } } }; private void switchActivity(int index) { if (index < 0 || index >= mTabClassAry.length) { return; } if (mCurTab == index) { return; } if (mCurTab != -1) { mTabGridView.getChildAt(mCurTab).setBackgroundDrawable(null); } // mTabGridView.getChildAt(index).setBackgroundResource(R.drawable.tab_item_d); mCurTab = index; mContainer.removeAllViews(); Intent intent = new Intent(this, mTabClassAry[index]); String name = index + " subactivity"; // Activity 转为 View Window subActivity = getLocalActivityManager().startActivity(name, intent); View child = subActivity.getDecorView(); LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT); child.setLayoutParams(params); // 容器添加View mContainer.addView(child); } }
主页面对应的页面文件
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:id="@+id/Container" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" android:layout_above="@+id/bottom_tab" /> <GridView android:id="@+id/bottom_tab" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:background="#404040" android:listSelector="@android:color/transparent" android:numColumns="3" android:padding="2dp" /> </RelativeLayout>
</pre><pre name="code" class="java">package sun.geoffery.tabtopbottom; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.ImageView; import android.widget.TextView; public class GridViewAdapter extends BaseAdapter { Context mContext; LayoutInflater mLayoutInflater; int mImageviewArray[]; String mTextViewArray[]; public GridViewAdapter(Context context, int imageViewArray[], String textViewArray[]) { mContext = context; mLayoutInflater = LayoutInflater.from(context); mImageviewArray = imageViewArray; mTextViewArray = textViewArray; } @Override public Object getItem(int position) { return position; } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if (convertView == null) { convertView = mLayoutInflater.inflate(R.layout.tab_item_view, null); } ImageView imageView = (ImageView) convertView .findViewById(R.id.imageview); imageView.setBackgroundResource(mImageviewArray[position]); TextView textView = (TextView) convertView.findViewById(R.id.textview); textView.setText(mTextViewArray[position]); return convertView; } @Override public int getCount() { return mImageviewArray.length; } }每个Item对应的布局文件tab_item_view.xml如下
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <ImageView android:id="@+id/imageview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:focusable="false" android:padding="3dp" > </ImageView> <TextView android:id="@+id/textview" style="@style/tab_item_text_style" android:layout_width="wrap_content" android:layout_height="wrap_content" > </TextView> </LinearLayout>至于其他页面还是上一篇文章中的代码,没有改动。
没看明白的直接去查看源码吧!
Android 底部TabActivity(3)——ActivityGroup|顶部底部均有Tab标签之二
标签:des android style blog http io ar color os
原文地址:http://blog.csdn.net/geofferysun/article/details/41852605