ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [2주차]디지털 기술 입문 - BMI 계산기
    디지털 기술 입문 2025. 3. 14. 20:19

    이번에 앱인벤터로 제작할 앱은 BMI 계산기입니다
    여기서 BMI란, Body Mass Index로 체질량 지수를 의미합니다
    BMI 수치는 자신의 몸무게에 자신의 키를 제곱한 값으로 나누어 계산하고,
    이 수치를 특정 기준에 따라 저체중, 정상체중, 경도비만, 비만, 고도비만으로 표시할 수 있습니다

     

    수치 40이상을 고도비만
    35-39.9를 중등도 비만
    30-34.9를 경도비만
    25-29.9를 과체중
    18.5-22.9를 정상
    18.5 미만을 저체중으로 평가하지만
    이번에 만들 앱은 편의상 아래의 기준표를 토대로 비만의 정도를 나타내도록 하겠습니다

     

    BMi 판정기준

     

    앱 개발을 시작하기전 사용할 기능들을 먼저 알아보겠습니다.

     

    1.변수

    신체 정보를 통해 결과값을 도출해내기 때문에
    입력하게 될 변수들을 어떻게 활용할 지를 생각해야 합니다
    변수의 종류는 글로벌 변수와 로컬 변수로 나뉘어지며,
    글로벌 변수는 제작하게 될 프로그램의 전체에 쓰일 수 있는 변수입니다
    그리고 로컬 변수는 코딩을 할 때 사용하는 블록 안에서만 작용하는 변수입니다

    또 사용하게 될 변수의 블록인 get과 set은 각각
    이미 입력된 변수의 값을 가져오는 것과
    새로운 변수값을 지정할 수 있는 블록입니다

     

    2. 계산
    표시하게 될 BMI 수치는 단순히 이미 존재하던 값을 가져오는 것이 아니라
    사용자가 입력한 수치(키, 몸무게)들을 토대로
    새로운 값을 도출해내야 하기 때문에
    계산기능(Math)를 이용할 수 있어야 합니다

     

    앱을 개발하기전 변수와 계산 기능을 살펴봤습니다 이제 프로그램 과정을 진행해 보도록 하겠습니다.

    이번에 BMI 계산기의 디자인 입니다. 

    1) 키 입력을 위한 Text box

    2) 몸무게 입력을 위한 Text Box

    3) 계산기능을 실행하기위한 Button

    4) 결과 출력을 위한 Label

    5) Screen 레이어에서 Horizontal , Vertical을 각각 Center로 설정

    6) Text box , button, label 등 각각 이름을 txt_height, txt_weight, Button1, cal_BMI, lbl_BMI로 설정합니다

    7) 추가적으로 앱을 실행 할떄 각 Text Box,  Label, Button 사이에 여백을 주고 싶으면 각 사이에 Label를 추가하고

        속성창에 Height에서 웜하는 여백만큼의 숫자를 입력해주면 됩니다

    필자는 각 사이에 레이블을 통해 여백을 주었습니다

    TextBox 속성에서 txt_height Hint를 키(CM), txt_weight  Hint를 몸무게(kg)으로 변경합니다

    버튼 속성에서 Text를 BMI 계산으로 수정해줍니다.

    다음은 레이블의 Text도 변경해 주겠습니다.

    lblBMI를 클린한후 속성창애 Text를 "당신의 BMI는? 으로 변경해 줍니다

    마지막으로  Title를 변경해 주겠습니다.

    Screen1 속성에서 Title를 BMI 계산기로 수정해 주겠습니다.

    배경색도 변경하고 싶으면 BackgroundColor 컬러에서 원하는 색으로 수정해 주시면 됩니다.

    이제 모든 디자인이 끝났습니다

     

    이제 본격적으로 BMI계산기의 코드를 배워보겠습니다

    Blocks를 클릭하면 블럭 코딩을 할 수 있는 창이 열립니다.

    먼저 몸무게, 키, BMI의 변수를 만들어 주겠습니다

    버튼을 눌렀을떄 동작해야하기 떄문에 when 버튼1.Click do블럭안에 모든 코드들을 넣어줄 겁니다.

    텍스트 요소를 가져와서 변수에 넣어주고

    신장의 단위를 cm에서 m로 바꾸고 변수에 다시 넣어줍니다.

    그리고 BMI값을 계산하고 변수에 넣어줍니다.

    BMI값을 lblBMI의 텍스트로 나타내준 다음 format as decimal number를 사용하여  bmi값 소수 첫째자리까지만 노출하고

    if-then문을 이용해 조건에 따라 비만 정도를 나타내주는 lblresult를 변경하여  bmi분류기준 나눠 줍니다

     

    작성한 코드를 전체적으로 보면

    BMi 계산기 블록 코딩

    다음과 같습니다

     

    실행해 보면 

    다음과 같이 나옵니다 

     

    그럼 앱인벤터로 BMI계산기 만들기 끝입니다! 
    감사합니다^^

Designed by Tistory.