android自定义控件---添加表情

android自定义控件---添加表情

一、定义layout文件，图片不提供了

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="bottom"
    android:padding="0dp"
    android:orientation="vertical" >
    
    
     <android.support.v4.view.ViewPager
              android:id="@+id/viewpager"
              android:layout_width="fill_parent"
              android:layout_height="140dip"
              android:layout_gravity="center"
              android:background="#ffffff"/>

        <LinearLayout
            android:id="@+id/page_select"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ddd"
            android:gravity="center_horizontal" >

            <ImageView
                android:id="@+id/page0_select"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="matrix"
                android:src="@drawable/page_focused" />

            <ImageView
                android:id="@+id/page1_select"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:scaleType="matrix"
                android:src="@drawable/page_unfocused" />

            <ImageView
                android:id="@+id/page2_select"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:scaleType="matrix"
                android:src="@drawable/page_unfocused" />
        </LinearLayout>
    <!-- 表情 -->
    
     <LinearLayout
            android:id="@+id/page_select_gif"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#aaa"
            android:gravity="left">

            <ImageView
                android:id="@+id/page_normal_select"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="matrix"
                android:src="@drawable/icon_smile"
                android:layout_marginLeft="10dp" />

            <ImageView
                android:id="@+id/page_gif_select"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:scaleType="matrix"
                android:src="@drawable/icon_pic" />
        </LinearLayout>
</LinearLayout>

java类：

public class ExpressionView extends LinearLayout {
	// 表情
//	private Activity activity;
	private EditText msgEditText;
	private ViewPager viewPager;
	private ArrayList<GridView> grids;
	private int[] expressionImages;
	private String[] expressionImageNames;
	private int[] expressionImages1;
	private String[] expressionImageNames1;
	private int[] expressionImages2;
	private String[] expressionImageNames2;
	private ImageView page0;
	private ImageView page1;
	private ImageView page2;
	private GridView gView1;
	private GridView gView2;
	private GridView gView3;

	@SuppressLint("NewApi")
	public ExpressionView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init(context);
	}

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

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

	private void init(Context context) {
		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		inflater.inflate(R.layout.expression_view, this);

		page0 = (ImageView) findViewById(R.id.page0_select);
		page1 = (ImageView) findViewById(R.id.page1_select);
		page2 = (ImageView) findViewById(R.id.page2_select);
		// 引入表情
		expressionImages = Expressions.expressionImgs;
		expressionImageNames = Expressions.expressionImgNames;
		expressionImages1 = Expressions.expressionImgs1;
		expressionImageNames1 = Expressions.expressionImgNames1;
		expressionImages2 = Expressions.expressionImgs2;
		expressionImageNames2 = Expressions.expressionImgNames2;
		// 创建ViewPager
		viewPager = (ViewPager) findViewById(R.id.viewpager);
		initViewPager();
	}

	public void setEditText(EditText msgEditText){
		this.msgEditText = msgEditText;
	}

	// 表情
	private void initViewPager() {
		LayoutInflater inflater = LayoutInflater.from(getContext());
		grids = new ArrayList<GridView>();
		gView1 = (GridView) inflater.inflate(R.layout.grid1, null);

		setPage(page0, gView1, expressionImages, expressionImageNames);
		grids.add(gView1);

		gView2 = (GridView) inflater.inflate(R.layout.grid2, null);
		grids.add(gView2);

		gView3 = (GridView) inflater.inflate(R.layout.grid3, null);
		grids.add(gView3);

		// 填充ViewPager的数据适配器
		PagerAdapter mPagerAdapter = new PagerAdapter() {
			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {
				return arg0 == arg1;
			}

			@Override
			public int getCount() {
				return grids.size();
			}

			@Override
			public void destroyItem(View container, int position, Object object) {
				((ViewPager) container).removeView(grids.get(position));
			}

			@Override
			public Object instantiateItem(View container, int position) {
				((ViewPager) container).addView(grids.get(position));
				return grids.get(position);
			}

			@Override
			public void finishUpdate(View arg0) {
				// TODO Auto-generated method stub

			}

			@Override
			public void restoreState(Parcelable arg0, ClassLoader arg1) {
				// TODO Auto-generated method stub

			}

			@Override
			public Parcelable saveState() {
				// TODO Auto-generated method stub
				return null;
			}

			@Override
			public void startUpdate(View arg0) {
				// TODO Auto-generated method stub

			}

		};
		viewPager.setAdapter(mPagerAdapter);
		viewPager.setOnPageChangeListener(new GuidePageChangeListener());
	}

	// ** 指引页面改监听器 */
	class GuidePageChangeListener implements OnPageChangeListener {

		@Override
		public void onPageScrollStateChanged(int arg0) {
		}

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

		@Override
		public void onPageSelected(int arg0) {
			switch (arg0) {
			case 0:
				page0.setImageDrawable(getResources().getDrawable(
						R.drawable.page_focused));
				page1.setImageDrawable(getResources().getDrawable(
						R.drawable.page_unfocused));
				break;
			case 1:
				setPage(page1, gView2, expressionImages1, expressionImageNames1);
				break;
			case 2:
				setPage(page2, gView3, expressionImages2, expressionImageNames2);
				break;

			}
		}
	}

	public void setPage(ImageView pageFocused, GridView gridView,
			final int[] expressionImages, final String[] expressionImageNames) {
		page0.setImageDrawable(getResources().getDrawable(
				R.drawable.page_unfocused));
		page1.setImageDrawable(getResources().getDrawable(
				R.drawable.page_unfocused));
		page2.setImageDrawable(getResources().getDrawable(
				R.drawable.page_unfocused));
		pageFocused.setImageDrawable(getResources().getDrawable(
				R.drawable.page_focused));
		List<Map<String, Object>> listItems = new ArrayList<Map<String, Object>>();
		// 生成24个表情
		for (int i = 0; i < 24; i++) {
			Map<String, Object> listItem = new HashMap<String, Object>();
			listItem.put("image", expressionImages[i]);
			listItems.add(listItem);
		}

		SimpleAdapter simpleAdapter1 = new SimpleAdapter(getContext(), listItems,
				R.layout.singleexpression, new String[] { "image" },
				new int[] { R.id.image });
		gridView.setAdapter(simpleAdapter1);
		gridView.setOnItemClickListener(new OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
					long arg3) {
				Bitmap bitmap = null;
				bitmap = BitmapFactory.decodeResource(getResources(),
						expressionImages[arg2 % expressionImages.length]);
				ImageSpan imageSpan = new ImageSpan(getContext(), bitmap);
				SpannableString spannableString = new SpannableString(
						expressionImageNames[arg2]);
				spannableString.setSpan(imageSpan, 0,
						expressionImageNames[arg2].length(),
						Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
				// 编辑框设置数据
				msgEditText.append(spannableString);
			}
		});
	}

}

