간단 계산기 만들기 - [실습 1_1]

오늘 실습의 결과물:

위에 숫자 두개를 입력하고 원하는 계산의 버튼을 누르면 그에 맞게 결과값이 가장 아래 계산결과에 출력되는 계산이 입니다.

 

# 화면 [activity_main]

 

먼저 새 프로젝트  생성 후 레이아웃을 LinearLayout으로 바꿔줍니다. 사진에 보이듯이 모든 위젯들은 한줄로 수직으로 배치되어 있으니 레이아웃에  orientation 속성을 vertical로 설정해 줍니다.

 

그 외의 것들은 기본값이니 그대로 둡니다.

이제 나머지 위젯들을 생성해줍니다.

숫자 입력칸: EditText

연산 버튼 : Button

계산결과: TexiView 

 

각각의 위젯들이 화면에서 동일한 공간을 주기위해 Layout-weight 속성을 사용하고 각 위젯들에게 1씩 부여한다

 

위젯이 많으니 하나의 예시만 자세히 보겠습니다.

 

여기에 보면 id, layout_width, layout_height, margin, text 속성들이 보입니다.

id는 각  위젯에게 고유한 이름을  설정해줍니다. 곧 메인에 연결할 때 꼭 필요한 요소입니다.

layout_width, layout_height은 위젯의 크기설정 속성인데 match_parent라 하면 해당 위젯이 속한 부모의 크기를 맞춘다고 생각하면 됩니다. text에는 문자를 입력합니다.

더하기 버튼을 보면 가로는 레이아웃 가로길이만큼 큽니다. 양옆의 공간은 margin이라고 빈공간을 만들어주는 속성으로 구현한 것입니다. margin이 없었다면 버튼의 가로길이는 화면가로와 동일합니다.

 

margin이 없을 경우

세로의 wrap_content는 안에 있는 content 크기의 공간만 사용하겠다는 말입니다. 사진에는 그것보다  크지만 그것은 layout_weight으로 화면을 동일분할해서 그렇습니다.

 

weight이 없을 경우

지금 까지 본 내용과 동일하게 나머지 버튼들을 생성해주면 됩니다.

 

하지만 가장위에 숫자 입력칸은 수직정렬이 아닌 수평인것을 보실 수가 있습니다.

이것은 아직 다른 Layout을 배우지 않아서 내부에 LinearLayout을 새로 만들어 수평설정(orientation: horizontal)을 해주었습니다.

 

첫 문단 끝에 ">"을 주의

사진에 보이는 android:hint는 아무입력이 없을때 보이는 것을 설정해주는 속성입니다.

 

숫자 입력이 없을때

화면에 필요한 위젯들이 생성됬으니 이제 메인에 가서 로직을 짜줍니다. (MainActivity)

 

(다음글)