uperTextView-从未如此惊艳!一个超级的TextView
简介
欢迎使用SuperTextView,这篇文档将会向你展示如何使用这个控件来提高你构建项目的效率。
SuperTextView继承自TextView,它能够大量的减少布局的复杂程度,并且使得一些常见的效果变得十分容易实现且高效。同时,它内置了动画驱动,你只需要合理编写Adjuster,然后startAnim()
就可以看到预期的动画效果。它仅仅是一个控件,所以你可以不费吹灰之力的在你的项目中集成使用。
特点
- 你从此不必再为背景图编写和管理大量文件了。
- 重新优化的状态图功能使得你能够精确的控制状态图的大小,以及在SuperTextView中的位置。
- 支持设置圆角,并且能够精确的控制圆角位置。
- 能够轻松的实现控件边框效果。
- 支持文字描边,这使得空心文字效果成为了可能。
- 内置动画驱动,你只需配合Adjuster合理的使用即可。
- Adjuster的出现,使得你对控件的绘制过程具有了掌控权,良好的设计使得它能够完美的实现绝大部分你脑海中的效果。
使用指南
支持的属性
SuperTextView十分方便的支持在xml中直接设置属性,并且你能够立即看到效果。就像你平时使用TextView一样方便。
<SuperTextView
android:layout_width="50dp"
android:layout_height="50dp"
//设置圆角。会同时作用于填充和边框(如果边框存在的话)。
//如果要设置为圆形,只需要把该值设置为宽或长的1/2即可。
app:corner="25dp"
//设置左上角圆角
app:left_top_corner="true"
//设置右上角圆角
app:right_top_corner="true"
//设置左下角圆角
app:left_bottom_corner="true"
//设置右下角圆角
app:right_bottom_corner="true"
//设置填充颜色
app:solid="@color/red"
//设置边框颜色
app:stroke_color="@color/black"
//设置边框的宽度。
app:stroke_width="2dp"
//放置一个drawable在背景层上。默认居中显示。
//并且默认大小为SuperTextView的一半。
app:state_drawable="@drawable/emoji"
//设置drawable的显示模式。可选值如下:
// left、top、right、bottom、center(默认值)、
//leftTop、rightTop、leftBottom、rightBottom、
//fill(充满整个SuperTextView,此时会使设置drawable的大小失效)
app:state_drawable_mode="center"
//设置drawable的height
app:state_drawable_height="30dp"
//设置drawable的width
app:state_drawable_width="30dp"
//设置drawble相对于基础位置左边的距离
app:state_drawable_padding_left="10dp"
//设置drawble相对于基础位置上边的距离
app:state_drawable_padding_top="10dp"
// boolean类型。是否显示drawable。
//如果你想要设置的drawable显示出来,必须设置为true。
//当不想让它显示时,再设置为false即可。
app:isShowState="true"
//是否开启文字描边功能。
//注意,启用这个模式之后通过setTextColor()设置的颜色将会被覆盖。
//你需要通过text_fill_color来设置文字的颜色。
app:text_stroke="true"
// 文字的描边颜色。默认为Color.BLACK。
app:text_stroke_color="@color/black"
// 文字描边的宽度。
app:text_stroke_width="1dp"
// 文字填充的颜色。默认为Color.BLACK。
app:text_fill_color="@color/blue"
// boolean类型。是否启用Adjuster功能。
//具体干什么,需要在Java中为SuperTextView实现一个Adjuster。
//当你启用这个功能而没有实现自己的Adjuster时,
//SuperTextView会启用默认的Adjuster。它会按照一定的规则调整文字大小。
app:autoAdjust="true"
/>
以上这些属性,均可以在Java中进行动态的设置。同时也能够获得它们的值。例如:
mSuperTextView.setCorner(10);
mSuperTextView.getCorner();
圆形和边框
为了实现上图效果,通常你需要编写和管理大量的文件。现在你只需要在xml或代码中对SuperTextView直接进行设置即可。
不简单的圆角
不同于简单的圆角,SuperTextView支持精确的控制圆角的位置。一个、两个、三个都没问题。一切由你掌控。
神奇的文字描边
文字描边从未如此简单!
高效的状态图
不同于原生的Drawable,SuperTextView对于Drawable提供了更多精细化的控制操作。你能够轻松的指定Drawable大小以及位置,只需一个属性就能搞定。
相信你一定深有感触,想要实现上图中的效果,往往需要嵌套多层布局(一般3层吧?)。而SuperTextView只需一个控件,并且十分简单高效的就能实现。它能够大量的减少你的App中的布局复杂程度,减少视图树的绘制时间。
炸裂的Adjuster
Adjuster被设计用来在SuperTextView的绘制过程中插入一些操作。这具有非常重要的意义。比如,默认实现的DefaultAdjuster能够动态的调整文字的大小。当然,你可以用它来实现各种各样的效果。
想要Adjuster生效,你必须调用SuperTextView.setAutoAdjust(true)
来启用Adjuster功能。当然,你可以所以方便的停止,通过调用SuperTextView.setAutoAdjust(false)
。并且,你需要注意调用顺序,因为一旦调用了SuperTextView.setAutoAdjust(true)
,而Adjuster没有被设置的话,将会启用默认的DefaultAdjuster
(它能够动态的调整文字大小),直到你设置了你自己的Adjuster
干预控件的绘制
实现一个Adjuster需要继承SuperTextView.Adjuster,并且实现adjust(SuperTextView v, Canvas canvas)
方法。Adjuster.adjust()会在每次绘制过程中被调用,这意味着你能够不可思议的从外部干预控件的绘制过程。
public class YourAdjuster extends SuperTextView.Adjuster {
@Override
protected void adjust(SuperTextView v, Canvas canvas) {
//do your business。
}
}
注意,如果开启动画,你必须十分谨慎的编写adjuster()中的代码。因为动画会以60帧/每秒的速度进行绘制。这意味着,这个方法每秒会被调用60次!所以,千万不要在这个方法中重复的创建对象,会卡爆的!原因是短时间的大量将会引起【内存抖动】,导致GC频繁发生。相关知识你可以看看我的这两篇文章:
- 【Android内存基础——内存抖动http://www.jianshu.com/p/69e6f894c698】
- 【用两张图告诉你,为什么你的App会卡顿?http://www.jianshu.com/p/df4d5ec779c8】
响应触摸事件
如果你重载Adjuster的onTouch(SuperTextView v, MotionEvent event)
方法,你将能够获得SuperTextView的触摸事件。这是重要的一点,如果你想持续的对SuperTextView的触摸事件进行处理,你必须使onTouch()
返回true。否则你只能接收到一个ACTION_DOWN事件,而不是一个事件流。
public class YourAdjuster extends SuperTextView.Adjuster {
@Override
protected void adjust(SuperTextView v, Canvas canvas) {
//do your business。
}
@Override
public boolean onTouch(SuperTextView v, MotionEvent event) {
//you can get the touch event.
//If want to get a series of touch event, you must return true here.
}
}
如此惊艳的效果
得益于SuperTextView内置的动画驱动,你能够结合Adjuster来实现难以置信的动画效果。一切只需要在你合理的编写好Adjuster后,调用startAnim()
和stopAnim()
来启动/停止动画。
如你所见,上面的效果就是通过Adjuster来实现的。并且这种拔插式的设计,使得你能够随时在同一个SuperTextView上使用新的Adjuster,你所有需要做的事情就是创建一个新的Adjuster,然后调用setAdjuster()
。
之前@Alex_Cin
希望看到Ripple涟漪效果,所以在RippleAdjuster.java
中,我演示了如何使用Adjuster和动画驱动配合实现上图的Rippler涟漪效果。【RippleAdjuster.java链接:https://github.com/chenBingX/SuperTextView/blob/master/app/src/main/java/com/coorchice/supertextview/SuperTextView/Adjuster/RippleAdjuster.java】
看,你可以使用Adjuster实现自己的Ripple效果。
指定Adjuster的层级
Adjuster贴心的设计了控制作用层级的功能。你可以通过Adjuster.setOpportunity(Opportunity opportunity)
来指定Adjuster的绘制层级。
在SuperTextView中,绘制层级被从下到上分为:背景层、Drawable层、文字层3个层级。通过Opportunity来指定你的Adjuster想要插入到那个层级间。
public enum Opportunity {
BEFORE_DRAWABLE, //背景层和Drawable层之间
BEFORE_TEXT, //Drawable层和文字层之间
AT_LAST //最上层
}
三种类型的Opportunity示意图。
默认值是Opportunity.BEFORE_TEXT
。即第二张图的示例。
事实上,只要你愿意,SuperTextView就相当于一张画布,你可以在上面任意的挥洒你的创意。它能够让你专注于创作,而不用去在意编写那些无用麻烦的代码。
uperTextView-从未如此惊艳!一个超级的TextView的更多相关文章
- ( 转 )超级惊艳 10款HTML5动画特效推荐
今天我们要来推荐10款超级惊艳的HTML5动画特效,有一些是基于CSS3和jQuery的,比较实用,特别是前几个HTML5动画,简直酷毙了,现在将它们分享给大家,也许你能用到这些HTML5动画和jQu ...
- 超级惊艳 10款HTML5动画特效推荐[转]
ylbtech_html5_demo 今天我们要来推荐 10 款超级惊艳的 HTML5 动画特效,有一些是基于 CSS3 和 jQuery 的,比较实用,特别是前几个 HTML5 动画,简直酷毙了,现 ...
- 理解C# 4 dynamic(4) – 让人惊艳的Clay
Clay非常类似于ExpandoObject, 可以看做是ExpandoObject的加强版. 它们能够让我们在不需要定义类的情况下,就构建出我们想要的对象.Clay和ExpandoObject相比, ...
- 惊艳!9个不可思议的 HTML5 Canvas 应用试验
HTML5 <canvas> 元素给网页中的视觉展示带来了革命性的变化.Canvas 能够实现各种让人惊叹的视觉效果和高效的动画,在这以前是需要 Flash 支持或者 JavaScript ...
- 使用 HTML5 Canvas 绘制出惊艳的水滴效果
HTML5 在不久前正式成为推荐标准,标志着全新的 Web 时代已经来临.在众多 HTML5 特性中,Canvas 元素用于在网页上绘制图形,该元素标签强大之处在于可以直接在 HTML 上进行图形操作 ...
- 迄今最安全的MySQL?细数5.7那些惊艳与鸡肋的新特性(上)【转载】
转自: DBAplus社群 http://www.toutiao.com/m5762164771/ 迄今最安全的MySQL?细数5.7那些惊艳与鸡肋的新特性(上) - 今日头条(TouTiao.com ...
- 分享10款效果惊艳的HTML5图片特效
在HTML5的世界里,图片特效都十分绚丽,我们在网站上也分享过很多不错的HTML5图片特效,现在我们精选10款效果惊艳的HTML5图片特效分享给大家. 1.HTML5 3D正方体旋转动画 很酷的3D特 ...
- 20 个具有惊艳效果的 jQuery 图像缩放插件
jQuery相对与Flash的魔力已经贯穿整个网络.尽管,Flash层被认为是用于网页设计的首选,然而随着jQuery的出现,以及他的酷似Flash的交互式特效使得网页更加的优雅——Flash开始靠边 ...
- 理解C# 4 dynamic(4) – 让人惊艳的Clay(转)
作者:Justrun名字来自<阿甘正传>,是希望自己能够更更傻一点. link: http://www.cnblogs.com/JustRun1983/p/3529157.html 理 ...
随机推荐
- [物理学与PDEs]第1章第2节 预备知识 2.3 Faraday 电磁感应定律
1. Faraday 电磁感应定律: 设 $l$ 为任一闭曲线, 则 $$\bex \oint_l{\bf E}\cdot\rd {\bf l} =-\int_S \cfrac{\p {\bf B} ...
- Jasmine
Jasmine https://www.npmjs.com/package/jasmine The Jasmine Module The jasmine module is a package of ...
- springMVC工作过程
学习springmvc之前先学习一下他的工作过程 如图 1.用户通过客户端向服务器发送请求,请求会被springMVC的前端控制器DispatchServlet所拦截. 2.DispatchServl ...
- windows 7中的windows键相关的快捷键
引用 https://support.microsoft.com/zh-cn/help/976857 Windows 键的位置 如果不清楚 Windows 键的位置,请参照下图: 常用的 Window ...
- Leetcode#191. Number of 1 Bits(位1的个数)
题目描述 编写一个函数,输入是一个无符号整数,返回其二进制表达式中数字位数为 '1' 的个数(也被称为汉明重量). 示例 : 输入: 11 输出: 3 解释: 整数 11 的二进制表示为 000000 ...
- 找不多控件, or 控件为null
组件化开发,命名要使用moudle区分, 同名,在最后合成的时候,会出现很多问题,
- 残差网络ResNet笔记
发现博客园也可以支持Markdown,就把我之前写的博客搬过来了- 欢迎转载,请注明出处:http://www.cnblogs.com/alanma/p/6877166.html 下面是正文: Dee ...
- Redis和memcahce的区别【转】
先给大家讲一个基本知识点:数据库分类大致分为两类,关系型数据库和非关系型数据库.如果详细区分的话,还可以继续分下去. Redis不仅仅是缓存数据库 面试的时候,很多人会问,Redis和memcahce ...
- Fork别人的代码 原作者更新后如何同步
给主题的fork加一个remote 给 fork 配置一个 remote 使用 git remote -v 查看远程状态 ➜ next git:(master) git remote -v origi ...
- Lua中的一些库(2)
[前言] 在<Lua中的一些库(1)>这篇文章中,总结了一部分Lua中的库函数,一篇文章肯定是总结不完的,所以,就来一个<Lua中的一些库(2)>.希望大家能忍住.来吧. 操作 ...