Android学习笔记（四）之碎片化Fragment实现仿人人客户端的侧边栏

最新推荐文章于 2024-06-10 11:51:36 发布
最新推荐文章于 2024-06-10 11:51:36 发布
阅读量1.4w 收藏 25
点赞数 7
分类专栏： Android--View Android--UI设计 android编程笔记 Android--Fragment 文章标签： 人人网 碎片化 侧边栏
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/loongggdroid/article/details/12288379
版权

    其实一种好的UI布局，可以使用户感到更加的亲切与方便。最近非常流行的莫过于侧边栏了，其实我也做过很多侧边栏的应用，但是那些侧边栏的使用我都不是很满意，现在重新整理，重新写了一个相对来说我比较满意的侧边栏，其中运用的就是android3.0版本之后新加的Fragment碎片化，碎片化的使用将来也是一个趋势，所以通过我这个程序你既可以学到侧边栏，也能让你更加熟悉碎片化的使用，一举两得的事。哈哈……废话不多说了，直接上图。图片如下：

①、自定义一个View,把左侧边栏视图，中间内容视图，右侧边栏视图放在里面，这里给这个View起名叫：SlidingMenu.java

代码如下：

package net.loonggg.view;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.RelativeLayout;

public class SlidingMenu extends RelativeLayout {

	private SlidingView mSlidingView;
	private View mMenuView;
	private View mDetailView;

	public SlidingMenu(Context context) {
		super(context);
	}

	public SlidingMenu(Context context, AttributeSet attrs) {
		super(context, attrs);
	}

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

	public void addViews(View left, View center, View right) {
		setLeftView(left);
		setRightView(right);
		setCenterView(center);
	}

	/**
	 * 添加左侧边栏的view
	 * 
	 * @param view
	 */
	@SuppressWarnings("deprecation")
	public void setLeftView(View view) {
		LayoutParams behindParams = new LayoutParams(LayoutParams.WRAP_CONTENT,
				LayoutParams.FILL_PARENT);
		behindParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);// 在父控件的左边
		addView(view, behindParams);
		mMenuView = view;
	}

	/**
	 * 添加右侧边栏的view
	 * 
	 * @param view
	 */
	@SuppressWarnings("deprecation")
	public void setRightView(View view) {
		LayoutParams behindParams = new LayoutParams(LayoutParams.WRAP_CONTENT,
				LayoutParams.FILL_PARENT);
		behindParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);// 在父控件的右边
		addView(view, behindParams);
		mDetailView = view;
	}

	/**
	 * 添加中间内容的view
	 * 
	 * @param view
	 */
	@SuppressWarnings("deprecation")
	public void setCenterView(View view) {
		LayoutParams aboveParams = new LayoutParams(LayoutParams.FILL_PARENT,
				LayoutParams.FILL_PARENT);
		mSlidingView = new SlidingView(getContext());
		mSlidingView.setView(view);
		addView(mSlidingView, aboveParams);
		mSlidingView.setMenuView(mMenuView);
		mSlidingView.setDetailView(mDetailView);
		mSlidingView.invalidate();
	}

	public void showLeftView() {
		mSlidingView.showLeftView();
	}

	public void showRightView() {
		mSlidingView.showRightView();
	}
}

②、通过一个中间的View,去控制左右侧边栏的滑进与滑出，这个也是自定义的一个View,名字叫：SlidingView.java

代码如下：

package net.loonggg.view;

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.VelocityTracker;
import android.view.View;
import android.view.ViewConfiguration;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.Scroller;

public class SlidingView extends ViewGroup {

	private FrameLayout mContainer;
	private Scroller mScroller;
	private VelocityTracker mVelocityTracker;
	private int mTouchSlop;
	private float mLastMotionX;
	private float mLastMotionY;
	private static final int SNAP_VELOCITY = 1000;
	private View mMenuView;
	private View mDetailView;

	public SlidingView(Context context) {
		super(context);
		init();
	}

	public SlidingView(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}

