查看在線pdf文檔:
http://note.youdao.com/s/EM20Cggm
以下是我的基本UI組件該系列的文章逻淌，歡迎大家轉(zhuǎn)載和分享：
基本UI組件的封裝庫(一)——basicUI
基本UI組件的封裝庫(二)——basicUI
基本UI組件的封裝庫(三)——basicUI
基本UI組件的封裝庫(四)——basicUI
Gradle依賴
- Step 1. Add the JitPack repository to your build file
Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
- Step 2. Add the dependency
dependencies {
implementation 'com.github.Peakmain:BasicUI:1.1.0-androidx'
}
使用
loading效果
loading的效果.gif
視察動畫的loading,布局中直接使用
<com.peakmain.ui.loading.InspectLoadingView
android:id="@+id/inspect_loading_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
activity中需要調(diào)用show方法來顯示
mInspectLoadingView.show();
隱藏只需要調(diào)用hide方法
mInspectLoadingView.hide();
仿釘釘?shù)膌oading
<com.peakmain.ui.loading.RotatingLoadingView
android:id="@+id/rotating_loading_view"
android:onClick="click"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
默認(rèn)設(shè)置的是全屏展示么伯，如果想以loading的方式顯示，可以調(diào)用show方法
RotatingLoadingView rotatingLoadingView = new RotatingLoadingView(this);
rotatingLoadingView.show();
隱藏還是hide方法
mLoadingView.hide();
仿58同城加載loading
<com.peakmain.ui.loading.ShapeLoadingView
android:id="@+id/shape_loading_view"
android:onClick="click"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
默認(rèn)也是全屏恍风，如果想以loading顯示蹦狂，可以使用show方法
ShapeLoadingView shapeLoadingView = new ShapeLoadingView(this);
shapeLoadingView.show();
自定義支付密碼鍵盤
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/view_root"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<com.peakmain.ui.widget.password.PasswordEditText
android:id="@+id/password_edit_text"
android:layout_width="match_parent"
android:layout_marginTop="@dimen/space_20"
android:layout_marginLeft="@dimen/space_50"
android:layout_marginRight="@dimen/space_50"
android:layout_height="30dp" />
<com.peakmain.ui.widget.password.CustomerKeyboard
android:id="@+id/custom_key_board"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content" />
</RelativeLayout>
- PasswordEditText的相關(guān)方法:
setPasswordCompleteListener表示設(shè)置完成
addPasswordNumber表示添加號碼
deletePassWord表示刪除號碼 - CustomerKeyboard
CustomerKeyboardClickListener設(shè)置監(jiān)聽事件
mCustomerKeyboard.setOnCustomerKeyboardClickListener(new CustomerKeyboard.CustomerKeyboardClickListener() {
@Override
public void click(String number) {
mEditText.addPasswordNumber(number);
}
@Override
public void delete() {
mEditText.deletePassWord();
}
});
mEditText.setPasswordCompleteListener(ToastUtils::showShort);
自定義支付密碼鍵盤.gif
九宮格解鎖
<com.peakmain.ui.widget.lock.LockScreenView
android:id="@+id/lock_pattern"
android:layout_width="match_parent"
android:layout_height="match_parent" />
LockScreenView中有個(gè)setOnLockSuccessListener方法其中有兩個(gè)方法,getLockResult表示返回你想判斷的結(jié)果的字符串,onLockSuccess表示密碼正確后的回掉
九宮格解鎖.gif
圖片預(yù)覽控件封裝
PicturePreview.create(context = mContext!!)
.origin(images)//加載本地圖片
.originUrl(imagesUrl)//加載網(wǎng)絡(luò)圖片
.showBottomView(true)//是否顯示底部已選擇頁面 false不顯示
.showTitleLeftBack(true)//是否顯示title的返回按鈕
.showTitleRightIcon(true)//是否顯示右邊已選擇圖標(biāo)
.forResult(null)//設(shè)置選擇之后的回調(diào)
image.png
懸浮按鈕的實(shí)現(xiàn)
一行代碼就可以了，如果想修改圖標(biāo)大小和位置朋贬，可以在構(gòu)造函數(shù)中設(shè)置
val suspensionView = SuspensionView(this)
addContentView(suspensionView, FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT))
suspensionView.setSuspensionViewClick {
ToastUtils.showLong("測試懸浮按鈕的點(diǎn)擊事件")
}
源碼構(gòu)造函數(shù)
class SuspensionView @JvmOverloads constructor(context: Context, resId: Int = R.drawable.ui_ic_suspension_setting,
imageViewSize: Float = 56f,//圖標(biāo)大小
bottomMargin: Float = 60f,
rightMargin: Float = 20f,
attributeSet: AttributeSet? = null, defAttrStyle: Int = 0)
1.gif
文本高亮組件封裝
//第一種加載方式
mTvContent1.text = TextUtils.clipTextColor(mTvContent1.text.toString(), ContextCompat.getColor(this, R.color.colorAccent), mTvContent1.text.indexOf("加"), mTvContent1.length())
//第二種加載方式
TextUtils.Builder(mTvContent2)
//第一個(gè)高亮的文本區(qū)域
.setClipText(ContextCompat.getColor(this, R.color.colorAccent), mTvContent2.text.indexOf("加"), 7)
.setOnClickableSpan(object : OnClickableSpan {
override fun onClickableSpan(view: View) {
ToastUtils.showShort("點(diǎn)擊了“加載”")
}
})
.setStyleSpan(Typeface.BOLD_ITALIC)
.showUnderLine(true)
//第二個(gè)高亮文本區(qū)域
.setClipText(ContextCompat.getColor(this, R.color.colorAccent), mTvContent2.text.indexOf("點(diǎn)"), mTvContent2.length())
.setAbsoluteTextSize(28)
.setBackgroundColor(ContextCompat.getColor(this,R.color.color_CDCECE))
.setOnClickableSpan(object : OnClickableSpan {
override fun onClickableSpan(view: View) {
ToastUtils.showShort("點(diǎn)擊了“點(diǎn)擊”")
}
})
.create()
動畫.gif
