1、效果图

2、自定义代码:

  1. <span style="font-family:Comic Sans MS;font-size:14px;">public class ImageTextView extends View implements OnClickListener {
  2.  
  3. private Paint mImagePaint;
  4. private Paint mTextPaint;
  5. private int mTextSize=16;
  6. private Bitmap imageBitmap;
  7. private Context context;
  8. private int viewHeight;
  9. private DisplayMetrics displayMetrics;
  10. private int imageTop;
  11. private int textTop;
  12.  
  13. public ImageTextView(Context context) {
  14. super(context);
  15. this.context = context;
  16. init();
  17. }
  18.  
  19. public ImageTextView(Context context, AttributeSet attrs) {
  20. super(context, attrs);
  21. this.context = context;
  22. init();
  23. }
  24.  
  25. public ImageTextView(Context context, AttributeSet attrs, int defStyle) {
  26. super(context, attrs, defStyle);
  27. this.context = context;
  28. init();
  29. }
  30. /**
  31. * 初始化数据
  32. */
  33. private void init() {
  34. displayMetrics = getDisplayMetrics();
  35. mImagePaint = new Paint();
  36. mTextPaint = new Paint();
  37. mTextPaint.setColor(Color.BLACK);
  38. mTextPaint.setTextSize(mTextSize*displayMetrics.density);
  39. //
  40. mTextPaint.setAntiAlias(true); // 打开抗矩齿
  41. imageBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.home);
  42. //设置背景颜色
  43. setBackground(getResources().getDrawable(R.drawable.item_background_selector));
  44. //设置点击事件
  45. setOnClickListener(this);
  46. }
  47.  
  48. @Override
  49. protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  50. super.onMeasure(widthMeasureSpec, heightMeasureSpec);
  51. viewHeight = getHeight();
  52. imageTop = (viewHeight - imageBitmap.getHeight())/2;
  53. //是文字在垂直方向上居中
  54. textTop = (int) ((viewHeight - getFontHeight(mTextPaint))/2-mTextPaint.getFontMetrics().top);
  55. }
  56.  
  57. @Override
  58. protected void onDraw(Canvas canvas) {
  59. super.onDraw(canvas);
  60. canvas.drawBitmap(imageBitmap, 10, imageTop, mImagePaint);
  61. canvas.drawText("打开",imageBitmap.getWidth()+20, textTop, mTextPaint);
  62. }
  63.  
  64. /**
  65. * 获取手机分辨率
  66. * @return
  67. */
  68. public DisplayMetrics getDisplayMetrics() {
  69. DisplayMetrics dm = new DisplayMetrics();
  70. //取得DisplayMetrics对象方法一
  71. dm = context.getApplicationContext().getResources().getDisplayMetrics();
  72. //取得DisplayMetrics对象方法二
  73. // ((Activity)cx).getWindowManager().getDefaultDisplay().getMetrics(dm);
  74. return dm;
  75. }
  76.  
  77. /**
  78. * 获取字体的高度
  79. * @param paint
  80. * @return
  81. */
  82. private int getFontHeight(Paint paint){
  83. FontMetrics fm = paint.getFontMetrics();
  84. return (int)Math.ceil(fm.descent - fm.ascent);
  85. }
  86.  
  87. /**
  88. * 改变字体颜色
  89. */
  90. @Override
  91. public boolean onTouchEvent(MotionEvent event) {
  92. switch (event.getAction()) {
  93. case MotionEvent.ACTION_DOWN:
  94. mTextPaint.setColor(Color.BLUE);
  95. break;
  96. case MotionEvent.ACTION_UP:
  97. mTextPaint.setColor(Color.BLACK);
  98. break;
  99. default:
  100. break;
  101. }
  102. invalidate();
  103. return super.onTouchEvent(event);
  104. }
  105.  
  106. @Override
  107. public void onClick(View v) {
  108.  
  109. }
  110.  
  111. }</span>

3、文字居中参考

http://blog.csdn.net/hursing/article/details/18703599