	public SlidingView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		mContainer.measure(widthMeasureSpec, heightMeasureSpec);
	}

	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		final int width = r - l;
		final int height = b - t;
		mContainer.layout(0, 0, width, height);
	}

	private void init() {
		mContainer = new FrameLayout(getContext());
		mContainer.setBackgroundColor(0xff000000);
		mScroller = new Scroller(getContext());
		mTouchSlop = ViewConfiguration.get(getContext()).getScaledTouchSlop();
		super.addView(mContainer);
	}

	public void setView(View v) {
		if (mContainer.getChildCount() > 0) {
			mContainer.removeAllViews();
		}
		mContainer.addView(v);
	}

	@Override
	public void scrollTo(int x, int y) {
		super.scrollTo(x, y);
		postInvalidate();
	}

	@Override
	public void computeScroll() {
		if (!mScroller.isFinished()) {
			if (mScroller.computeScrollOffset()) {
				int oldX = getScrollX();
				int oldY = getScrollY();
				int x = mScroller.getCurrX();
				int y = mScroller.getCurrY();
				if (oldX != x || oldY != y) {
					scrollTo(x, y);
				}
				// Keep on drawing until the animation has finished.
				invalidate();
			} else {
				clearChildrenCache();
			}
		} else {
			clearChildrenCache();
		}
	}

	private boolean mIsBeingDragged;

	@Override
	public boolean onInterceptTouchEvent(MotionEvent ev) {

		final int action = ev.getAction();
		final float x = ev.getX();
		final float y = ev.getY();

		switch (action) {
		case MotionEvent.ACTION_DOWN:
			mLastMotionX = x;
			mLastMotionY = y;
			mIsBeingDragged = false;
			break;

		case MotionEvent.ACTION_MOVE:
			final float dx = x - mLastMotionX;
			final float xDiff = Math.abs(dx);
			final float yDiff = Math.abs(y - mLastMotionY);
			if (xDiff > mTouchSlop && xDiff > yDiff) {
				mIsBeingDragged = true;
				mLastMotionX = x;
			}
			break;

		}
		return mIsBeingDragged;
	}

	@Override
	public boolean onTouchEvent(MotionEvent ev) {

		if (mVelocityTracker == null) {
			mVelocityTracker = VelocityTracker.obtain();
		}
		mVelocityTracker.addMovement(ev);

		final int action = ev.getAction();
		final float x = ev.getX();
		final float y = ev.getY();

		switch (action) {
		case MotionEvent.ACTION_DOWN:
			if (!mScroller.isFinished()) {
				mScroller.abortAnimation();
			}
			mLastMotionX = x;
			mLastMotionY = y;
			if (getScrollX() == -getMenuViewWidth()
					&& mLastMotionX < getMenuViewWidth()) {
				return false;
			}

			if (getScrollX() == getDetailViewWidth()
					&& mLastMotionX > getMenuViewWidth()) {
				return false;
			}

			break;
		case MotionEvent.ACTION_MOVE:
			if (mIsBeingDragged) {
				enableChildrenCache();
				final float deltaX = mLastMotionX - x;
				mLastMotionX = x;
				float oldScrollX = getScrollX();
				float scrollX = oldScrollX + deltaX;

				if (deltaX < 0 && oldScrollX < 0) { // left view
					final float leftBound = 0;
					final float rightBound = -getMenuViewWidth();
					if (scrollX > leftBound) {
						scrollX = leftBound;
					} else if (scrollX < rightBound) {
						scrollX = rightBound;
					}
					// mDetailView.setVisibility(View.INVISIBLE);
					// mMenuView.setVisibility(View.VISIBLE);
				} else if (deltaX > 0 && oldScrollX > 0) { // right view
					final float rightBound = getDetailViewWidth();
					final float leftBound = 0;
					if (scrollX < leftBound) {
						scrollX = leftBound;
					} else if (scrollX > rightBound) {
						scrollX = rightBound;
					}
					// mDetailView.setVisibility(View.VISIBLE);
					// mMenuView.setVisibility(View.INVISIBLE);
				}

				scrollTo((int) scrollX, getScrollY());

			}
			break;
		case MotionEvent.ACTION_CANCEL:
		case MotionEvent.ACTION_UP:
			if (mIsBeingDragged) {
				final VelocityTracker velocityTracker = mVelocityTracker;
				velocityTracker.computeCurrentVelocity(1000);
				int velocityX = (int) velocityTracker.getXVelocity();
				velocityX = 0;
				Log.e("ad", "velocityX == " + velocityX);
				int oldScrollX = getScrollX();
				int dx = 0;
				if (oldScrollX < 0) {
					if (oldScrollX < -getMenuViewWidth() / 2
							|| velocityX > SNAP_VELOCITY) {
						dx = -getMenuViewWidth() - oldScrollX;
					} else if (oldScrollX >= -getMenuViewWidth() / 2
							|| velocityX < -SNAP_VELOCITY) {
						dx = -oldScrollX;
					}
				} else {
					if (oldScrollX > getDetailViewWidth() / 2
							|| velocityX < -SNAP_VELOCITY) {
						dx = getDetailViewWidth() - oldScrollX;
					} else if (oldScrollX <= getDetailViewWidth() / 2
							|| velocityX > SNAP_VELOCITY) {
						dx = -oldScrollX;
					}
				}

				smoothScrollTo(dx);
				clearChildrenCache();

			}

			break;

		}
		if (mVelocityTracker != null) {
			mVelocityTracker.recycle();
			mVelocityTracker = null;
		}

		return true;
	}

	private int getMenuViewWidth() {
		if (mMenuView == null) {
			return 0;
		}
		return mMenuView.getWidth();
	}

	private int getDetailViewWidth() {
		if (mDetailView == null) {
			return 0;
		}
		return mDetailView.getWidth();
	}

	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
	}

	public View getDetailView() {
		return mDetailView;
	}

	public void setDetailView(View mDetailView) {
		this.mDetailView = mDetailView;
	}

	public View getMenuView() {
		return mMenuView;
	}

	public void setMenuView(View mMenuView) {
		this.mMenuView = mMenuView;
	}

	// void toggle() {
	// int menuWidth = mMenuView.getWidth();
	// int oldScrollX = getScrollX();
	// if (oldScrollX == 0) {
	// smoothScrollTo(-menuWidth);
	// } else if (oldScrollX == -menuWidth) {
	// smoothScrollTo(menuWidth);
	// }
	// }

	/**
	 * 左侧边栏的关闭与显示
	 */
	public void showLeftView() {
		int menuWidth = mMenuView.getWidth();
		int oldScrollX = getScrollX();
		if (oldScrollX == 0) {
			smoothScrollTo(-menuWidth);
		} else if (oldScrollX == -menuWidth) {
			smoothScrollTo(menuWidth);
		}
	}

	/**
	 * 右侧边栏的关闭与显示
	 */
	public void showRightView() {
		int menuWidth = mDetailView.getWidth();
		int oldScrollX = getScrollX();
		if (oldScrollX == 0) {
			smoothScrollTo(menuWidth);
		} else if (oldScrollX == menuWidth) {
			smoothScrollTo(-menuWidth);
		}
	}

	void smoothScrollTo(int dx) {
		int duration = 500;
		int oldScrollX = getScrollX();
		mScroller.startScroll(oldScrollX, getScrollY(), dx, getScrollY(),
				duration);
		invalidate();
	}

	void enableChildrenCache() {
		final int count = getChildCount();
		for (int i = 0; i < count; i++) {
			final View layout = (View) getChildAt(i);
			layout.setDrawingCacheEnabled(true);
		}
	}

	void clearChildrenCache() {
		final int count = getChildCount();
		for (int i = 0; i < count; i++) {
			final View layout = (View) getChildAt(i);
			layout.setDrawingCacheEnabled(false);
		}
	}

}

