仿照QQ的左右滑动切换界面的效果

最新推荐文章于 2018-03-28 14:41:01 发布

读书与远方

最新推荐文章于 2018-03-28 14:41:01 发布

阅读量2.3k

点赞数

分类专栏： Android

本文链接：https://blog.csdn.net/yingchunhua365/article/details/17506329

版权

Android 专栏收录该内容

198 篇文章 2 订阅

订阅专栏

模仿QQ的左右滑动切换界面的效果

暑假第四十天，在南阳，天气好闷热，幸亏下午下了一场好雨，嗯，爽啊！嘿嘿，最近四十天天宅在地下室看电脑，我的眼睛最近都有点不舒服了，哎，无语中......今天没事就来写点东西，因为功能还没有完全实现，所以效果不是太好，不过呢，还是能实现，左右滑动时候切换界面和显示QQ好友列表的简单功能！！好了，废话不多说了看看实现的过程吧！

1.首先看看布局

主布局main.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:orientation="vertical" >

    <HorizontalScrollView
        android:id="@+id/horizontalscrollview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/item"
        android:fadingEdge="@null"
        android:scrollbars="none" >

        <LinearLayout
            android:id="@+id/linearlayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            >
        </LinearLayout>
    </HorizontalScrollView>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpaper"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" >
    </android.support.v4.view.ViewPager>

</LinearLayout>

2,接着看看QQonline.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:orientation="vertical" 
    android:background="@drawable/image2">

    
<ExpandableListView 
    android:id="@+id/elistview"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="5dp"
   
    
    />

</LinearLayout>

3.接着看看主活动的实现过程ViewPaper1Activity.java

package com.wang;

import java.util.ArrayList;

import android.app.ActivityGroup;
import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.Gravity;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.view.View.OnClickListener;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.LinearLayout.LayoutParams;

