Hello,時隔多日,我球球又給大家來整活了,話不多說,喜歡的朋友點贊收藏➕關注,開衝!
A framework for directly generating shape through Tags, no need to write shape.xml again(通過標籤直接生成shape,無需再寫shape.xml) |
上述描述爲BackgroundLibrary在GitHub的官方描述,可以看出,它相當於一個類庫,來幫助我們更加簡潔的在佈局文件中編寫shape,不用再寫繁瑣的shape.xml,可以說是開發必備了。但是他有一個缺點就是不能實時顯示效果,不過這對於我這種寫一點測試一點的人來說,影響並不是很大。下面是GitHub官方源碼地址:
使用方法
依舊是添加依賴:
implementation "com.android.support:appcompat-v7:$supportVersion"
implementation 'com.noober.background:core:1.6.3'
如果項目使用了androidx:
implementation "androidx.appcompat:appcompat:$supportVersion"
implementation 'com.noober.background:core:1.6.3'
接下來可以通過配置Live Templates,使我們在編寫佈局文件的時候能進行自動提示代碼:
以Android studio3.2爲例:
mac:進入目錄MacintoshHD\user\xxx\Library\Preferences\AndroidStudio3.2\templates
windows:進入目錄C:\Users\XXX.AndroidStudio3.2\config\templates
如果templates不存在,手動創建文件夾即可; 在templates下面加入文件BackgroundLibrary.xml 重啓as即可。
使用示例
- 1、邊框+背景+圓角
<TextView
android:layout_width="130dp"
android:layout_width="130dp"
android:layout_height="36dp"
android:gravity="center"
android:text="TextView"
android:textColor="#8c6822"
android:textSize="20sp"
app:bl_corners_radius="4dp"
app:bl_solid_color="#E3B666"
app:bl_stroke_color="#8c6822"
app:bl_stroke_width="2dp" />
等同於
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="2dp"/>
<solid android:color="#E3B666"/>
<stroke android:color="#E3B666" android:width="2dp"/>
</shape>
2、漸變
<Button
android:id="@+id/btn"
android:layout_width="130dp"
android:layout_height="36dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:padding="0dp"
android:text="跳轉到列表"
android:textColor="#4F94CD"
android:textSize="20sp"
app:bl_corners_radius="2dp"
app:bl_gradient_angle="0"
app:bl_gradient_endColor="#4F94CD"
app:bl_gradient_startColor="#63B8FF" />
等同於
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="2dp"/>
<gradient android:angle="0"
android:startColor="#63B8FF"
android:endColor="#4F94CD"/>
</shape>
3、點擊效果
點贊
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginTop="5dp"
app:bl_pressed_drawable="@drawable/circle_like_pressed"
app:bl_unPressed_drawable="@drawable/circle_like_normal" />
等同於
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/circle_like_pressed" />
<item android:state_pressed="false"
android:drawable="@drawable/circle_like_normal" />
</selector>
通過代碼設置
Drawable drawable4 = new DrawableCreator.Builder().setCornersRadius(dip2px(20))
.setPressedDrawable(ContextCompat.getDrawable(this, R.drawable.circle_like_pressed))
.setUnPressedDrawable(ContextCompat.getDrawable(this, R.drawable.circle_like_normal))
.build();
tv.setClickable(true);
tv.setBackground(drawable4);
有波紋觸摸反饋的按鈕
<Button
android:layout_width="300dp"
android:layout_height="50dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:padding="0dp"
android:text="有波紋觸摸反饋的按鈕"
android:textColor="@android:color/white"
android:textSize="20sp"
app:bl_corners_radius="20dp"
app:bl_pressed_drawable="#71C671"
app:bl_ripple_color="#71C671"
app:bl_ripple_enable="true"
app:bl_stroke_color="#8c6822"
app:bl_stroke_width="2dp"
app:bl_unPressed_drawable="#7CFC00" />
通過代碼設置
Drawable drawable3 = new DrawableCreator.Builder().setCornersRadius(dip2px(20))
.setRipple(true, Color.parseColor("#71C671"))
.setSolidColor(Color.parseColor("#7CFC00"))
.setStrokeColor(Color.parseColor("#8c6822"))
.setStrokeWidth(dip2px(2))
.build();
btn.setBackground(drawable3);
4、點擊文字變色
<Button
android:layout_width="300dp"
android:layout_height="50dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:padding="0dp"
android:text="點擊文字變色"
app:bl_pressed_textColor="#919DAF"
app:bl_unPressed_textColor="@android:color/holo_red_dark"/>
5、點擊填充邊框變色屬性
<TextView
android:layout_width="180dp"
android:layout_height="36dp"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="點擊邊框變色"
android:textColor="@android:color/black"
android:textSize="18dp"
android:textStyle="bold"
android:clickable="true"
app:bl_pressed_solid_color="#FFDEAD"
app:bl_unPressed_solid_color="#E9967A"
app:bl_stroke_width="1dp"
app:bl_pressed_stroke_color="#C6E2FF"
app:bl_unPressed_stroke_color="#98FB98"/>
6、設置drawableLeft
<Button
android:id="@+id/btn_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
app:bl_position="left"
android:background="@null"
android:text="點贊+1"
app:bl_pressed_drawable="@drawable/circle_like_pressed"
app:bl_unPressed_drawable="@drawable/circle_like_normal" />
<Button
android:id="@+id/btn_like2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
app:bl_position="left"
android:background="@null"
android:text="未點贊"
app:bl_selected_textColor="#fbdc4a"
app:bl_unSelected_textColor="@android:color/black"
app:bl_selected_drawable="@drawable/circle_like_pressed"
app:bl_unSelected_drawable="@drawable/circle_like_normal" />
7、設置幀動畫
<View
android:id="@+id/v_anim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:bl_oneshot="false"
app:bl_duration="50"
app:bl_anim_auto_start="true"
app:bl_frame_drawable_item0="@drawable/img00"
app:bl_frame_drawable_item1="@drawable/img01"
app:bl_frame_drawable_item2="@drawable/img02"
app:bl_frame_drawable_item3="@drawable/img03"
app:bl_frame_drawable_item4="@drawable/img04"
app:bl_frame_drawable_item5="@drawable/img05"
app:bl_frame_drawable_item6="@drawable/img06"
app:bl_frame_drawable_item7="@drawable/img07"
app:bl_frame_drawable_item8="@drawable/img08"
app:bl_frame_drawable_item9="@drawable/img09"
app:bl_frame_drawable_item10="@drawable/img10"
app:bl_frame_drawable_item11="@drawable/img11"
app:bl_frame_drawable_item12="@drawable/img12"
app:bl_frame_drawable_item13="@drawable/img13"
app:bl_frame_drawable_item14="@drawable/img14"/>
常用屬性
bl_solid_color 背景色
bl_corners_radius 圓角
bl_corners_bottomLeftRadius ↙️圓角
bl_corners_bottomRightRadius ↘️圓角
bl_corners_topLeftRadius ↖️圓角
bl_corners_topRightRadius ↗️圓角
bl_stroke_width 邊框寬度
bl_stroke_color 邊框顏色
其實很多時候我們只需要自定義一點點的按鈕或者textview的樣式,但是有時候讓人蛋疼的就是,很多不同的樣式其實相差就只有那麼一點點,要是放在以前我們就得寫一大堆的shape,用的時候還得一個個找,現在,只需要在佈局文件寫就好了,nice
本文很多的🌰都是借鑑它GitHub原文,如有冒犯,請私信
我是分割線 |
小結
總的來說,BackgroundLibrary這是一條非常好用的內褲,讓我徹底擺脫了包括寫和找shape.xml文件的煩惱,麻麻再也不用擔心我爲找樣式而煩惱了。可能美中不足的一點就是他不能實時顯示效果,但是他官方也給出了相對應的辦法,不過我嫌麻煩就沒弄,感興趣的小夥伴可以點擊下方的超鏈接:
可能已經有小夥伴已經過上了使用Jetpack的舒適生活(羨慕),本球最近也在努力的學習databinding,room等相關知識,不得不說,哇!JetPack這條內褲真的是太舒服了,這裏給大家推薦個騰訊的網課,那裏有相關於Jetpack,mvvm,flutter等一系列的Android學習課程(絕對不是打廣告!!!),喜歡的小夥伴可以嘗試看看,地址我放下面啦,我們下期再見!👋