③、在MainActivity的布局文件中，引用咱们自定义的侧边栏View,MainActivity的布局文件代码如下：activity_main.xml: 

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

④、MainActivity继承碎片化FragmentActivity，其代码如下: 

package net.loonggg.fragment;

import net.loonggg.view.SlidingMenu;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.View;
import android.view.Window;

public class MainActivity extends FragmentActivity {
	private SlidingMenu mSlidingMenu;// 侧边栏的view
	private LeftFragment leftFragment; // 左侧边栏的碎片化view
	private RightFragment rightFragment; // 右侧边栏的碎片化view
	private SampleListFragment centerFragment;// 中间内容碎片化的view
	private FragmentTransaction ft; // 碎片化管理的事务

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		// 去标题栏
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);
		mSlidingMenu = (SlidingMenu) findViewById(R.id.slidingMenu);
		mSlidingMenu.setLeftView(getLayoutInflater().inflate(
				R.layout.left_frame, null));
		mSlidingMenu.setRightView(getLayoutInflater().inflate(
				R.layout.right_frame, null));
		mSlidingMenu.setCenterView(getLayoutInflater().inflate(
				R.layout.center_frame, null));

		ft = this.getSupportFragmentManager().beginTransaction();
		leftFragment = new LeftFragment();
		rightFragment = new RightFragment();
		ft.replace(R.id.left_frame, leftFragment);
		ft.replace(R.id.right_frame, rightFragment);

		centerFragment = new SampleListFragment();
		ft.replace(R.id.center_frame, centerFragment);
		ft.commit();

	}

	public void llronclick(View v) {
		switch (v.getId()) {
		case R.id.llr_energy_management:

			Intent intent = new Intent(this, DetailsActivity.class);
			startActivity(intent);
			break;

		default:
			break;
		}
	}

	public void showLeft() {
		mSlidingMenu.showLeftView();
	}

	public void showRight() {
		mSlidingMenu.showRightView();
	}

}