public class ViewPaper1Activity extends ActivityGroup implements
		OnClickListener {
	private RadioGroup radioGroup;

	private String array[] = { "QQ空间", "QQ", "QQ消息" };
	private LinearLayout linearLayout;
	private ArrayList<TextView> textViews;
	private ViewPager viewPager;
	private ArrayList<View> pageViews;
	private HorizontalScrollView horizontalScrollView;

	/***
	 *初始化视图
	 * 
	 * 
	 */
	void InItView() {
		// 构造一个新的ArrayList实例对象
		pageViews = new ArrayList<View>();
		/**
		 * 　　开始一个新的活动中运行的组织。 每一个活动你开始必须有一个独一无二的字符串标识与其相关联
		 * **/
		View view1 = getLocalActivityManager().startActivity("main1",
				new Intent(this, main1.class)).getDecorView();
		View view2 = getLocalActivityManager().startActivity("main2",
				new Intent(this, QQonline.class)).getDecorView();
		View view3 = getLocalActivityManager().startActivity("main3",
				new Intent(this, main3.class)).getDecorView();
		// 添加指定的对象在文章末尾的ArrayList。
		pageViews.add(view1);
		pageViews.add(view2);
		pageViews.add(view3);
	}

	/***
	 * 初始化话标题栏
	 */
	void InItTitle() {
		// 获取窗口管理器显示自定义窗口,去掉默认显示对象。得到1/3屏幕宽度
		int width = getWindowManager().getDefaultDisplay().getWidth() / 3;

		for (int i = 0; i < array.length; i++) {
			// 声明一个radioButton对象
			RadioButton radioButton = new RadioButton(this, null);
			radioButton.setText(array[i]);
			radioButton.setWidth(width);
			radioButton.setHeight(70);
			// 集水平对齐文本和垂直重力的时候将会使用有额外的空间在TextView超出要求的文本本身
			radioButton.setGravity(Gravity.CENTER);
			// 添加子视图。如果没有布局参数对孩子已经设置,默认参数对于这个ViewGroup上设置的孩子。
			radioGroup.addView(radioButton);
		}
	}

	/***
	 * 初始化文本
	 */
	void initTextView() {
		// 声明一个ArrayList对象
		textViews = new ArrayList<TextView>();
		// 获取窗口管理器显示自定义窗口,去掉默认显示对象。得到1/3屏幕宽度
		int width = getWindowManager().getDefaultDisplay().getWidth() / 3;
		int height = 60;
		for (int i = 0; i < array.length; i++) {
			TextView textView = new TextView(this);
			textView.setText(array[i]);
			textView.setTextSize(17);
			textView.setWidth(width);
			textView.setHeight(height - 30);
			textView.setGravity(Gravity.CENTER);
			textView.setId(i);
			// 设置文本的监听事件
			textView.setOnClickListener(this);
			textViews.add(textView);
			LinearLayout.LayoutParams layoutParams = new LayoutParams(
					LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
			layoutParams.width = 1;
			layoutParams.height = height - 40;
			layoutParams.gravity = Gravity.CENTER;
			// 添加子视图。如果没有布局参数对孩子已经设置,默认参数对于这个ViewGroup上设置的孩子。
			linearLayout.addView(textView);

		}
	}

	/***
	 * 选中后的处理
	 */
	public void select(int id) {
		for (int i = 0; i < array.length; i++) {
			if (id == i) {
				// 得到图片的资源
				Bitmap bitmap = BitmapFactory.decodeResource(getResources(),
						R.drawable.itembg);
				// 设置背景图
				textViews.get(id).setBackgroundDrawable(
						new BitmapDrawable(bitmap));
				viewPager.setCurrentItem(i);
			}

			else {
				textViews.get(i).setBackgroundDrawable(new BitmapDrawable());
			}
		}
	}

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		// 去除标题栏
		this.requestWindowFeature(Window.FEATURE_NO_TITLE);
		// 取消状态栏，充满全屏
		this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);

		setContentView(R.layout.main);
		// 实例化组件
		linearLayout = (LinearLayout) findViewById(R.id.linearlayout);
		viewPager = (ViewPager) findViewById(R.id.viewpaper);
		horizontalScrollView = (HorizontalScrollView) findViewById(R.id.horizontalscrollview);
		// 调用方法实现
		initTextView();
		select(0);
		InItView();

		viewPager.setAdapter(new PagerAdapter() {
			// 得到数目
			public int getCount() {
				return pageViews.size();
			}

			@Override
			public boolean isViewFromObject(View view, Object object) {
				return view == object;
			}

			@Override
			public int getItemPosition(Object object) {
				// TODO Auto-generated method stub
				return super.getItemPosition(object);
			}

			@Override
			public void destroyItem(View view, int id, Object arg2) {
				// TODO Auto-generated method stub
				((ViewPager) view).removeView(pageViews.get(id));
			}

			// 获取每一个item的id
			@Override
			public Object instantiateItem(View view, int id) {
				((ViewPager) view).addView(pageViews.get(id));
				return pageViews.get(id);
			}

		});
		// 页面改变时候的监听事件
		viewPager.setOnPageChangeListener(new OnPageChangeListener() {

			@Override
			public void onPageSelected(int arg0) {
				select(arg0);
			}

			@Override
			public void onPageScrolled(int arg0, float arg1, int arg2) {

			}

			@Override
			public void onPageScrollStateChanged(int arg0) {

			}
		});
	}

	@Override
	public void onClick(View v) {
		select(v.getId());
	}

}

4.接着看看QQonline.java 的实现

package com.wang;

import android.app.Activity;
import android.os.Bundle;
import android.view.ContextMenu;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.view.ContextMenu.ContextMenuInfo;
import android.widget.ExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.Toast;
import android.widget.ExpandableListView.OnChildClickListener;
import android.widget.ExpandableListView.OnGroupClickListener;
import android.widget.ExpandableListView.OnGroupCollapseListener;
import android.widget.ExpandableListView.OnGroupExpandListener;

