플루터 37

Flutter chapter-05-05 BMI 계산 라우터 사용법

라우터는 화면 간 이동을 할 때 사용하는 함수이며, 해당하는 함수로 데이터도 전달 가능하다. 일단 사용법을 설명하도록 하겠다. Container( decoration: const BoxDecoration(color: Colors.blueAccent), child: Center( child: TextButton( onPressed: () { personData.calcBMI(); Navigator.push(context, MaterialPageRoute(builder: (context) => Result(personData: personData,))); }, child: const Text('Calc your BMI', style: TextStyle(color: Colors.white)), )), heig..

플루터 2022.02.11

Flutter chapter-05-04 BMI 계산 Slider Widget

Slider Widget - 슬라이더 위젯은 내가 설정한 값 사이에서 터치로 움직이는 값으로 사용자가 좀 더 용이하게 값을 입력할 수 있게 해 준다. - value : 현재 슬라이더의 값을 나타낸다 - min : 슬라이더의 최솟값을 나타낸다. - max 슬라이더의 최댓값을 나타낸다. 이외에도 많은 기능 들이 나와있는데, 참고문헌을 통해서 label과 mark도 변경 가능하다. 더 꾸며보고 싶은 사람은 참고 문헌을 보고 하면 되겠다. 여기서 중요한 부분은 onChanged 옆에 Callback 함수의 매개변수이다. 해당하는 값을 찍어보면 slider의 움직임의 값이 나오는 것을 확인할 수 있을 것이다. 해당하는 값으로 원하는 객체안에 값을 넣으면 값 세팅이 완료된다. import 'package:flutt..

플루터 2022.02.10

Flutter chapter-05-03 BMI 계산 final, const 설명 및 쓰는 이유

일단 final과 const를 설명하기 위해서는 '컴파일러'와 '인터프리터'를 알아야 된다. 컴파일러와 인터프리터는 사람이 사용하는 언어를 컴퓨터가 이해하는 언어로 변경하는 것으로 동일하지만, 어떻게 번역을 하느냐에 따라 두 가지 기능으로 분리가 되는 것이다. 1. 컴파일러 컴파일러 같은 경우 전체 코드를 한 번에 번역해서 컴퓨터에게 전달해준다. 때문에 컴파일러 같은 경우에 처음 번역하는데(실행파일을 만드는데) 오랜 시간이 걸리지만, 실행 파일이 생성돼서 다음에 실행할 때 기존에 생성되었던 실행 파일을 실행하기 때문에 실행 시간이 빠르다. 2. 인터프리터 인터프리터 같은 경우 한 줄씩 번역을 진행하기 때문에 컴파일러보다 번역 시간은 빠른 편이다. 하지만 실행파일을 만들지 않기 때문에 실행할 때마다 위에서..

플루터 2022.02.10

Flutter chapter-05-02 BMI 계산 Theme 사용법(dark,light 모드)

Theme는 기본적으로 앱 기본 색상과 구성을 설정해주는 기능으로 MaterialApp 하단의 위치해있으며, 기본적으로 라이트 모드, 다크 모드 두 가지로 분류된다. *ThemeData.dart() 현재 플루터 내부에 있는 기본적인 다크 모드로 변경하였다. 글씨 색생과 배경의 색상이 변경 되는 것을 확인할 수 있다. ThemeData.light() 모드 현재 플루터 내부에 있는 기본적인 라이트 모드로 변경하였다. 글씨 색생과 배경의 색상이 변경 되는 것을 확인할 수 있다. 마지막으로 다크모드의 커스텀으로 내가 지정한 색상으로 변경하였으며, 그에 따라 다크 모드에서의 색상들도 내 맘대로 변경할 수 있는 것을 알 수 있다. 그렇다면 이를 통해서 우리는 앱의 모드를 손쉽게 버튼 하나로 변경 가능하다는 것 을 ..

플루터 2022.02.10

Flutter 설명 변경

flutter를 설명하면서 많은 부분이 부족하다고 생각되었습니다. 변수, 객체, 그리고 상속, 외부 패키지 사용법, DB 접근 등등 많은 내용을 작성해야 되는데, 글로만 작성하는 데에는 한계가 있다고 생각되었습니다. 정리는 계속 진행하겠지만, 추후에 동영상으로 처음 부터 설명을 진행할 것이며, 혹시 블로그를 보고 따라 하다 막히는 부분이 있으시면, 언제든지 댓글 달아주시면 감사하겠습니다.

플루터 2022.02.08

Flutter chapter-04-04 OX퀴즈 showDialog 사용

OX 퀴즈가 완성되고 질문을 완료했을 때, showDialog창을 띄워주려고 한다. - 다이얼로그를 작성하면서 문제가 발생하였다. - 'No MaterialLocalization found' 에러 발생 문제의 원인 : showDialog 메서드에 전달하는 context가 아직 MaterialLocaliztions 위젯 트리에 위젯이 없고 암시적으로 추가만 했기 때문에 발생하는 문제였다. 해당 사항을 해결 하기 위해서 void main() { runApp(const MaterialApp(home: OxQuiz())); } 문제 해결방법 : 메인을 실핼할때 MaterialApp을 작성한 다음 Home으로 OXQuiz를 주었다. 최종 소스코드 import 'package:flutter/material.dart..

플루터 2022.02.08

Flutter chapter-04-03 OX퀴즈 객체

객체란? 데이터(속성)와 기능(메서드)를 모두 포함한, 독립적으로 실행할 수 있는 최소한의 단위 예를 들면 Airplane airplane = Airplane ();이다. 속성이란? 속성은 객체가 가지고 있는 고유 값이다. 이 말은 객체 안의 고정적으로 들어가 있는 변수의 값을 의미한다. 메서드란? 객체의 속성을 변경하는 통로이다. 생성자란? 객체를 생성할 때 반드시 호출되는 기능(메서드)이다. 데이터(속성)을 초기화 시키는 역할을 한다. void main() { // 객체를 생성하고 각각의 생성자를 통해 다른 속성값을 출력하게 나타내였다. // 이를 통해서 객체의 값에 따라 다른 데이터를 갖고 올 수 있다는 것을 알 수 있었고, // 차후에 상속이라는 개념과 다양성에 대해서 설명하도록 하겠다. Airp..

플루터 2022.02.07

Flutter chapter-04-02 OX퀴즈 조건문

조건문 조건문은 주어진 조건식의 결과에 따라 원하는 명령어를 수행하도록 하는 명령문이다. 조건문에서는 1) if 2) if else 3) switch 4) 삼항 연산자 조건문 가 존재하면 각각의 예시를 보고 설명하도록 하겠다. 1) if 사용법 if (조건식) { 조건식이 참일때 실행되는 영역 } 2) if else 사용법 if (1번 조건식) { 1번 조건식이 참일때 실행되는 영역 } else if (2번 조건식) { 2번 조건식이 참일때 실행되는 영역 } else { 1번 조건과 2번조건이 참이 아닌 영역 } 3) switch 사용법 switch (조건 값) { case 값 : break; case 값 : break; case 값 : break; case 값 : break; default : 케이스에..

플루터 2022.01.30