⑤、左中右，左侧边栏，中间内容部分，右侧边栏，分别用Fragment代替，呈现出你想要的界面，这里我们只需要写Fragment就可以了，中间部分我们用SampleListFragment代替其中间内容部分，SampleListFragment的代码如下： 

package net.loonggg.fragment;

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

import android.content.Intent;
import android.os.Bundle;
import android.support.v4.app.ListFragment;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.SimpleAdapter;

public class SampleListFragment extends ListFragment {
	private ImageView lv_left;
	private ImageView iv_right;

	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View mView = inflater.inflate(R.layout.list, null);
		lv_left = (ImageView) mView.findViewById(R.id.iv_left);
		iv_right = (ImageView) mView.findViewById(R.id.iv_right);
		return mView;
	}

	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
		Map<String, Object> item1 = new HashMap<String, Object>();
		item1.put("list_title", getString(R.string.title1));
		item1.put("list_image", R.drawable.p1);
		item1.put("list_contect", getString(R.string.test));
		Map<String, Object> item2 = new HashMap<String, Object>();
		item2.put("list_title", getString(R.string.title1));
		item2.put("list_image", R.drawable.p2);
		item2.put("list_contect", getString(R.string.test));
		Map<String, Object> item3 = new HashMap<String, Object>();
		item3.put("list_title", getString(R.string.title1));
		item3.put("list_image", R.drawable.p3);
		item3.put("list_contect", getString(R.string.test));
		Map<String, Object> item4 = new HashMap<String, Object>();
		item4.put("list_title", getString(R.string.title1));
		item4.put("list_image", R.drawable.p4);
		item4.put("list_contect", getString(R.string.test));
		Map<String, Object> item5 = new HashMap<String, Object>();
		item5.put("list_title", getString(R.string.title1));
		item5.put("list_image", R.drawable.p5);
		item5.put("list_contect", getString(R.string.test));
		Map<String, Object> item6 = new HashMap<String, Object>();
		item6.put("list_title", getString(R.string.title1));
		item6.put("list_image", R.drawable.p6);
		item6.put("list_contect", getString(R.string.test));
		Map<String, Object> item7 = new HashMap<String, Object>();
		item7.put("list_title", getString(R.string.title1));
		item7.put("list_image", R.drawable.p7);
		item7.put("list_contect", getString(R.string.test));
		List<Map<String, Object>> data = new ArrayList<Map<String, Object>>();
		data.add(item1);
		data.add(item2);
		data.add(item3);
		data.add(item4);
		data.add(item5);
		data.add(item6);
		data.add(item7);

		String[] from = new String[] { "list_title", "list_image",
				"list_contect" };
		int[] to = new int[] { R.id.list_title, R.id.list_image,
				R.id.list_contect };
		SimpleAdapter adapter = new SimpleAdapter(getActivity(), data,
				R.layout.list_item, from, to);
		setListAdapter(adapter);

		lv_left.setOnClickListener(new OnClickListener() {

			public void onClick(View v) {
				((MainActivity) getActivity()).showLeft();
			}
		});

		iv_right.setOnClickListener(new OnClickListener() {

			public void onClick(View v) {
				((MainActivity) getActivity()).showRight();
			}
		});
	}

	@Override
	public void onListItemClick(ListView l, View v, int position, long id) {
		super.onListItemClick(l, v, position, id);
		Intent intent = new Intent(getActivity(), DetailsActivity.class);
		startActivity(intent);
	}
}
其相应的布局文件代码如下：list.xml: 

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

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/banner_unit"
        android:padding="7dip" >

        <ImageView
            android:id="@+id/iv_left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.1"
            android:clickable="true"
            android:src="@drawable/booklist_menu_normal" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="center_horizontal"
            android:textColor="#000"
            android:layout_weight="0.8"
            android:text="Fragment"
            android:textSize="17dp" />

        <ImageView
            android:id="@+id/iv_right"
             android:clickable="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_weight="0.1"
            android:src="@drawable/back_normal" />
    </LinearLayout>

    <ListView
        android:id="@android:id/list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ListView>