使用方法：

在要使用的activitiy的布局文件中加入：

 <****.ExpressionView
		        android:id="@+id/expression_view"
		        android:layout_width="fill_parent"
		        android:layout_height="wrap_content"
                android:visibility="gone" />

在activity的java文件中：

ExpressionView expressionView = (ExpressionView) findViewById(R.id.expression_view);

expressionView.setEditText(msgEditText);

要弹表情时

expressionView.setVisibility(View.VISIBLE);

表情类：  表情资源自己找，命名格式   f000-f071共三页，3*9=27每页

public class Expressions {

	public static int[] expressionImgs = new int[] { R.drawable.f000,
			R.drawable.f001, R.drawable.f002, R.drawable.f003, R.drawable.f004,
			R.drawable.f005, R.drawable.f006, R.drawable.f007, R.drawable.f008,
			R.drawable.f009, R.drawable.f010, R.drawable.f011, R.drawable.f012,
			R.drawable.f013, R.drawable.f014, R.drawable.f015, R.drawable.f016,
			R.drawable.f017, R.drawable.f018, R.drawable.f019, R.drawable.f020,
			R.drawable.f021, R.drawable.f022, R.drawable.f023 };

	/**
	 * 本地表情的名字1
	 */
	public static String[] expressionImgNames = new String[] { "[/f000]",
			"[/f001]", "[/f002]", "[/f003]", "[/f004]", "[/f005]", "[/f006]",
			"[/f007]", "[/f008]", "[/f009]", "[/f010]", "[/f011]", "[/f012]",
			"[/f013]", "[/f014]", "[/f015]", "[/f016]", "[/f017]", "[/f018]",
			"[/f019]", "[/f020]", "[/f021]", "[/f022]", "[/f023]" };
	
	
	
	public static int[] expressionImgs1 = new int[] { R.drawable.f024,
		R.drawable.f025, R.drawable.f026, R.drawable.f027, R.drawable.f028,
		R.drawable.f029, R.drawable.f030, R.drawable.f031, R.drawable.f032,
		R.drawable.f033, R.drawable.f034, R.drawable.f035, R.drawable.f036,
		R.drawable.f037, R.drawable.f038, R.drawable.f039, R.drawable.f040,
		R.drawable.f041, R.drawable.f042, R.drawable.f043, R.drawable.f044,
		R.drawable.f045, R.drawable.f046, R.drawable.f047 };
	
	/**
	 * 本地表情的名字2
	 */
	public static String[] expressionImgNames1 = new String[] { "[/f024]",
		"[/f025]", "[/f026]", "[/f027]", "[/f028]", "[/f029]", "[/f030]",
		"[/f031]", "[/f032]", "[/f033]", "[/f034]", "[/f035]", "[/f036]",
		"[/f037]", "[/f038]", "[/f039]", "[/f040]", "[/f041]", "[/f042]",
		"[/f043]", "[/f044]", "[/f045]", "[/f046]", "[/f047]" };
	
	
	
	
	public static int[] expressionImgs2 = new int[] { R.drawable.f048,
		R.drawable.f049, R.drawable.f050, R.drawable.f051, R.drawable.f052,
		R.drawable.f053, R.drawable.f054, R.drawable.f055, R.drawable.f056,
		R.drawable.f057, R.drawable.f058, R.drawable.f059, R.drawable.f060,
		R.drawable.f061, R.drawable.f062, R.drawable.f063, R.drawable.f064,
		R.drawable.f065, R.drawable.f066, R.drawable.f067, R.drawable.f068,
		R.drawable.f069, R.drawable.f070, R.drawable.f071 };
	
	/**
	 * 本地表情的名字3
	 */
	public static String[] expressionImgNames2 = new String[] { "[/f048]",
		"[/f049]", "[/f050]", "[/f051]", "[/f052]", "[/f053]", "[/f054]",
		"[/f055]", "[/f056]", "[/f057]", "[/f058]", "[/f059]", "[/f060]",
		"[/f061]", "[/f062]", "[/f063]", "[/f064]", "[/f065]", "[/f066]",
		"[/f067]", "[/f068]", "[/f069]", "[/f070]", "[/f071]" };

}

有不懂的可以留言