flutter

    Dart 문법 정리 (3)

    1. 상속(Inheritence) 상속을 받으면 부모 클래스의 모든 속성을 자식 클래스가 부여받는다. void main(){ BoyGroup bts = BoyGroup('BTS', 7); bts.sayHello(); bts.introduce(); bts.sayMale(); } class Idol { String name; int membersCount; Idol({ required this.name, required this.membersCount, }); void sayHello(){ print("안녕하세요 ${this.name} 입니다."); } void introduce(){ print("${this.name}은 ${this.membersCount}명의 멤버가 있습니다."); } } class Bo..

    Flutter freezed

    Code import 'package:freezed_annotation/freezed_annotation.dart'; part 'person.freezed.dart'; part 'person.g.dart'; @freezed class Person with _$Person { factory Person({ required int id, required String name, required int age, }) = _Person; factory Person.fromJson(Map json) => _$PersonFromJson(json); } 생성 명령어 flutter pub run build_runner build

    Dart 문법 정리 (1)

    1. var 타입, dynamic타입의 차이 var은 한번 값을 지정하면 타입을 바꿀 수 없다. 반면 dynamic은 가능 ex) var name = "서울" name = 3; // 불가능 dynamic name = "경기도" name = true; // 가능 2. nullable, non-nullable 기본적으로 선언되는 변수는 non-nullable 타입이다. 선언하는 타입뒤에 '?'를 붙여주면 nullable 타입이 된다. String? name = "안녕" name = null; //가능 변수 뒤에 '!'를 붙이면 해당 변수는 절대 null이 될 수 없음을 의미한다. String? name2 = "안녕하세요"; print(name2!); 3. final, const final, const를 사용..

    [Flutter] 정규 표현식(숫자 천단위 콤마)

    1. 환경설정 pubspec.yaml파일에 해당 코드를 추가한다. intl: ^버전 dependencies: intl: ^0.16.1 2. 설치 커맨드 창에서 $ flutter pub get 명령어를 입력한다. 3. 불러오기 import 'package:intl/intl.dart'; 4. 정규 표현식 사용하기 data에 원하는 값 입력하기 NumberFormat('###,###,###,###').format(data).replaceAll(' ', '')

    [Flutter] BottomNavigationBar 사용하기

    1. BottomNavigationBar 사용법 1) items 부분에 'BottomNavigationBarItem' 위젯을 페이지 개수만큼 넣어준다. 2) body부분에 '화면에 해당하는 위젯'을 페이지 개수만큼 넣어준다. 3) currentIndex 부분에 현재 페이지에 해당하는 인덱스 변수를 넣어준다. 4) onTap 부분에 페이지를 바꾸는 코드를 넣어준다. class App extends StatefulWidget { const App({Key? key}) : super(key: key); @override State createState() => _AppState(); } class _AppState extends State { int currentIndex = 0; final screens =..

    [Flutter] GetX를 이용한 Navigation(페이지 이동)

    (해당 내용은 NullSafety가 반영되기 이전에 작성된 글입니다.) 1. 환경설정 pubspec.yaml파일에 해당 코드를 추가합니다. get: ^버전 dependencies: get: ^3.26.0 2. 설치 커맨드 창에서 $ flutter pub get 명령어를 입력합니다. 3. 불러오기 getX를 사용하고 싶은 파일에 해당 명령어를 불러옵니다. import 'package:get/get.dart'; 4. 사용 세팅 기존의 root위젯인 MaterialApp을 GetMaterialApp으로 바꾸어줍니다. class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( ); }..

    [Flutter] TextFormField를 통한 입력 제어하기(FocusNode/TextEditingController)

    (해당 내용은 NullSafety가 반영되기 이전에 작성된 글입니다.) Flutter의 Text 입력을 제어하기 위해 필요한 내용입니다. TextEditingController를 이용하여 입력값을 처리하고 FocusNode를 통해 TextField의 포커스를 제어합니다. 마지막으로 validator을 통해 입력값을 검사합니다. ※ 아래 예제에서는 입력값을 "asset(String), kind(String), money(int)"를 예시로 사용합니다. 1. 사전 세팅 1) statefulwidget 사용 Form의 Controller를 사용하기 위해 Statefulwidget을 사용해야 합니다. class AssetRegist extends StatefulWidget { @override _AssetReg..

    [Flutter] 단위 테스트 (Unit Test) 해보기

    [Flutter] 단위 테스트 (Unit Test) 해보기

    안녕하세요, 개발자 제이오입니다. 오늘은 Flutter에서 단위 테스트를 실행해 보도록 하겠습니다. 개발환경: VSCode 1. Test 의존성 추가하기 제일 먼저 pubspec.yaml 파일에서 의존성을 추가해줄건데요 vscode에서 플러터 프로젝트를 생성하셨다면 기본적으로 의존성이 주입되있습니다. dev_dependencies: flutter_test: sdk: flutter 만약 의존성 주입이 안되어있다면 아래와 같이 작성해주시면 됩니다. dev_dependencies: test: 에 any를 써주셔도 됩니다. 2. 테스트 파일 생성하기 테스트를 진행하기 앞서 두 가지 테스트 파일을 추가하겠습니다. lib/ counter.dart test/ counter_test.dart 위와 같이 두 가지 파일을..

    [Flutter] TextFormField Focus Change 함수

    TextField나 TextFormFiled 위젯에서 포커스 변경을 위한 메소드입니다. void fieldFocusChange( BuildContext context, FocusNode currentFocus, FocusNode nextFocus) { currentFocus.unfocus(); FocusScope.of(context).requestFocus(nextFocus); }

    [Flutter] 이메일/비밀번호 등 유효성 검사(정규표현식)

    안녕하세요, 개발자 제이오입니다. 오늘은 Flutter의 이메일/비밀번호 등 유효성 검사 및 정규표현식에 대해 알아보겠습니다. - 이메일 유효성 검사 String? validateEmail(String value) { if (value.isEmpty) { return '이메일을 입력하세요'; } else { String pattern = r'^(([^()[\]\\.,;:\s@\"]+(\.[^()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$'; RegExp regExp = RegExp(pattern); if (!regExp.hasMatch(..