</LinearLayout>

⑥、左侧边栏的View用LeftFragment替代，LeftFragment代码如下： 

package net.loonggg.fragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;

public class LeftFragment extends Fragment {

	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.left_fragment, null);
		LinearLayout userLayout = (LinearLayout) view
				.findViewById(R.id.userLayout);
		userLayout.setOnClickListener(new View.OnClickListener() {

			public void onClick(View v) {
				UserFragment user = new UserFragment();
				FragmentTransaction ft = getActivity()
						.getSupportFragmentManager().beginTransaction();
				ft.replace(R.id.center_frame, user);
				ft.commit();
				((MainActivity) getActivity()).showLeft();
			}
		});

		LinearLayout mainPage = (LinearLayout) view.findViewById(R.id.mainPage);
		mainPage.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				FragmentTransaction ft = getActivity()
						.getSupportFragmentManager().beginTransaction();
				ft.replace(R.id.center_frame, new SampleListFragment());
				ft.commit();
				((MainActivity) getActivity()).showLeft();
			}
		});
		return view;
	}

	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
	}

}

其对应的布局文件代码如下：left_fragment.xml: 

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

    <LinearLayout
        android:id="@+id/mainPage"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/oper_title2"
        android:gravity="center"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="主页"
            android:textColor="#000"
            android:textSize="17dip" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:background="@drawable/booklist_menu_bg_unit2"
        android:orientation="vertical" >

        <LinearLayout
            android:id="@+id/userLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.2"
            android:clickable="true"
            android:orientation="vertical"
            android:padding="5dip" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/booklist_menu_user" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="用户"
                android:textColor="#000" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.2"
            android:clickable="true"
            android:orientation="vertical"
            android:padding="5dip" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/booklist_menu_synchronize" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="收藏"
                android:textColor="#000" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.2"
            android:clickable="true"
            android:orientation="vertical"
            android:padding="5dip" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/booklist_menu_std" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="标准"
                android:textColor="#000" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.2"
            android:clickable="true"
            android:orientation="vertical"
            android:padding="5dip" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/booklist_menu_help" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="帮助"
                android:textColor="#000" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.2"
            android:clickable="true"
            android:orientation="vertical"
            android:padding="5dip" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:src="@drawable/booklist_menu_about" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="关于"
                android:textColor="#000" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

