欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

自定义底部工具栏及顶部工具栏和Fragment配合使用demo

程序员文章站 2022-05-11 12:29:18
...
    首先简单的介绍下fragment，fragment是android3.0新增的概念，其中文意思是碎片，它与activity非常相似，用来在一个activity中描述一些行为或一部分用户界面。使用锁个fragment可以再一个单独的activity中建立多个UI面板，也可以在多个activity中重用fragment，一个fragment必须被嵌入到一个activity中，它的生命周期直接受其所宿主的activity的生命周期的影响。
    首先创建一个fragment，要创建一个fragment，必须创建一个fragment的子类，或者继承自另外一个已经存在的Fragment的子类，并重写相应的方法。
    编写Fragment的xml文件和类文件，这里我写了四个，贴出来其中两个代码，其他的copy就行。

fragment_main.xml 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

	<TextView 
	    android:layout_height="wrap_content"
	    android:layout_width="wrap_content"
	    android:gravity="center"
	    android:text="主页面"
	    />

</RelativeLayout>


MainFragment.java 
public class MainFragment extends Fragment{
	
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.fragment_main, container,false);
		return view;
	}
	
	@Override
	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
	}

}


fragment_grxx.xml 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >
    
    <com.qyh.view.TitleView 
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

	<TextView 
	    android:layout_height="wrap_content"
	    android:layout_width="wrap_content"
	    android:gravity="center"
	    android:text="个人信息"
	    />

</RelativeLayout>


GrxxFragment.java 
public class GrxxFragment extends Fragment{
	private TitleView titleView;
	private FragmentActivity mActivity;
	private View mParent;
	
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.fragment_grxx, container,false);
		return view;
	}
	
	@Override
	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
		mActivity = getActivity();
		mParent = getView();
		titleView = (TitleView) mActivity.findViewById(R.id.title);
		titleView.setTitle("个人信息");
		titleView.setBackButton(new TitleView.OnBackButtonClickListener() {
			@Override
			public void onClick(View button) {
				getFragmentManager().beginTransaction()
				.hide(com.qyh.main.MainActivity.mFragments[1])
				.show(com.qyh.main.MainActivity.mFragments[0]).commit();
				FragmentIndicator.setIndicator(0);
			}
		});
	}

}


自定义底部工具栏
FragmentIndicator.java 
public class FragmentIndicator extends LinearLayout implements OnClickListener {

	private static String TAG = "FragmentIndicator";
	private int mDefaultIndicator = 0;// 默认位置
	private static int mCurIndicator;// 当前位置
	private static View[] mIndicators;
	private OnIndicateListener mOnIndicateListener;

	private static final String TAG_ICON_0 = "icon_tag_0";
	private static final String TAG_ICON_1 = "icon_tag_1";
	private static final String TAG_ICON_2 = "icon_tag_2";
	private static final String TAG_ICON_3 = "icon_tag_3";

	private FragmentIndicator(Context context) {
		super(context);
	}

	public FragmentIndicator(Context context, AttributeSet attrs) {
		super(context, attrs);
		mCurIndicator = mDefaultIndicator;
		setOrientation(LinearLayout.HORIZONTAL);
		initView();
	}

	private View createIndicator(int iconResID, int stringResID,
			int stringColor, String iconTag, String textTag) {
		LinearLayout view = new LinearLayout(getContext());

		view.setOrientation(LinearLayout.HORIZONTAL);
		view.setLayoutParams(new LinearLayout.LayoutParams(
				LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT,1));
		view.setGravity(Gravity.CENTER);

		ImageView iconView = new ImageView(getContext());
		iconView.setTag(iconTag);
		iconView.setLayoutParams(new LinearLayout.LayoutParams(
				LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT, 1));
		iconView.setImageResource(iconResID);
		view.addView(iconView);
		return view;
	}

	private void initView() {
		mIndicators = new View[4];
		mIndicators[0] = createIndicator(R.drawable.main_home, 0, 0, TAG_ICON_0,
				null);
		mIndicators[0].setBackgroundResource(R.drawable.indic_select);
		mIndicators[0].setTag(Integer.valueOf(0));
		mIndicators[0].setOnClickListener(this);
		addView(mIndicators[0]);

		mIndicators[1] = createIndicator(R.drawable.main_user, 0, 0, TAG_ICON_1,
				null);
		mIndicators[1].setBackgroundResource(Color.alpha(0));
		mIndicators[1].setTag(Integer.valueOf(1));
		mIndicators[1].setOnClickListener(this);
		addView(mIndicators[1]);

		mIndicators[2] = createIndicator(R.drawable.main_set, 0, 0, TAG_ICON_2,
				null);
		mIndicators[2].setBackgroundResource(Color.alpha(0));
		mIndicators[2].setTag(Integer.valueOf(2));
		mIndicators[2].setOnClickListener(this);
		addView(mIndicators[2]);

		mIndicators[3] = createIndicator(R.drawable.main_more, 0, 0,
				TAG_ICON_3, null);
		mIndicators[3].setBackgroundResource(Color.alpha(0));
		mIndicators[3].setTag(Integer.valueOf(3));
		mIndicators[3].setOnClickListener(this);

		addView(mIndicators[3]);
	}