public class QQonline extends Activity {
	// 创建一个上下文菜单的方法
	public void onCreateContextMenu(ContextMenu menu, View v,
			ContextMenuInfo menuInfo) {

		super.onCreateContextMenu(menu, v, menuInfo);

		// 一个垂直滚动的两级列表。取得菜单项
		ExpandableListView.ExpandableListContextMenuInfo info = (ExpandableListView.ExpandableListContextMenuInfo) menuInfo;
		// 获得这个类型 的位置
		int type = ExpandableListView
				.getPackedPositionType(info.packedPosition);
		// 取得所在组的索引
		int group = ExpandableListView
				.getPackedPositionGroup(info.packedPosition);
		// 取得子菜单的索引
		int child = ExpandableListView
				.getPackedPositionGroup(info.packedPosition);

		Toast.makeText(QQonline.this,
				"类型 =" + type + "  分组：" + group + "  子选项：" + child,
				Toast.LENGTH_LONG).show();

	}

	private ExpandableListView eListView = null;
	private ExpandableListAdapter adapter = null;

	@Override
	public void onCreate(Bundle savedInstanceState) {

		// 去除标题,
		this.requestWindowFeature(Window.FEATURE_NO_TITLE);
		// 取消状态栏，充满全屏
		this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);

		super.onCreate(savedInstanceState);
		super.setContentView(R.layout.qqonline);

		// 实例化组件
		this.eListView = (ExpandableListView) findViewById(R.id.elistview);

		// 声明一个adapter对象
		adapter = new myExpendableadapler(this);
		// 设置适配器提供了数据
		this.eListView.setAdapter(this.adapter);

		// 　注册一个上下文菜单显示给定的视图(多个视图可以显示上下文菜单)。
		super.registerForContextMenu(this.eListView);

		// 设置点击时候触发的事件 1，子选项点击事件 2。父选项单击事件 3.分组打开事件 4.分组关闭事件
		this.eListView.setOnChildClickListener(new ChildClickListener());
		this.eListView.setOnGroupClickListener(new GroupClickListener());
		this.eListView.setOnGroupExpandListener(new GroupExpandListener());
		this.eListView.setOnGroupCollapseListener(new GroupCollapseListener());

	}

	// /1，子选项点击事件
	private class ChildClickListener implements OnChildClickListener {

		public boolean onChildClick(ExpandableListView parent, View v,
				int groupPosition, int childPosition, long id) {
			Toast
					.makeText(
							QQonline.this,
							"子选项被选中,所的组：" + groupPosition + "  子选项的位置："
									+ childPosition, Toast.LENGTH_LONG).show();
			return false;
		}

	}

	// 2。父选项单击事件
	private class GroupClickListener implements OnGroupClickListener {

		public boolean onGroupClick(ExpandableListView parent, View v,
				int groupPosition, long id) {
			Toast.makeText(QQonline.this, "分组选项被选中,所在组： " + groupPosition,
					Toast.LENGTH_LONG).show();
			return false;
		}

	}

	// 3.分组打开事件
	private class GroupExpandListener implements OnGroupExpandListener {

		public void onGroupExpand(int groupPosition) {
			// TODO Auto-generated method stub
			Toast.makeText(QQonline.this, "打开分组,所在组：" + groupPosition,
					Toast.LENGTH_LONG).show();
		}

	}

	// 4.分组关闭事件
	private class GroupCollapseListener implements OnGroupCollapseListener {

		public void onGroupCollapse(int groupPosition) {
			Toast.makeText(QQonline.this, "关闭分组,所在组：" + groupPosition,
					Toast.LENGTH_LONG).show();
		}

	}

}

5.接着需要myExpendableadapler.java

package com.wang;

import android.content.Context;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.BaseExpandableListAdapter;
import android.widget.TextView;

public class myExpendableadapler extends BaseExpandableListAdapter {
	// 组名称
	private String[] group = new String[] { "在线好友", "高中同学", "南阳理工同学", "寝室哥们" };
	// 子选项的名字
	private String[][] child = new String[][] {
			{ "李彦宏", "马云", "雷军", "周鸿祎", "唐骏", "赵威威", "李冕", "马海刚", "李斌", "刘洪刚",
					"马玉龙", "刘慧敏", "王文龙" },
			{ "赵威威", "李冕", "马海刚", "李斌", "刘洪刚", "马玉龙", "刘慧敏", "王文龙" },
			{ "张紫阳", "王亚光", "刘一鸣", "崔芳芳", "董卫杰", "刘永乐" },
			{ "武云册", "王俊伟", "王杰", "付永振", "杜新峰", "应志超" } };
	private Context context = null;