⑦、右侧边栏的View用RightFragment替代，RightFragment代码如下： 

package net.loonggg.fragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class RightFragment extends Fragment {

	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.right_fragment, null);
		return view;
	}

	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);

	}
}

其对应的布局文件代码如下：right_fragment.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="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/oper_title"
        android:gravity="center"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="服   务"
            android:textColor="#000"
            android:textSize="17dip" />
    </LinearLayout>

    <ScrollView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:background="@drawable/booklist_menu_bg_unit" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:padding="5dip" >

            <LinearLayout
                android:id="@+id/llr_energy_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="能源管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_hr_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="人力管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_business_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="商务管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_financial_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="金融管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_purchasing_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="采购管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_supply_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="供应管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <LinearLayout
                android:id="@+id/llr_project_management"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:clickable="true"
                android:onClick="llronclick" >

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:src="@drawable/lxqg" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.8"
                    android:text="项目管理"
                    android:textColor="#000" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="0.1"
                    android:gravity="center"
                    android:src="@drawable/arrow_to_right" />
            </LinearLayout>

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:src="@drawable/line_read_option" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="说明我是宽度自适应的..." />
        </LinearLayout>
    </ScrollView>

</LinearLayout>

⑧、在左侧边栏中有一个点击事件，点击用户，进入用户界面，这里的用户界面也是一个Fragment，点击事件的具体代码在⑥中已经有了，现在我把用户界面的Fragment代码贴出来：UserFragment.java: 

package net.loonggg.fragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

public class UserFragment extends Fragment {
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.user, null);
		ImageView left = (ImageView) view.findViewById(R.id.iv_user_left);
		left.setOnClickListener(new View.OnClickListener() {

			public void onClick(View v) {
				((MainActivity) getActivity()).showLeft();
			}
		});
		return view;
	}

	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);

	}
}

其对应的布局代码如下:user.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:background="#ffffff"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/banner_unit"
        android:padding="7dip" >

        <ImageView
            android:id="@+id/iv_user_left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="0.1"
            android:clickable="true"
            android:src="@drawable/booklist_menu_normal" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="0.8"
            android:gravity="center_horizontal"
            android:text="Fragment"
            android:textColor="#000"
            android:textSize="17dp" />

        <ImageView
            android:id="@+id/iv_right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_weight="0.1"
            android:clickable="true"
            android:src="@drawable/back_normal" />
    </LinearLayout>

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:text="用户管理"
        android:textColor="#000000"
        android:textSize="24sp" />

</LinearLayout>

⑨、其他不重要的代码如下：

DetailsActivity.java：

package net.loonggg.fragment;

import android.app.Activity;
import android.os.Bundle;

public class DetailsActivity extends Activity {

	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.details);

	}
}

其对应的布局文件代码如下：details.xml: 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#fff"
    android:orientation="vertical" >

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:scaleType="fitXY"
        android:src="@drawable/p1" />

</LinearLayout>

还有就是string.xml的代码如下： 

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">碎片化侧边栏</string>
    <string name="action_settings">Settings</string>
    <string name="title1">这种导弹的平均航速为5倍音速</string>
    <string name="title2">这种导弹的平均航速为5倍音速</string>
    <string name="title3">这种导弹的平均航速为5倍音速</string>
    <string name="title4">这种导弹的平均航速为5倍音速</string>
    <string name="title5">这种导弹的平均航速为5倍音速</string>
    <string name="title6">这种导弹的平均航速为5倍音速</string>
    <string name="title7">这种导弹的平均航速为5倍音速</string>
    <string name="test">美国《空军》杂志、西班牙《世界报》等媒体报道，美军计划在今年内多次试射高超音速导弹，从而将其作为威慑中俄的强力武器。有外媒指出，解放军已开发出可拦截高速导弹的防控系统，而且有潜力进一步开发拦截高超音速导弹的防空武器。


