Kotlin(코틀린) > 사칙연산을 수행하는 계산기를 만들어 보자! - 1

Kotlin(코틀린)을 통해 간단한 계산기를 만들려고 한다.

레이아웃을 통해 화면 구성은 간단하게 할 수 있을 것이지만 코틀린은 하나의 파일로 구성되어 있지 않아 꽤나 까다로울 수 있다.

 

제약(Constraint) 레이아웃으로 계산기를 구현해 보겠다!

레이아웃 배치

다음과 같이 레이아웃을 배치한다. 위에서 부터 editText 2개, button 4개, textView 1개가 필요하다.

 

 

 

텍스트, 힌트 설정 + id 설정

레이아웃(editText, button, textView)의 텍스트와 힌트를 다음과 같이 설정한다.

그리고 아이디는 각각 edit1, edit2, / btnSum, btnSub, btnMul, btnDiv, / textResult로 설정한다

 

 

 

그리고 뷰바인딩 기능을 쓰기위해 다음과 같이 Gradle Scripts > build.gradle.kts(Module:app) 경로에 들어가

android {
   viewBinding {
      enable = true
   }
...

위와 같이 선언해준다

 

이해하기 어려울 수 있으니 사진도 첨부하겠다.

 

뷰바인딩 설정

 

그리고 MainActivity 화면에서 기능을 작성해준다.

 

default 화면 상태 - 이 상태에서 시작

 

코드를 다음과 같이 작성해준다.

 

+ 버튼까지만 구현

class MainActivity : AppCompatActivity() {
   override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState)

   val binding = ActivityMainBinding.inflate(layoutInflater) // binding을 activity_main.xml를 대상으로 한다.

   lateinit var num1: String // edit1에 들어갈 정수 값
   lateinit var num2: String // edit2에 들어갈 정수 값

   var result: Int? = null // textResult에 들어갈 결과 값
   
   setContentView(binding.root) // binding을 할 때 binding.root로 꼭꼭꼭 바꿔줘야 적용이 된다.

   title = "계산기" // 어플 이름

   // + 버튼을 클릭 했을 때 합 계산
   binding.btnSum.setOnClickListener {
      num1 = binding.edit1.text.toString() // edit1의 text 값을 String 값으로 가져온다.
      num2 = binding.edit2.text.toString() // edit2의 text 값을 String 값으로 가져온다.
     
      // num1과 num2를 String에서 Int형으로 더하여 result에 저장 
      result = Integer.parseInt(num1) + Integer.parseInt(num2)

     // result 값을 String 형으로 바꿔 textResult의 text에 저장한다.(textResult의 text가 바뀜)
      binding.textResult.text = result.toString()
   }
}

이해를 돕기 위해 주석을 꼼꼼히 달았다!

 

2탄으로 나누기 위해 + 버튼 까지만 구현하였다!

 

다음은 실행 결과이다

 

+ 버튼의 결과

 

+ 버튼을 눌러도 textResult 값이 변하지 않아 

당황하고 많이 헤맸는데 정말 단순한 포인트에서 해결되었다

setContentView(R.layout.activity_main) -> setContentView(binding.root)

 

이렇게 binding.root로 선언해줘야 적용이 된다.

문법상으로 같은 것 같지만 화면에 보여주는 대상이 조금 다른 거 같나보다

꼭꼭꼭 주의해서 변경해 줘야겠다고 생각이 들었다.

 

2탄에서는 나머지 버튼 구현과 0을 나누었을 때 토스트 메시지가 뜨도록 포스팅해 보겠다!

끈잇!