	public static void setIndicator(int which) {
		// 以前状态
		mIndicators[mCurIndicator].setBackgroundColor(Color.alpha(0));
		ImageView prevIcon;
		switch (mCurIndicator) {
		case 0:
			prevIcon = (ImageView) mIndicators[mCurIndicator]
					.findViewWithTag(TAG_ICON_0);
			prevIcon.setImageResource(R.drawable.main_home);
			break;
		case 1:
			prevIcon = (ImageView) mIndicators[mCurIndicator]
					.findViewWithTag(TAG_ICON_1);
			prevIcon.setImageResource(R.drawable.main_user);
			break;
		case 2:
			prevIcon = (ImageView) mIndicators[mCurIndicator]
					.findViewWithTag(TAG_ICON_2);
			prevIcon.setImageResource(R.drawable.main_set);
			break;
		case 3:
			prevIcon = (ImageView) mIndicators[mCurIndicator]
					.findViewWithTag(TAG_ICON_3);
			prevIcon.setImageResource(R.drawable.main_more);
			break;
		default:
			break;
		}
		Log.i(TAG, "setIndicator:mCurIndicator=" + mCurIndicator);
		// 更新当前状态
		mIndicators[which].setBackgroundResource(R.drawable.indic_select);
		ImageView currIcon;
		switch (which) {
		case 0:
			currIcon = (ImageView) mIndicators[which]
					.findViewWithTag(TAG_ICON_0);
			currIcon.setImageResource(R.drawable.main_home_hover);// 选中后的图片
			break;
		case 1:
			currIcon = (ImageView) mIndicators[which]
					.findViewWithTag(TAG_ICON_1);
			currIcon.setImageResource(R.drawable.main_user_hover);
			break;
		case 2:
			currIcon = (ImageView) mIndicators[which]
					.findViewWithTag(TAG_ICON_2);
			currIcon.setImageResource(R.drawable.main_set_hover);
			break;
		case 3:
			currIcon = (ImageView) mIndicators[which]
					.findViewWithTag(TAG_ICON_3);
			currIcon.setImageResource(R.drawable.main_more_hover);
			break;
		default:
			break;
		}
		mCurIndicator = which;
	}

	public interface OnIndicateListener {
		public void onIndicate(View v, int which);
	}

	public void setOnIndicateListener(OnIndicateListener listener) {
		mOnIndicateListener = listener;
	}

	@Override
	public void onClick(View v) {
		if (mOnIndicateListener != null) {
			int tag = (Integer) v.getTag();
			switch (tag) {
			case 0:
				if (mCurIndicator != 0) {
					mOnIndicateListener.onIndicate(v, 0);
					setIndicator(0);
				}
				break;
			case 1:
				if (mCurIndicator != 1) {
					mOnIndicateListener.onIndicate(v, 1);
					setIndicator(1);
				}
				break;
			case 2:
				if (mCurIndicator != 2) {
					mOnIndicateListener.onIndicate(v, 2);
					setIndicator(2);
				}
				break;
			case 3:
				if (mCurIndicator != 3) {
					mOnIndicateListener.onIndicate(v, 3);
					setIndicator(3);
				}
				break;
			default:
				break;
			}

		}

	}

}


自定义顶部工具栏
title_view.xml 
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="48dip"
    android:background="#18222E" >

    <ImageButton
        android:id="@+id/ib_back"
        android:layout_width="48dp"
        android:layout_height="match_parent"
        android:src="@drawable/ic_titleback" 
        />

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:text="个人信息"/>
    
    <ImageButton
        android:id="@+id/ib_handle"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:layout_marginRight="12dp"
        android:visibility="gone"/>

</FrameLayout>


TitleView.java 
/**
 * 功能描述：自定义顶部工具栏
 */
public class TitleView extends FrameLayout implements View.OnClickListener {
	public OnBackButtonClickListener mOnBackButtonClickListener;
	public OnHandleButtonClickListener mHandleButtonClickListener;
	private TextView mTitle;
	private ImageButton mBackButton;
	private ImageButton ib_handle;

	public TitleView(Context context) {
		this(context, null);
	}

	public TitleView(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
	}