美国《空军》杂志报道，美军将在2013年继续试射高超音速巡航导弹，这种导弹的平均航速为5倍音速，最高瞬时航速达到7倍音速。对于目前全球所有的防卫系统来说，它都是无法防御的导弹。美国《防务新闻》更是声称，美军的“高超音速攻击时代”即将来临，目前各国军队尚无能力对这种高速攻击目标进行有效拦截，任何导弹防御系统在它面前都形同虚设。

西班牙《世界报》报道，从2013年3月到12月，美军可能进行3次重要的实验，如果一切顺利，美军可能于2014年尝试装备少量的高超音速导弹，这种导弹有望在未来5年内形成战斗力。

报道认为，美军高超音速导弹所形成的威胁以及对世界格局的影响难以估量。美国可能在一些“敏感区域”部署这种导弹，例如东亚地区，而朝鲜和伊朗的核设施也可能成为它的攻击目标。报道强调，美军高超音速导弹的主要作用是对其他军事大国实施威慑，主要是中国和俄罗斯。

据俄罗斯《军工信使》周刊指出，解放军在防范超音速导弹攻击方面“已经追赶上来”，中国某国防工业公开发的代号为LD-2000的陆基防空系统，已经被证实具备实战能力。这种防空系统可为高价值目标，包括指挥所、弹道导弹发射装置等提供保护。LD-2000防空系统发射的导弹拦截高速飞行的导弹和飞机，尤其擅长对付雷达反射面积较小的隐身巡航导弹及高速巡航导弹。报道揣测，它可以准确拦截飞行速度超过两倍音速的超音速导弹。通过改进其控制软件，该系统还可用来拦截高速火箭弹和迫击炮弹。

报道称，LD-2000系统可加装在军用卡车底盘上，从而实现机动部署，在需要它的地方构建防范超音速导弹的密集导弹阵。这种导弹集群的火力可与美军著名的“密集阵”(专门防御来袭空中目标的防空导弹集群)媲美。

报道称，LD-2000是一款针对出口市场的产品，解放军肯定同步开发了自用型号，而且其性能必然优于LD-2000，应该可以防范速度更快的来袭目标，例如航速达到三四倍音速的巡航导弹。报道认为，这表明解放军有能力开发用来对付美军高超音速导弹的防御系统。</string>

</resources>

到这里就基本完成了。可能你现在没有看懂，我把源码放出来，供大家参考。源代码下载地址如下：

源代码



