Hi运授,開(kāi)發(fā)者烤惊,來(lái)見(jiàn)識(shí)一下全新的 SuperTextView 吧!
stv_page1.gif
|
stv_page2.gif
|
stv_page3.gif
|
stv_page4.gif
|
??以上演示吁朦,均由 SuperTextView 提供強(qiáng)力驅(qū)動(dòng)支持柒室。
SuperTextView 的與眾不同在于,它只是一個(gè)簡(jiǎn)單的控件元素喇完,但卻不僅僅是一個(gè)控件伦泥。它生而靈動(dòng)多變,強(qiáng)大的內(nèi)嵌邏輯锦溪,為你持續(xù)提供豐富多彩卻異常簡(jiǎn)單的開(kāi)發(fā)支持。
SuperTextView 將你從復(fù)雜的渲染邏輯中解救出來(lái)府怯,一行簡(jiǎn)單的 API 接口調(diào)用刻诊,炫目的渲染效果即刻呈現(xiàn)。
你只需享受自己所編寫(xiě)出的驚人視效牺丙,剩下的一切就放心交給 SuperTextView则涯。
在全新的 v3.2.1
版本中复局,SuperTextView 再一次重新定義了自己。開(kāi)發(fā)者粟判,來(lái)看看精心為你準(zhǔn)備的驚喜吧亿昏!??????
這是... Gif ?
這一次档礁,SuperTextView 為開(kāi)發(fā)者帶來(lái)了強(qiáng)力的 Gif 驅(qū)動(dòng)支持角钩。
如果在過(guò)去,你曾經(jīng)為如何在 Android 平臺(tái)上展示一張 Gif 圖而苦惱多日呻澜,或是困于一些三方 Gif 庫(kù)的性能深淵中迷失方向递礼。那么現(xiàn)在,SuperTextView 將徹底改變這一現(xiàn)狀羹幸。
Gif 圖與 SuperTextView 生而渾然天成脊髓,因此,你可以通過(guò)最熟悉的栅受、最自然的方式來(lái)讓一張 Gif 圖獲得展示将硝。就像你過(guò)去展示一張普通圖片那樣簡(jiǎn)單。
得益于 c/c++ 的超高性能屏镊,以及對(duì)內(nèi)存的精確操作依疼。SuperTextView 通過(guò)使用 c/c++ 為移動(dòng)平臺(tái)專(zhuān)門(mén)定制了性能強(qiáng)悍的 Gif 驅(qū)動(dòng)引擎。
SuperTextView 的 Gif 引擎闸衫,能夠精確操作圖像像素內(nèi)存涛贯,在 Gif 圖像的幀刷新時(shí),只對(duì)局部像素內(nèi)存進(jìn)行更新蔚出,這讓 Gif 圖像渲染效率得到了質(zhì)的飛躍弟翘。
通過(guò)異步離屏渲染及多緩沖技術(shù),使得 SuperTextView 即使在流暢展示超大 Gif 圖像的時(shí)候骄酗,依舊能夠保持應(yīng)用界面絲滑的流暢度稀余,以及靈敏的響應(yīng)速度。
??以上 Demo 中趋翻,使用 SuperTextView 展示了一張 近17M 大小睛琳,包含有 265 幀圖像的 Gif 圖,用戶界面依舊無(wú)比流暢踏烙。
展示 Gif 超簡(jiǎn)單师骗!
在 SuperTextView 中展示一張 Gif 圖,超簡(jiǎn)單讨惩!
你可以直接 XML 布局文檔中配置辟癌,或者在代碼中進(jìn)行添加。
在 XML 中配置 Gif
<com.coorchice.library.SuperTextView
android:id="@+id/stv_1"
android:layout_width="match_parent"
android:layout_height="150dp"
// 配置 Gif
app:stv_state_drawable="@drawable/gif_1" />
你可以像配置一張普通圖片一樣荐捻,為 SuperTextView 配置展示 Gif 圖黍少。
在代碼中配置 Gif
stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setDrawable(R.drawable.gif_1);
就是這么簡(jiǎn)單寡夹、自然,SuperTextView 可以讓你毫無(wú)感知厂置,就能配置展示一張 Gif 圖菩掏。
在 SuperTextView 的內(nèi)核邏輯中烙心,SuperTextView 能夠智能的對(duì)普通圖和 Gif 圖進(jìn)行分類(lèi)叁怪,然后作出相應(yīng)的處理和優(yōu)化。
展示網(wǎng)絡(luò) Gif霞掺,一樣簡(jiǎn)單
如果你的 Gif 圖不在本地砸紊,而在云端传于,怎么辦?
你無(wú)需煩惱醉顽!一切放心交給 SuperTextView沼溜。
stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setUrlImage("http://example.com/images/example.gif");
只需一行代碼,SuperTextView 會(huì)在后臺(tái)協(xié)助你完成 Gif 圖的加載游添,然后處理渲染到屏幕上系草。
??實(shí)際上,SuperTextView 的 Drawable1 和 Drawable2 圖像展示位唆涝,均可用來(lái)展示 Gif 圖找都。總之廊酣,一切都是你所熟悉的樣子能耻。
你可以掌控的更多
SuperTextView 所提供給開(kāi)發(fā)者的不僅僅是展示 Gif 圖這么簡(jiǎn)單,你可以掌控更多的細(xì)節(jié)亡驰。
播放/暫停
你可以隨時(shí)控制 Gif 圖晓猛,播放,或者暫停凡辱。
if (stv.getDrawable() instanceof GifDrawable) {
// 先獲取到 GifDrawable 對(duì)象
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// 播放
gifDrawable.play();
// 暫停
gifDrawable.stop();
}
跳轉(zhuǎn)/獲取指定幀
在 SuperTextView 中戒职,你可以隨時(shí)到達(dá)你指定的幀圖像,以及能夠提取到指定幀的圖像透乾。
if (stv.getDrawable() instanceof GifDrawable) {
// 先獲取到 GifDrawable 對(duì)象
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// 跳轉(zhuǎn)到指定幀
gifDrawable.gotoFrame(pre);
// 獲取指定幀
Bitmap frame = gifDrawable.getFrame(i);
}
??由于 SuperTextView 能夠支持局部增量渲染洪燥,所以當(dāng)你的 Gif 圖支持這種渲染模式時(shí),意味著你可能需要通過(guò)調(diào)用
gifDrawable.setStrict(true)
開(kāi)啟 嚴(yán)格模式乳乌,來(lái)確保幀跳轉(zhuǎn)或者幀提取的圖像是正確的捧韵。這可能會(huì)花費(fèi)一些時(shí)間,所以你應(yīng)該盡量將 嚴(yán)格模式 下的操作放到異步線程中進(jìn)行汉操。
快慢纫版,隨你心
SuperTextView 允許你隨意的修改 Gif 圖的播放速率。
if (stv.getDrawable() instanceof GifDrawable) {
// 先獲取到 GifDrawable 對(duì)象
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// 設(shè)置幀播放間隔時(shí)間客情,20ms
gifDrawable.setFrameDuration(20);
}
你可以了若指掌
通過(guò) SuperTextView 你可以對(duì)一張 Gif 圖像的信息了若指掌其弊。
-
獲取 Gif 尺寸
// 獲取寬度 int width = gifDrawable.getWidth(); // 獲取高度 int height = gifDrawable.getHeight();
-
獲取 Gif 幀信息
// 獲取幀數(shù) int frameCount = gifDrawable.getFrameCount(); // 獲取當(dāng)前幀間隔 int frameDuration = gifDrawable.getFrameDuration(); // 獲取當(dāng)前渲染到那一幀 int framePotision = gifDrawable.getCurrentFrame(); // 是否在播放 boolean isPlaying = gifDrawable.isPlaying();
更出彩的 Gif
SuperTextView 憑借對(duì) Gif 渲染的無(wú)縫融合,此前 Drawable1 和 Drawable2 的一切配置項(xiàng)膀斋,在展示 Gif 圖時(shí)梭伐,也同樣能夠生效。
Gif 作為普通 Drawable
app:stv_state_drawable_rotate="90"
來(lái)看看在原本的 Drawable 位置放上一張 Gif 圖會(huì)發(fā)生什么神奇的事情仰担。
<com.coorchice.library.SuperTextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:paddingLeft="62dp"
android:paddingRight="10dp"
android:text="小火箭發(fā)射了糊识!啦啦啦啦啦啦..."
android:textColor="#ffffff"
android:textSize="22dp"
app:stv_corner="6dp"
app:stv_isShowState="true"
app:stv_solid="#0D1831"
// 設(shè)置 Gif
app:stv_state_drawable="@drawable/gif_1"
// 設(shè)置 Gif 高
app:stv_state_drawable_height="40dp"
// 設(shè)置 Gif 寬
app:stv_state_drawable_width="40dp"
// 設(shè)置 Gif 居左展示
app:stv_state_drawable_mode="left"
// 設(shè)置 Gif 左間距
app:stv_state_drawable_padding_left="10dp"/>
效果是...
現(xiàn)在,將 Gif 旋轉(zhuǎn) 90 度試試摔蓝。
<com.coorchice.library.SuperTextView
...
// 設(shè)置 Gif 旋轉(zhuǎn) 90 度
app:stv_state_drawable_rotate="90"
...
/>
將 Gif 圓角化
SuperTextView 不可思議的實(shí)現(xiàn)了 Gif 圖的圓角化赂苗,為開(kāi)發(fā)者提供了更多的可能。
然而贮尉,實(shí)現(xiàn)這種效果卻驚人的簡(jiǎn)單拌滋。
<com.coorchice.library.SuperTextView
android:layout_width="185dp"
android:layout_height="138.75dp"
android:layout_gravity="center_horizontal"
app:stv_corner="20dp"
// 設(shè)置 Gif 作為控件背景
app:stv_drawableAsBackground="true"
app:stv_scaleType="fitCenter"
// 配置 Gif
app:stv_state_drawable="@drawable/gif_1" />
為 Gif 加上邊框
你甚至可以輕而易舉的給一張 Gif 圖加上邊框。
<com.coorchice.library.SuperTextView
android:layout_width="350dp"
android:layout_height="148.4dp"
android:layout_gravity="center_horizontal"
android:gravity="center"
// 加上文字會(huì)顯的更有格調(diào)
android:text="SuperTextView"
android:textSize="36dp"
android:textStyle="bold"
android:visibility="invisible"
app:stv_corner="6dp"
app:stv_drawableAsBackground="true"
app:stv_isShowState="true"
app:stv_scaleType="center"
// 設(shè)置邊框顏色
app:stv_stroke_color="@color/opacity_8_gray_4c
// 設(shè)置邊框?qū)挾? app:stv_stroke_width="5dp"
app:stv_text_fill_color="#ccffffff"
app:stv_text_stroke="true"
app:stv_text_stroke_color="#cc000000"
app:stv_text_stroke_width="2dp"
// 配置 Gif
app:stv_state_drawable="@drawable/gif_1"/>
效果即刻呈現(xiàn)...
輕松實(shí)現(xiàn)動(dòng)態(tài)頭像
在過(guò)去猜谚,一些炫酷的動(dòng)效败砂,往往會(huì)止步于實(shí)現(xiàn)的復(fù)雜度和成本。而 SuperTextView 為你帶了更多的可能魏铅,你的靈感可以無(wú)拘無(wú)束昌犹。
比如,動(dòng)態(tài)頭像的實(shí)現(xiàn)览芳,可能是迄今為止最簡(jiǎn)單的斜姥。
<com.coorchice.library.SuperTextView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="30dp"
app:stv_corner="40dp"
// 設(shè)置為背景圖
app:stv_drawableAsBackground="true"
// 配置 Gif 頭像
app:stv_state_drawable="@drawable/gif_avatar"
// 添加邊框
app:stv_stroke_color="#ffffff"
app:stv_stroke_width="3dp"
/>
在代碼中,你可以直接配置一張網(wǎng)絡(luò)動(dòng)態(tài)頭像沧竟。
stv.setUrlImage("http://gif_avatar.gif");
更多的驚喜
兩個(gè) Drawable 都支持點(diǎn)擊铸敏!
在新版本的 SuperTextView 中,Drawable1 和 Drawable2 被賦予了全新的能力 —— 支持精確的響應(yīng)點(diǎn)擊動(dòng)作屯仗。
SuperTextView 通過(guò)監(jiān)控點(diǎn)擊動(dòng)作發(fā)生的位置搞坝,能夠準(zhǔn)確的定位到其所發(fā)生的區(qū)域(Drawable1、Drawable2 或者 其它區(qū)域)魁袜,然后觸發(fā)相應(yīng)的回調(diào)監(jiān)聽(tīng)桩撮。
你可以為 SuperTextView 設(shè)置 Drawable 上的點(diǎn)擊動(dòng)作監(jiān)聽(tīng)器,以便在動(dòng)作發(fā)生時(shí)峰弹,作出必要的響應(yīng)店量。
stv.setOnDrawableClickedListener(new SuperTextView.OnDrawableClickedListener() {
@Override
public void onDrawable1Clicked(SuperTextView stv) {
// Drawable1 clicked,do something...
}
@Override
public void onDrawable2Clicked(SuperTextView stv) {
// Drawable2 clicked鞠呈,do something...
}
});
stv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 非 Drawable 區(qū)域被點(diǎn)擊融师,do something...
}
});
背景圖縮放模式支持
現(xiàn)在,當(dāng)你將 Drawable1 作為背景圖時(shí)蚁吝,你可以為它配置不同的縮放模式旱爆,以達(dá)到你心儀的效果舀射。
stv.setScaleType(ScaleType.CENTER);
SuperTextView 為開(kāi)發(fā)者提供了多達(dá) 3 種縮放模式:
-
ScaleType.FIT_XY
將圖片拉伸/壓縮平鋪。
-
ScaleType.FIT_CENTER
將圖片自適應(yīng)居中怀伦。
-
ScaleType.CENTER
將圖片剪裁居中脆烟。默認(rèn)值。
其它更新
-
在 XML 布局文檔中房待,Drawable1 和 Drawable2 現(xiàn)在支持直接設(shè)置 顏色 或者 ShapeDrawable邢羔。
// circle_f9ad36 為 xml 中編寫(xiě)的 shape 文件 app:stv_state_drawable="@drawable/circle_f9ad36" // 使用純色作為 Drawable app:stv_state_drawable="#000000"
?? 最低支持版本 API 提升到 19。
渲染性能比過(guò)去提升至少 30%桑孩。
升級(jí)默認(rèn)圖片加載引擎拜鹤,支持智能緩存。也許現(xiàn)在流椒,你不必再引入第三方圖片加載庫(kù)了敏簿。
??隨著 5G 帶來(lái)更快的網(wǎng)速,以及設(shè)備性能越來(lái)越強(qiáng)悍镣隶,用戶界面會(huì)越來(lái)越需要更多的動(dòng)態(tài)展示(過(guò)去大量的靜態(tài)用戶界面實(shí)在是太死氣沉沉了)來(lái)刺激使用者的感官极谊,激發(fā)用戶的興趣。而 SuperTextView 能夠幫助開(kāi)發(fā)者輕松的完成即將到來(lái)的這一過(guò)渡轉(zhuǎn)變安岂。
如何開(kāi)始 SuperTextView v3.2.1 轻猖?
在項(xiàng)目 build.gradle
中加入:
dependencies {
...
implementation 'com.github.chenBingX:SuperTextView:v3.2.1'
...
}
傳送門(mén)區(qū)域
- 如果你喜歡 SuperTextView,就到 Github 點(diǎn)個(gè) star ?? 支持哦域那!
- CoorChice 會(huì)不定期的在博客平臺(tái)分享干貨咙边,快進(jìn)入 CoorChice的【個(gè)人主頁(yè)】 關(guān)注一波吧。