自定义组件---图片和文字实现ImageButton效果的更多相关文章

  1. 自定义带图片和文字的ImageTextButton

    今天我们来讲一下有关自定义控件的问题,今天讲的这篇是从布局自定义开始的,难度不大,一看就明白,估计有的同学或者开发者看了说,这种方式多此一举,但是小编我不这么认为,多一种解决方式,就多一种举一反三的学 ...

  2. 自定义带图片和文字的Button的排版--陈棚

    自定义button,动态加载图片与文字 [footView addSubview:btnAllChoose]; [btnAllChoose setTitle:str forState:UIContro ...

  3. Android 自定义Android带图片和文字的ImageButton

    经过分析,上述按钮效果实际上就是一个布局,一个最简单不过的垂直线性布局,上部分是一个ImageView,下部分是一个TextView,这个布局可点击.可设置监听. 我们首先要编写自己的ImageBut ...

  4. iOS 自定义UIButton(图片和文字混合)

    // UIApplicationDelegate  .h文件 #import <UIKit/UIKit.h> @interface AppDelegate : UIResponder &l ...

  5. Android自定义组件系列【8】——遮罩文字动画

    遮罩文字的动画我们在Flash中非常常见,作为Android的应用开发者你是否也想将这种动画做到你的应用中去呢?这一篇文章我们来看看如何自定义一个ImageView来实现让一张文字图片实现文字的遮罩闪 ...

  6. Android自定义View 画弧形,文字,并增加动画效果

    一个简单的Android自定义View的demo,画弧形,文字,开启一个多线程更新ui界面,在子线程更新ui是不允许的,但是View提供了方法,让我们来了解下吧. 1.封装一个抽象的View类   B ...

  7. UIButton图片文字控件位置自定义(图片居右文字居左、图片居中文字居中、图片居左文字消失等)

    在开发中经常会碰到需要对按钮中的图片文字位置做调整的需求.第一种方式是通过设置按钮中图片文字的偏移量.通过方法setTitleEdgeInsets和setImageEdgeInsets实现 代码如下: ...

  8. 【Wince-自定义控件】ImageButton 带图片、文字

    1.看图 可以实现MouseDown改变背景颜色或背景图片. 遗憾是没有实现键盘触发按钮事件. 2.选择继承自Control基类 public class ImageButton : Control ...

  9. android 自定义组件-带图片的textView

    1. 定义属性 <?xml version="1.0" encoding="utf-8"?> <resources> <decla ...

随机推荐

  1. linux ubuntu 安装nginx

    参考原文 在Ubuntu下安装Nginx有以下方法,但是如果想要安装最新版本的就必须下载源码包编译安装. 一.基于APT源安装 sudo apt-get install nginx 安装好的文件位置: ...

  2. jQuery bind()与delegate()的区别

    笔试题: bind()与delegate()的区别主要有三点: 1 绑定目标 .bind直接绑在目标元素上 .delegate绑在父元素上 2  监听个数 .bind监听个数多——每个目标元素都需要添 ...

  3. git 学习笔记 Git实践

    网上有很多教程,这里我自己做下整理,省得有时忘记,有道是好记性不如烂博客! 先大概描述下Git的各种命令: git init                     #初始化 git clone   ...

  4. mqtt server搭建和web中使用js-sdk订阅发布消息

    1.mqtt server搭建(From:https://www.cnblogs.com/huhongy/p/7929299.html) window安装MQTT服务器,我这里下载了一个apache- ...

  5. 用一个div模拟textarea并实现高度自适应

    1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...

  6. git忽略相应文件夹,不上传

    1.在项目根目录里  右键选择Git Bash 进入命令行 2. touch .gitignore ,生成“.gitignore”文件. 3.  .gitignore文件里输入以下内容.DS_Stor ...

  7. ARCGIS 10.0破解版安装过程error 1606 和error 1316问题 及安装流程

    来自:http://blog.csdn.net/don_lvsml/article/details/8681100 楼主今天安装ESRI.ArcGIS.10.CS时,由于第一次接触该软件,将其按照一般 ...

  8. 中专生自学Android到找到工作的前前后后

    我是一名中专生,在学校里读的是计算机专业,但是由于学校不好大部分同学都不爱学习来这里几乎大部分都是在混日子的,虽然我中考的成绩不差,但是因为家里穷考虑到以后没钱读大学我毅然来到这里,虽然是中专,但是我 ...

  9. 4类Storage方案(AS开发实战第四章学习笔记)

    4.1 共享参数SharedPreferences SharedPreferences按照key-value对的方式把数据保存在配置文件中,该配置文件符合XML规范,文件路径是/data/data/应 ...

  10. 2 pygraphviz在windows10 64位下的安装问题(反斜杠的血案)

    可以负责任的说,这篇文档是windows10安装pygraphviz中,在中文技术网站中最新的文档,没有之一.是自己完全结合各种问题,包括调试等,总结出来的. 问题来源:主要是可视化RvNN网络的树结 ...