非著名程序员
关注
专栏目录
Fragment使用—侧边栏
12-02
利用Fragment来实现简单的侧边栏。
Android开发 侧边滑动菜单栏SlidingMenu结合Fragment
weixin_34409741的博客
03-05 222
SlidingMenu是一个开源项目， https://github.com/jfeinstein10/SlidingMenu 。功能是创建侧边滑动菜单栏，效果类似人人Android客户端,可点击按钮或是在屏幕上划动来展开，收缩侧边的菜单。下面是Demo效果图: 简单介绍一下：整个demo由三个Fragment,一个Activity组成，菜单一个Fragment,包含两个按钮，在内容区域...
完美使用fragment+SlidingMenu做出的侧边栏效果
10-12
该侧边栏效果使用了activity嵌套fragment，其继承了SlidingFragmentActivity来实现的，侧边栏效果非常完美。
侧边栏 与 动态加载 fragment
qq_14876513的博客
05-02 374
package com.example.monikaoshi; import android.content.Intent; import android.os.AsyncTask; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.supp...
安卓FragmentTab选项卡相关-基于Fragment实现Tab的切换滑出侧边栏.zip
07-29
基于Fragment实现Tab的切换，滑出侧边栏.zip,太多无法一一验证是否可用，程序如果跑不起来需要自调，部分代码功能进行参考学习。
android模仿人人客户端侧边栏
10-04
以下将详细介绍如何使用碎片（Fragment）实现类似"人人"客户端的侧边栏。 首先，我们需要理解Android中的碎片概念。碎片是Android应用开发中的一个组件，它可以包含用户界面的一部分，可以在不同的屏幕配置中重用。...
Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.zip
11-01
"Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.zip"提供的源码实例，展示了如何利用Android的Fragment和侧滑菜单来实现这种常见的UI模式。让我们详细探讨一下这个主题。 **Fragment介绍** Fragment是...
android 基于Fragment实现Tab的切换，滑出侧边栏Demo.zip
07-03
通过学习并实践这个Demo，开发者可以掌握如何在Android应用中创建具有Tab切换和滑出侧边栏的界面，这在许多应用中都是必备的功能。同时，这也涉及到对Android组件、布局、生命周期以及Material Design规范的理解和...
安卓Android源码——基于Fragment实现Tab的切换，滑出侧边栏.zip
10-11
本项目“安卓Android源码——基于Fragment实现Tab的切换，滑出侧边栏.zip”显然是一个示例，演示了如何使用Fragment来创建一个多标签导航界面，并结合侧滑菜单实现更丰富的用户交互。 1. **Fragment基础**： - ...
Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.zip项目安卓应用源码下载
03-08
Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.zip项目安卓应用源码下载Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.zip项目安卓应用源码下载 1.适合学生毕业设计研究参考 2.适合个人学习...
fragment+侧边栏+tabhost完整例子
01-07
结合最新的android侧边栏SlidingMenu，并在fragment里面实现fragmenttabhost，viewpager菜单导航，轻松实现春雨医生类似的效果，本人亲测成功
Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.rar
12-16
Android应用源码之基于Fragment实现Tab的切换，滑出侧边栏.rar
Android屏幕四分格Fragment（碎片）Demo
09-16
Android屏幕四分格Fragment（碎片）Demo，开发工具：Android Studio
Android使用fragment实现左侧导航
08-28
主要为大家详细介绍了Android使用fragment实现左侧导航，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
基于Fragment实现Tab的切换，滑出侧边栏
10-20
基于Fragment实现Tab的切换，滑出侧边栏源代码，是一个很不错的Android源码，有兴趣的伙伴们抽时间可以看一下把
android界面设计（二）侧边栏的两种实现方式
qq_25066049的博客
11-29 1379
dome：https://github.com/linliangliang/sidebar 一、使用sideingMenu结合fragment实现。 二、使用NavigationView和DrawerLayout实现。 第一种实现方式：https://mp.csdn.net/postedit/84612432 1、下面介绍使用NavigationView，DrawerLayout的方式实现...
Android中activity/fragment分别实现drawerlayout侧边栏布局以及抽屉页面的真正简单实现
最新发布
m0_73893567的博客
06-10 363
*注意：如果你在设置id时它可能会报错代码变红，但是不用管，检查无误后直接运行，报错就会消失，我昨天写的时候遇到了，折磨我好久，以为是文件出了问题，因为在另一个项目的activity却能实现，也没搜出个什么结果来，最后问的老师才知道直接运行就行了，感觉自己像个小丑，还是经验太少。实现过程和activity差不多，开始我还以为需要一些其他的操作，结果是我想多了。第一步：直接在fragment.xml修改成和如上一样的drawerlayout。第二步：java代码，点击事件基础实现代码极少。
android下使用Fragment实现左侧3级菜单+动画效果
上帝派来的逗比
07-18 2509
效果图如下： 点击每层的item 弹出下一层    核心代码如下： MainActivity package com.hsx.view; import com.hsx.fragment.R; import com.hsx.fragments.FirstFragment; import com.hsx.fragments.FirstFragmen
微信小程序实现可滑动的自定义底部导航栏：仿Android Fragment
为了实现更加定制化的用户体验，特别是模拟Android中Fragment的可滑动底部导航栏效果，开发者可以采取自定义的方法。这种方法允许导航栏中的选项可以根据用户的交互动态切换，提高应用的交互性和动态性。下面将详细...
评论 13
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值