사전캠프 TIL 12일차 (시저 암호, 숫자 문자열과 영단어 - Kotlin | MBTI 테스트 시작화면 UI 구현)

코드카타

 

시저 암호

 

문제

 

 

정답

class Solution {
    fun solution(s: String, n: Int): String {
        return s.map { c ->
            when {
                c.isLowerCase() -> rotateChar(c, n, 'a')
                c.isUpperCase() -> rotateChar(c, n, 'A')
                else -> c
            }
        }.joinToString("")
    }

    fun rotateChar(c: Char, n: Int, base: Char): Char { 
        return ((c - base + n) % 26 + base.toInt()).toChar()
    }
}

map함수를 이용해 s 문자열의 요소가 알파벳 대소문자라면

n만큼 이동한 값으로 변환하고 공백이라면 그대로 추가한 뒤 문자열로 변환해 반환한다.  

 

 

알파벳 아스키코드

 

해당 문제를 해결하려면 알파벳의 아스키코드를 이용해야한다.

 

 

rotateChar()

fun rotateChar(c: Char, n: Int, base: Char): Char {
    return ((c - base + n) % 26 + base.toInt()).toChar()
}

c의 값이 대문자라면 base는 'A', 소문자라면 'a'의 값을 가진다.

 

base로부터 해당 원소의 거리 (c - base)에서 밀 거리에 해당하는 n을 더한 뒤 

알파벳은 총 26개이므로 알파펫 범위를 벗어나지 않도록 '(c - base + n) % 26' 연산을 진행한다.

 

'(c- base + n) % 26'은 더할 아스키 코드 값을 가지게 되고

그 값에서 base문자의 아스키코드 값을 더해준 뒤 char형으로 변환한 값을 반환하면

해당 함수가 반환할 값은 결과적으로 c에서 n만큼 이동한 문자가 된다.

 

'z'나 'Z'가 c의 인자값으로 들어오게 되면 'a'와 'A'를 반환한다.

 

 

 

숫자 문자열과 영단어

 

문제

 

정답

class Solution {
    fun solution(s: String): Int {
        val nums = arrayOf("zero", "one", "two", "three", "four", "five", "six", "seven","eight", "nine")
        var str = s
        for (i in 0 until nums.size) {
            str = str.replace(nums[i], i.toString())
        }
        return str.toInt()
    }
}

nums에 숫자 영단어 리스트를 선언한다.

s의 값을 변환할 수 있도록 var str값을 s로 초기화한다.

 

str에 nums의 요소가 포함되어 있는지 for문을 돌려 전부 검사하고

str에 nums의 요소에 해당하는 문자열이 있다면 숫자(문자열)로 바꾼다.

 

str을 int형으로 변환한 뒤 반환한다.

 

 

replace()

fun main() {
    var str = "1two3"
    print(str.replace("two" , "2")) // 123
}

str.replace(a, b)

문자열에서 a에 해당하는 부분을 b로 바꾼다.

 

---

 

MBTI 테스트 시작화면 UI 만들기

 

배경색 그라데이션으로 주기

// layout_bg.xml

<?xml version="1.0" encoding="utf-8" ?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#ff2d9a59"
        android:endColor="#ff23729a"
        android:angle="90"/>
</shape>

그라데이션 색상을 가지는 직사각형 도형을 반환하는 xml 파일을 하나 선언한다.

 

shape태그 안에서 gradient 태그를 사용해 그라데이션 색상을 지정할 수 있고,

angle 값은 90의 배수로 값을 줘야 그라데이션의 각도가 변하게 된다.

 

android:background="@drawable/layout_bg"

mainActivity에서 배경을 생성한 xml파일로 지정해준다.

 

 

 

구현한 시작화면 UI

 

1주차, 2주차 강의에서 했던 것처럼

사용할 위젯의 id를 각각 설정하고 위젯간의 constraint 속성을 지정해서 

위젯들을 알맞게 배치해주면 된다.

 

개인적으로 design에서 위젯을 불러와서 코드 템플릿을 생성한 뒤

코드로 세부 값들을 지정해주는 방식이 난 편했다.

 

 

scaleType = "fitCenter"

android:scaleType="fitCenter"

시작버튼과 아래 사람들 이렇게 2개의 이미지 뷰에 위 속성을 준다.

 

스케일 타입을 "fitCenter"로 주게 되면 

 

이미지가 ImageView의 크기보다 작은 경우,

이미지는 원래의 크기를 유지하고 ImageView의 중앙에 위치하고.

 

 큰 경우에는 이미지는 종횡비를 유지하면서 축소되어

ImageView의 경계에 맞추어진다.

 

이 속성은 이미지가 잘리거나 비뚤어지는 경우를 방지하고,

인터페이스에서 일관된 비주얼을 유지하는데 도움을 준다.

 

 

화면 라우팅

val btn_start = findViewById<ImageView>(R.id.iv_start)

btn_start.setOnClickListener {
    val intent = Intent(this@MainActivity, TestActivity::class.java)
    startActivity(intent)
}

Intent 객체를 생성하여 TestAcitivty를 시작하고자 하는 대상으로 지정한다.

startActivity(intent)로 이미지를 누르면 테스트 화면으로 이동하도록 한다.