	// 构造函数
	public myExpendableadapler(Context context) {

		this.context = context;
	}

	public Object getChild(int groupPosition, int childPosition) {

		return this.child[groupPosition][childPosition];
	}

	public long getChildId(int groupPosition, int childPosition) {

		return childPosition;
	}

	private TextView buildTextView() {
		// LayoutParams AbsListView扩展提供一个位置来保存视图类型。
		AbsListView.LayoutParams params = new AbsListView.LayoutParams(
				ViewGroup.LayoutParams.FILL_PARENT, 40);

		TextView textView = new TextView(this.context);
		textView.setLayoutParams(params);
		// 大小
		textView.setTextSize(15.0f);
		textView.setGravity(Gravity.LEFT + 3);
		textView.setPadding(40, 8, 3, 3);
		return textView;
	}

	public View getChildView(int groupPosition, int childPosition,
			boolean isLastChild, View convertView, ViewGroup parent) {
		TextView textView = new TextView(this.context);
		// 得到每组的子选项并转换成字符串
		textView
				.setText(this.getChild(groupPosition, childPosition).toString());

		return textView;
	}

	// 统计子选项的个数
	public int getChildrenCount(int groupPosition) {
		// TODO Auto-generated method stub
		return this.child[groupPosition].length;
	}

	// 得到复选项的位置
	public Object getGroup(int groupPosition) {
		// TODO Auto-generated method stub
		return this.group[groupPosition];
	}

	// 得到复选项的个数
	public int getGroupCount() {
		// TODO Auto-generated method stub
		return this.group.length;
	}

	// 得到复选项的id
	public long getGroupId(int groupPosition) {
		// TODO Auto-generated method stub
		return groupPosition;
	}

	public View getGroupView(int groupPosition, boolean isExpanded,
			View convertView, ViewGroup parent) {
		// TODO Auto-generated method stub
		TextView textView = this.buildTextView();
		textView.setText(this.getGroup(groupPosition).toString());
		return textView;
	}

	// 是否子选项和父选项id是稳定在改变底层数据。
	public boolean hasStableIds() {
		// TODO Auto-generated method stub
		return true;
	}

	// p判断子选项是否可以选择
	public boolean isChildSelectable(int groupPosition, int childPosition) {
		// TODO Auto-generated method stub
		return true;
	}

}

6.有两个界面还没有添加功能main1.java

package com.wang;

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

public class main1 extends Activity {
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main1);
	}

}

7:没有添加功能的main3.java

package com.wang;

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

public class main3 extends Activity {
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main3);
	}

}

8.亲，由于用到Activity，要注意注册哦！！

  <activity android:name=".main1"></activity>
        <activity android:name=".QQonline"></activity>
        <activity android:name=".main3"></activity>

9.最后，还有一个重要的问题，本程序需要第三方jar包的支持，所以呢还需要导入第三方android-support-v4.jar包，不会的可以看我以前的博客

下载地址http://download.csdn.net/download/wjky2014/4467595

10,这样过后就可以看到运行效果咯：第一张和第三张是还没有完善其上面的功能，第二张是模仿QQ在线列表，第四张是左右滑动时候的效果

读书与远方

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
仿照QQ的左右滑动切换界面的效果

模仿QQ的左右滑动切换界面的效果暑假第四十天，在南阳，天气好闷热，幸亏下午下了一场好雨，嗯，爽啊！嘿嘿，最近四十天天宅在地下室看电脑，我的眼睛最近都有点不舒服了，哎，无语中......今天没事就来写点东西，因为功能还没有完全实现，所以效果不是太好，不过呢，还是能实现，左右滑动时候切换界面和显示QQ好友列表的简单功能！！好了，废话不多说了看看实现的过程吧！
复制链接

扫一扫