自定义View学习之路(四)————图片介绍框

简介:

  走往android的进阶之路,避不开自定义View的学习和绘制。这里以绘制一个可用的图片相框为例。开始系统的学习View的绘制。   麻雀虽小却五脏俱全,不仅要求对绘制居中的处理,还有文字、图片得宽高的处理。涉及知识内容可以说非常实用。 图片介绍框需求:

  • 边框默认红色,宽度为20
  • 图片可铺满,可居中
  • 图片下面是文字介绍。要求居中,长度过长时自定省略部分内容

效果图:

效果图

设计图:

设计图

心得与总结:

  • 在编码前首先规划好几个大的模块,对宽高进行初步测量。会节省大量的时间。在编码过程中突然增加模块,会使得宽高的计算变得混乱。
  • 本案例中运用了两个Rect。分别为文字内容和图片服务。开始不知道,只用了一个,导致坐标混乱。
  • 图片绘制,确定左上坐标和右下坐标。文字绘制只需要一个坐标,android会从这个坐标开始往右上方开始写字。
  • 绘制时需要考虑的一些因素:
    1. 文字的长度过长,需要进行裁剪。
    2. 做居中操作时,需要操作原图片宽高,如果原图片过大,需要单独处理。
    3. 因为边框的存在, 在测量宽高时需要处理边框的宽度。

参考文章:

https://blog.csdn.net/lmj623565791/article/details/24300125

附件:

MyImageView下载地址 若附件无法下载,请复制链接地址,在浏览器重新执行即可!!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏CaiRui

Html再学

1.  Html是网页的载体。内容就是网页制作者放在页面上想要用户浏览的信息,可以包括文字、图片、视频等。 2.  CSS样式是展现。就像网页的外衣。比如,标题...

29660
来自专栏前端知识分享

第123天:移动web开发中的常见问题

准备编辑这段时发现简书上已经有作者写了关于rem布局的介绍,并且他的设置比我所用的更加简洁,贴上地址供大家学习参考。 手机端页面自适应解决方案—rem布局进阶...

18620
来自专栏杨龙飞前端

2017移动前端的一些总结web前端 —— 移动端知识的一些总结一.css部分二.js部分

39440
来自专栏大数据钻研

初识HTML之基础篇

前端认知 ---- 一、公司开发流程 1、 产品需求(产品经理给需求文档) 2、项目设计(视觉设计师给PSD文件,交互设计师配合) 3、前端开发 ...

33040
来自专栏令仔很忙

新手学JavaScript(四)----CheckBox全选与全不选

在这给大家推荐一款比较不错的纯CSS实现的CheckBox–CSSCheckBox,用bootstrap里面自带的checkbox和radio样式不太美观,所...

86110
来自专栏大数据钻研

编写高性能HTML网页应用

你怎么能提高网页性能?   大多数开发者会通过JavaScript和图片来优化,通过服务器配置,压缩文件和合并文件 - 甚至调整CSS(合并小图片)。   可...

35240
来自专栏進无尽的文章

绘图-视图遮罩MaskView的使用

可以这样理解,是将maskView每个point的alpha赋值给View的重叠部分相对应的point,这样view的重叠每个point都有个alpha值了,v...

15720
来自专栏Thinks

【译】W3C WAI-ARIA最佳实践 -- 表单

三态复选框的一种常见使用场景是在软件安装时,一个单独的三态复选框用来代表和控制整个安装选项组的状态。并且,该组中的每个选项都可以单独使用双态复选框开启或关闭。

48930
来自专栏大数据钻研

使用CSS完成元素居中的七种方法

在网页上使 HTML 元素居中看似一件很简单的事情. 至少在某些情况下是这样的,但是复杂的布局往往使一些解决方案不能很好的发挥作用。 在网页布局中元素水平居中...

29340
来自专栏HTML5学堂

如何让旧浏览器支持HTML5新标签

HTML5学堂:开发永远和理论不相同,一旦考虑IE低端浏览器,所有的HTML5新增功能都成了浮云~~~从HTML5新增标签的语义角度来说,是有利于网站SEO的,...

32770

扫码关注云+社区

领取腾讯云代金券