[Android/Kotlin] Anko 확장활용-3

SoyoungLee·2021년 6월 14일
0

안드로이드/코틀린

목록 보기
5/68
post-thumbnail
post-custom-banner

💌 로그인 처리

Anko 버전과 라이브러리 추가

// 프로젝트의 빌드 스크립트
buildscript {
	ext.anko_version = '0.10.8'
}

// App 모듈의 빌드 스크립트
dependencies {
	implementation "org.jetbrains.anko:anko:$anko_version"
}

📌 1. Anko Component 이용한 뷰 생성

💜 res/values/에 리소스 추가

💛 id

<resources>
    <item name="edit_username" type="id"/>
    <item name="edit_password" type="id"/>
    <item name="btn_sign_in" type="id" />
</resources>

💛 문자열

<resources>
    <string name="app_name">SignInEx</string>
    <string name="sign_in_username">Username</string>
    <string name="sign_in_password">Password</string>
    <string name="sign_in_button">SIGN IN</string>
</resources>

💜 화면 구성을 위한 클래스

class SignInUI : AnkoComponent<MainActivity> {
    override fun createView(ui: AnkoContext<MainActivity>): View = with(ui) {
        verticalLayout {
        lparams(width = matchParent, height = matchParent)
        
            val username = editText {
                id = R.id.edit_username
                textSize = 24f
                hintResource = R.string.sign_in_username
            }.lparams(width = matchParent, height = wrapContent)
            
            val password = editText {
                id = R.id.edit_password
                textSize = 24f
                hintResource = R.string.sign_in_password
            }.lparams(width = matchParent, height = wrapContent)
            
            button {
                id = R.id.btn_sign_in
                textResource = R.string.sign_in_button
            }.lparams(width = matchParent, height = wrapContent)
        }
    }
}

💜 메인에서 UI 호출

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        SignInUI().setContentView(this)
    }
}

📌 2. 이벤트, 비즈니스 로직

💛 데이터 클래스

data class AuthCredentials(val username: String, val password: String)

💛 인터페이스

interface ISignInBL {
    fun checkUserCredentials(credentials: AuthCredentials): Boolean
}

💛 인터페이스 구현 클래스

class SIgnInBL : ISignInBL {
    override fun checkUserCredentials(auth: AuthCredentials): Boolean {
        return ("uesr" == auth.username && "pass" == auth.password)
    }
}

💜 이벤트 핸들러



...

button {
	id = R.id.btn_sign_in
	textResource = R.string.sign_in_button
		onClick {
			handleOnSignIn(
				ui = ui,
				username = username.text.toString(),
				password = password.text.toString()
                    	)
                }
        }.lparams(width = matchParent, height = wrapContent)
            
...

// 사용자 이름과 패스워드 검사 후 다이얼로그 표시
private fun handleOnSignIn(ui: AnkoContext<MainActivity>, username: String, password: String) {
        if (username.isBlank() || password.isBlank()) {
            with(ui) {
                alert(
                    title = R.string.invalid_user_title,
                    message = R.string.invalid_user_message
                ) {
                    positiveButton(R.string.btton_close) {}
                }.show()
            }
        }
    }

💜 res/values에 리소스 추가

💛 문자열

    <string name="sign_in_button">SIGN IN</string>
    <string name="invalid_user_title">Sign In Failed!</string>
    <string name="invalid_user_message">Invalid_username or password</string>
    <string name="btton_close">Close</string>

💜 로그인 검사 조건

class MainActivity : AppCompatActivity() {
    private val signInBL: ISignInBL = SignInBL()
    private lateinit var signInUI: SignInUI

   override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        signInUI = SignInUI()
        signInUI.setContentView(this)
    }

    // 로그인 검사 조건
    fun authorizeUser(username: String, password: String){
        doAsync {
            val authorized = signInBL.checkUserCredentials(
                AuthCredentials(username = username, password = password)
            )
            activityUiThread { // UI 요소 업데이트
                if (authorized) toast("Signed!!") else signInUI.showAccessDeniedAlertDialog()
            }
        }
    }
}

💜 다이얼로그 띄우기

class SignInUI : AnkoComponent<MainActivity> {

    private lateinit var ankoContext: AnkoContext<MainActivity>

    override fun createView(ui: AnkoContext<MainActivity>): View = with(ui) {

        ankoContext = ui
        
        ... 
        
        private fun handleOnSignIn(ui: AnkoContext<MainActivity>, username: String, password: String) {
        if (username.isBlank() || password.isBlank()) {
          
          ...
          
        } else { // MainActivity 메소드 호출
            ui.owner.authorizeUser(username, password)
        }
    }
}

💜 res/values에 리소스 추가

💛 문자열

<string name="access_denied_title">Access Denied</string>
<string name="access_denied_msg">You do not have permission</string>

💜 UI 속성 설정

...
verticalLayout {
            padding = dip(20)
            
            // textSize = 24f
            ...
            
            }.applyRecursively { view -> // 반복되는 속성 빼내기
            when (view) {
                is EditText -> view.textSize = 24f
            }
        }
profile
Android Developer..+ iOS 슬쩍 🌱 ✏️끄적끄적,,개인 기록용 👩🏻‍💻
post-custom-banner

0개의 댓글