	public TitleView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);

		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		inflater.inflate(R.layout.title_view, this, true);
		mBackButton = (ImageButton) findViewById(R.id.ib_back);
		mBackButton.setOnClickListener(this);
		mTitle = (TextView) findViewById(R.id.tv_title);
		mTitle.setVisibility(View.INVISIBLE);
		ib_handle = (ImageButton) findViewById(R.id.ib_handle);
		ib_handle.setOnClickListener(this);
	}

	public interface OnBackButtonClickListener {
		public void onClick(View button);
	}

	public interface OnHandleButtonClickListener {
		public void onClick(View button);
	}

	/**
	 * 标题返回按钮
	 * 
	 * @param listener
	 */
	public void setBackButton(OnBackButtonClickListener listener) {
		mOnBackButtonClickListener = listener;
	}
	
	public void showBackBtn(){
		mBackButton.setVisibility(View.VISIBLE);
	}
	
	public void hiddenBackBtn(){
		mBackButton.setVisibility(View.GONE);
	}
	
	/**
	 * 标题操作按钮
	 * 
	 * @param listener
	 */
	public void setHandleButton(OnHandleButtonClickListener listener) {
		mHandleButtonClickListener = listener;
	}
	
	public void hiddenHandleBtn(){
		ib_handle.setVisibility(View.GONE);
	}
	
	public void showHandleBtn(int iamgeBtnID){
		ib_handle.setImageResource(iamgeBtnID);
		ib_handle.setVisibility(View.VISIBLE);
	}
//设置标题
	public void setTitle(String text) {
		mTitle.setVisibility(View.VISIBLE);
		mTitle.setText(text);
	}

	public void setTitle(int stringID) {
		mTitle.setVisibility(View.VISIBLE);
		mTitle.setText(stringID);
	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.ib_back:
			if (mOnBackButtonClickListener != null) {
				mOnBackButtonClickListener.onClick(v);
			}
			break;
		case R.id.ib_handle:
			if (mHandleButtonClickListener != null) {
				mHandleButtonClickListener.onClick(v);
			}
			break;
		default:
			break;
		}
	}

}


在main.xml里面添加相关fragment和自定义底部工具栏,注意name属性 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <fragment
        android:id="@+id/fragment_main"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:name="com.qyh.fragment.MainFragment" />

    <fragment
        android:id="@+id/fragment_grxx"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:name="com.qyh.fragment.GrxxFragment" />

    <fragment
        android:id="@+id/fragment_sz"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:name="com.qyh.fragment.SzFragment" />

    <fragment
        android:id="@+id/fragment_others"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:name="com.qyh.fragment.OthersFragment" />
    
    <!--此处为自定义底部菜单栏  -->
    <com.qyh.fragment.FragmentIndicator
        android:id="@+id/indicator"
        android:layout_width="fill_parent"
        android:layout_height="48dp"
        />

</LinearLayout>


在主线程中对fragment做相关操作 
public class MainActivity extends FragmentActivity {
	
	public static Fragment[] mFragments;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);
		setFragmentIndicator(0);

	}
	
	private void setFragmentIndicator(int whichIsDefault) {
		mFragments = new Fragment[4];
		mFragments[0] = getSupportFragmentManager().findFragmentById(
				R.id.fragment_main);
		mFragments[1] = getSupportFragmentManager().findFragmentById(
				R.id.fragment_grxx);
		mFragments[2] = getSupportFragmentManager().findFragmentById(
				R.id.fragment_sz);
		mFragments[3] = getSupportFragmentManager().findFragmentById(
				R.id.fragment_others);
		getSupportFragmentManager().beginTransaction().hide(mFragments[0])
				.hide(mFragments[1]).hide(mFragments[2]).hide(mFragments[3])
				.show(mFragments[whichIsDefault]).commit();

		FragmentIndicator mIndicator = (FragmentIndicator) findViewById(R.id.indicator);
		FragmentIndicator.setIndicator(whichIsDefault);
		mIndicator.setOnIndicateListener(new OnIndicateListener() {

			@Override
			public void onIndicate(View v, int which) {
				getSupportFragmentManager().beginTransaction()
						.hide(mFragments[0]).hide(mFragments[1])
						.hide(mFragments[2]).hide(mFragments[3])
						.show(mFragments[which]).commit();
			}
		});
	}
}


运行相关效果图

自定义底部工具栏及顶部工具栏和Fragment配合使用demo 博客分类： android androidfragment自定义底部工具栏自定义顶部工具栏 

自定义底部工具栏及顶部工具栏和Fragment配合使用demo 博客分类： android androidfragment自定义底部工具栏自定义顶部工具栏 

  • 自定义底部工具栏及顶部工具栏和Fragment配合使用demo 博客分类： android androidfragment自定义底部工具栏自定义顶部工具栏 
  • 大小: 32.6 KB
  • 自定义底部工具栏及顶部工具栏和Fragment配合使用demo 博客分类： android androidfragment自定义底部工具栏自定义顶部工具栏 
  • 大小: 35.4 KB
相关标签： android fragment 自定义底部工具栏 自定义顶部工具栏

上一篇： Ubuntu智能手机操作系统：内置云计算服务

下一篇： 2021京东全民炸年兽活动如何集爆竹?

推荐阅读