Commit acc63fce by 霍志良

feat:验证码部分UI

parent 178b2434
......@@ -64,7 +64,7 @@ import kotlinx.android.synthetic.main.user_activity_register_and_login.*
* @Company 壹点灵
* @date 2018/11/28
*/
@Route(path = "/user/login")
@Route(path = "/user/login1")
class RegisterAndLoginActivity : BaseMvpActivity<ILoginContract.View, ILoginContract.Presenter>(),
ILoginContract.View {
......
package com.yidianling.user.widget.PinField
/**
* @author huozhiliang
* @描述:
* @Copyright Copyright (c) 2018
* @Company 壹点灵
* @date 2020/12/23
*/
import `in`.srain.cube.util.LocalDisplay.dp2px
import android.content.Context
import android.graphics.Canvas
import android.graphics.Paint
import android.os.Build
import android.util.AttributeSet
import com.yidianling.user.R
/**
* Created by poovam-5255 on 5/23/2018.
*
* Pin field represented with squares
*/
class SquarePinField : PinField{
private var cornerRadius = 0f
set(value) {
field = value
invalidate()
}
private val cursorPadding = dp2px(5f)
constructor(context: Context): super(context)
constructor(context: Context, attr: AttributeSet) : super(context,attr){
initParams(attr)
}
constructor(context: Context, attr: AttributeSet, defStyle: Int) : super(context,attr,defStyle){
initParams(attr)
}
private fun initParams(attr: AttributeSet){
val a = context.theme.obtainStyledAttributes(attr, R.styleable.user_SquarePinField, 0,0)
try {
cornerRadius = a.getDimension(R.styleable.user_SquarePinField_user_cornerRadius, cornerRadius)
} finally {
a.recycle()
}
}
override fun onDraw(canvas: Canvas?) {
for (i in 0 until numberOfFields){
val x1 = (i*singleFieldWidth)
val padding = (if (distanceInBetween!= DEFAULT_DISTANCE_IN_BETWEEN) distanceInBetween else getDefaultDistanceInBetween())/2
val paddedX1 = (x1 + padding)
val paddedX2 = ((x1+singleFieldWidth)-padding)
val squareHeight = paddedX2-paddedX1
val paddedY1 = (height/2)-(squareHeight/2)
val paddedY2 = (height/2)+(squareHeight/2)
val textX = ((paddedX2-paddedX1)/2)+paddedX1
val textY = ((paddedY2-paddedY1)/2+paddedY1)+ lineThickness +(textPaint.textSize/4)
val character:Char? = getCharAt(i)
drawRect(canvas, paddedX1, paddedY1, paddedX2, paddedY2, fieldBgPaint)
if(highlightAllFields() && hasFocus()){
drawRect(canvas,paddedX1,paddedY1,paddedX2,paddedY2, highlightPaint)
}else{
drawRect(canvas,paddedX1,paddedY1,paddedX2,paddedY2, fieldPaint)
}
if(character!=null) {
canvas?.drawText(character.toString(),textX,textY, textPaint)
}
if(shouldDrawHint()){
val hintChar = hint.getOrNull(i)
if(hintChar != null){
canvas?.drawText(hintChar.toString(),textX,textY, hintPaint)
}
}
if(hasFocus() && i == text?.length ?: 0){
if(isCursorEnabled){
val cursorPadding = cursorPadding + highLightThickness
val cursorY1 = paddedY1 + cursorPadding
val cursorY2 = paddedY2 - cursorPadding
drawCursor(canvas,textX,cursorY1,cursorY2,highlightPaint)
}
}
highlightLogic(i, text?.length){
drawRect(canvas,paddedX1,paddedY1,paddedX2,paddedY2, highlightPaint)
}
}
}
private fun drawRect(canvas: Canvas?,paddedX1:Float,paddedY1:Float,paddedX2:Float,paddedY2:Float,paint: Paint){
if(cornerRadius>0 && Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
canvas?.drawRoundRect(paddedX1,paddedY1,paddedX2,paddedY2,cornerRadius,cornerRadius, paint)
}else{
canvas?.drawRect(paddedX1,paddedY1,paddedX2,paddedY2, paint)
}
}
}
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#1da1f2"
android:endColor="#1da1f2"
android:angle="90"
/>
<corners android:radius="@dimen/platform_dp_24" />
</shape>
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#a5dafa"
android:endColor="#a5dafa"
android:angle="90"
/>
<corners android:radius="@dimen/platform_dp_24" />
</shape>
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="@+id/img_reg_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/platform_dp_16"
android:layout_marginTop="@dimen/platform_dp_20"
android:src="@drawable/user_ic_back_black"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<TextView
android:id="@+id/tv_login_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/platform_dp_40"
android:text="密码登录"
android:textColor="@color/pay_color_242424"
android:textSize="22sp"
app:layout_constraintLeft_toRightOf="@id/img_reg_back"
app:layout_constraintTop_toBottomOf="@id/img_reg_back" />
<EditText
android:id="@+id/et_input_password"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
app:layout_constraintTop_toBottomOf="@id/tv_login_title"
android:layout_marginTop="100dp"
app:layout_constraintLeft_toLeftOf="@id/tv_login_title"
android:layout_weight="1"
android:background="@null"
android:digits="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"
android:hint="输入密码"
android:lines="1"
android:maxLines="16"
android:textColorHint="@color/platform_color_BFBFBF"
android:textSize="20sp" />
<View
android:id="@+id/view_lin"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_marginTop="@dimen/platform_dp_10"
android:layout_marginEnd="@dimen/platform_dp_40"
android:background="@color/platform_color_EBEBEB"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/tv_login_title"
app:layout_constraintTop_toBottomOf="@id/et_input_password"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/user_ic_invisibility_new"
app:layout_constraintTop_toTopOf="@id/et_input_password"
app:layout_constraintBottom_toBottomOf="@id/et_input_password"
app:layout_constraintEnd_toEndOf="@id/view_lin"
android:id="@+id/iv_visibility"
>
</ImageView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="验证码登录"
android:textColor="@color/platform_color_666666"
android:textSize="13sp"
app:layout_constraintTop_toBottomOf="@id/view_lin"
app:layout_constraintStart_toStartOf="@id/view_lin"
android:layout_marginTop="@dimen/platform_dp_15"
android:id="@+id/tv_msm_login"
>
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="忘记密码?"
app:layout_constraintEnd_toEndOf="@id/view_lin"
app:layout_constraintTop_toTopOf="@id/tv_msm_login"
app:layout_constraintBottom_toBottomOf="@id/tv_msm_login"
android:id="@+id/tv_forget"
>
</TextView>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="@color/white"
android:text="登录"
android:textSize="15sp"
android:id="@+id/login_password"
android:background="@drawable/login_password_unable_bg_24dp"
android:paddingTop="@dimen/platform_dp_14"
android:paddingBottom="@dimen/platform_dp_14"
app:layout_constraintTop_toBottomOf="@id/tv_msm_login"
app:layout_constraintStart_toStartOf="@id/tv_msm_login"
app:layout_constraintEnd_toEndOf="@id/tv_forget"
android:layout_marginTop="@dimen/platform_dp_40"
/>
<include layout="@layout/user_activity_register_and_login_bottom" />
</android.support.constraint.ConstraintLayout>
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:showIn="@layout/user_activity_register_and_login_new">
<LinearLayout
android:id="@+id/other_login_style"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="187dp"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<View
android:layout_width="@dimen/platform_dp_60"
android:layout_height="@dimen/platform_dp_1"
android:background="@color/platform_color_EBEBEB">
</View>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/platform_dp_16"
android:layout_marginRight="@dimen/platform_dp_16"
android:text="第三方登录"
android:textColor="@color/platform_color_BFBFBF"
android:textSize="13sp" />
<View
android:layout_width="@dimen/platform_dp_60"
android:layout_height="@dimen/platform_dp_1"
android:background="@color/platform_color_EBEBEB">
</View>
</LinearLayout>
<LinearLayout
android:id="@+id/other_login_ll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/platform_dp_20"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/other_login_style">
<ImageView
android:id="@+id/login_wechat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="@dimen/platform_dp_35"
android:src="@drawable/user_login_wechat_new" />
<ImageView
android:id="@+id/login_qq"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/user_login_qq_new" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/platform_dp_30"
android:gravity="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/other_login_ll">
<ImageView
android:id="@+id/iv_select_protocol"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/user_login_protocol_unselected_new" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/platform_dp_4"
android:textSize="12sp"
android:text="同意壹点灵用户注册协议" />
</LinearLayout>
</merge>
\ No newline at end of file
......@@ -24,7 +24,7 @@
android:textColor="@color/pay_color_242424"
android:textSize="22sp"
app:layout_constraintLeft_toRightOf="@id/img_reg_back"
app:layout_constraintTop_toTopOf="@id/img_reg_back" />
app:layout_constraintTop_toBottomOf="@id/img_reg_back" />
<TextView
android:id="@+id/country_code"
......@@ -70,63 +70,6 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/country_code" />
<LinearLayout
android:id="@+id/other_login_style"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="187dp"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<View
android:layout_width="@dimen/platform_dp_60"
android:layout_height="@dimen/platform_dp_1"
android:background="@color/platform_color_EBEBEB">
</View>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/platform_dp_16"
android:layout_marginRight="@dimen/platform_dp_16"
android:text="第三方登录"
android:textColor="@color/platform_color_BFBFBF"
android:textSize="13sp" />
<View
android:layout_width="@dimen/platform_dp_60"
android:layout_height="@dimen/platform_dp_1"
android:background="@color/platform_color_EBEBEB">
</View>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/platform_dp_20"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/other_login_style">
<ImageView
android:id="@+id/login_wechat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="@dimen/platform_dp_35"
android:src="@drawable/user_login_wechat_new" />
<ImageView
android:id="@+id/login_qq"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/user_login_qq_new" />
</LinearLayout>
<include layout="@layout/user_activity_register_and_login_bottom" />
</android.support.constraint.ConstraintLayout>
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<ImageView
android:id="@+id/img_reg_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/platform_dp_16"
android:layout_marginTop="@dimen/platform_dp_20"
android:src="@drawable/user_ic_back_black"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<TextView
android:id="@+id/tv_login_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/platform_dp_40"
android:text="输入短信验证码"
android:textColor="@color/pay_color_242424"
android:textSize="22sp"
app:layout_constraintLeft_toRightOf="@id/img_reg_back"
app:layout_constraintTop_toBottomOf="@id/img_reg_back" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="已发送至+86 137 7759 3333"
app:layout_constraintTop_toBottomOf="@id/tv_login_title"
android:layout_marginTop="@dimen/platform_dp_5"
app:layout_constraintStart_toStartOf="@id/tv_login_title"
android:id="@+id/tv_phone"
>
</TextView>
<TextView
android:id="@+id/tv_countdown_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/pay_color_999999"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@id/tv_phone"
app:layout_constraintBottom_toBottomOf="@id/tv_phone"
android:layout_marginEnd="@dimen/platform_dp_40"
android:textSize="13sp"
tools:text="发送验证码"
tools:visibility="visible" />
<com.yidianling.user.widget.PinField.SquarePinField
android:id="@+id/verify_code"
android:cursorVisible="true"
app:highlightType="currentField"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="@id/tv_phone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginStart="@dimen/platform_dp_40"
android:layout_marginEnd="@dimen/platform_dp_40"
android:layout_marginTop="67dp"
app:cornerRadius="8dp"
app:noOfFields="4"
android:inputType="number"
>
</com.yidianling.user.widget.PinField.SquarePinField>
</android.support.constraint.ConstraintLayout>
\ No newline at end of file
......@@ -3,4 +3,26 @@
<integer-array name="user_colors">
<item>@color/platform_main_theme</item>
</integer-array>
<declare-styleable name="User_PinField">
<attr name="User_noOfFields" format="integer" />
<attr name="User_distanceInBetween" format="dimension" />
<attr name="User_lineThickness" format="dimension" />
<attr name="User_fieldColor" format="color" />
<attr name="User_highlightColor" format="color" />
<attr name="User_highlightEnabled" format="boolean" />
<attr name="User_isCustomBackground" format="boolean" />
<attr name="User_isCursorEnabled" format="boolean" />
<!--Single Field Mode is deprecated use highlight type to define how to highlight the fields-->
<attr name="User_highlightSingleFieldMode" format="boolean" />
<attr name="User_highlightType" format="enum">
<enum name="allFields" value="0" />
<enum name="currentField" value="1" />
<enum name="completedFields" value="2" />
<enum name="noFields" value="3" />
</attr>
<attr name="User_fieldBgColor" format="color" />
</declare-styleable>
<declare-styleable name="user_SquarePinField">
<attr name="user_cornerRadius" format="dimension" />
</declare-styleable>
</resources>
\ No newline at end of file
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- google color-->
<!--app主要颜色-->
<color name="user_c8c8c8">#c8c8c8</color>
<!--最后删除-->
<!-- main bg color -->
<!-- session -->
<!-- image picker -->
<!-- contact -->
<!-- setting -->
<!--云信 end-->
<!--动态-->
<!--动态顶部title背景变色-->
<color name="user_with_status_fail">#fcff6600</color>
</resources>
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- google color-->
<!--app主要颜色-->
<color name="user_c8c8c8">#c8c8c8</color>
<!--最后删除-->
<!-- main bg color -->
<!-- session -->
<!-- image picker -->
<!-- contact -->
<!-- setting -->
<!--云信 end-->
<!--动态-->
<!--动态顶部title背景变色-->
<color name="user_with_status_fail">#fcff6600</color>
<color name="user_pinFieldLibraryAccent">#1da1f2</color>
<color name="user_inactivePinFieldColor">#ebebeb</color>
<color name="user_pinFieldLibraryTransparent">#00000000</color>
</resources>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment