happylife

서버가 nodejs이고, mongoose를 이용해서 데이터를 저장할 때, flutter에서 table 형태로 db를 보고싶다면 어떻게 해야할까? 서버에서 json형태로 db를 전송하고, flutter에서 json형태로 받은 db를 테이블로 보여주면 된다! json형태로 전송하는 부분 - node js 서버 : app.get('/api/uploaded_data', function (req, res) { try { attractionModel.find({ complete: 'O' }, function (err, data) { res.send({ 'data': data }); }) } catch (err) { res.status(500).send(err); } }); flutter 프론트엔드 : json을 t..

위젯에서 showDialog를 리턴해주니 다음과 같은 에러가 나왔다. A value of type 'Future' can't be returned from the method 'AddFriendDialog' because it has a return type of 'Widget' 인터넷에 검색해보니, showDialog가 async 함수이기 때문에 나는 에러라고 한다. (dialog가 닫힐때까지 - 결과가 나올때까지 기다린다는 뜻) 그래서 showDialog의 closing bracket에 .then을 붙여주면 된다. (.then의 의미 : 값을 받을때 ) Future AddFriendDialog(context) async { return showDialog( context: context, builde..

flutter에서 datepicker를 사용해서 원하는 날짜를 선택 할 수 있다. 코드는 다음과 같다 screen 부분 class EndDate extends StatelessWidget { const EndDate({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Container( width: 65, margin: EdgeInsets.fromLTRB(30, 0, 0, 0), child: Text( '종료일 ', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold), )); } } class EndDateFeild extends StatelessWi..

flutter에서 provider와 consumer를 언제 사용해야할지, 두개의 차이점이 무엇인지 궁금했다. Provider는 데이터를 전달해주는 역할을 한다. Consumer는 2가지 상황에서 provider 대신에 사용된다. 1. Provider의 자손인 BuildContext를 가지고 있지 않아서 Provider.of를 사용할 수 없을 때, Provider에서 값을 얻을 수 있게 한다. document에서 이렇게 말하는데, 이게 무슨 말이지 헷갈릴 것이다... @override Widget build(BuildContext context) { return ChangeNotifierProvider( create: (_) => Foo(), child: Text(Provider.of(context).va..

flutter나 java 등 여러 프로그래밍 언어를 사용하다보면 @override라는 것을 자주 보게된다. 그렇다면 @override가 무엇인지에 대해서 알아보겠다. @override는 함수가 조상 클래스에도 정의되어있지만 현재 클래스에서 다른 작업을 수행할 수 있도록 재정의하는 것이다. 추상 메소드 구현에도 사용한다. 사용을 할지 말지는 선택사항이지만, 가독성을 높이기 위해서는 사용하는 것이 좋다고 한다. The annotation @override marks an instance member as overriding a superclass member with the same name. 이라고 dart SDK 도큐먼트에서 말하고 있다! *@override는 키워드가 아니라 annotation이라고한다..

flutter에서는 pubspec.yaml이라는 파일을 이용해서 필요한 패키지들을 설치한다. 그런데 이 파일에 보면, dependencies와 dev_dependencies가 있다. 필요한 패키지를 이 둘중 어디에 작성을 해야할까? dependencies : 개발 완료 후 앱을 배포할 때 포함해야하는 플러그인 목록 (컴파일 할 때 필요) dev_dependencies : 개발 단계에서 앱을 테스트하기 위해 필요한 플러그인 목록 (개발할 때 필요) 예를들어서, change_app_package_name flutter_lints 와 같은 패키지들은 개발단계에서 필요한 것이다. (change_app_package_name 패키지의 경우에는, 해당 플러터 프로젝트의 이름을 바꾸기 위해 필요한 것이다. 더 자세히..

flutter 에서 stateful, stateless class를 만들면, 자동으로 key라는 것이 class 안에 들어가있는 것을 확인 할 수 있다. 여기서 key는 무엇이고 const는 왜 사용하는것일까? 플러터 독스에 따르면, Key class는 Widget에 대한 identifier이다. 다른 클래스에서 동일한 키를 가지고 있으면, 같이 업데이트 해줄 수 있다. Key에는 LocalKey와 GlobalKey가 존재한다. GlobalKey 는 전체 앱에서 unique한 특성을 가진다. LocalKey는 parent widget이 같은 경우에 사용한다. 그래서 평상시에 코딩할 때는 class에 key를 남겨놓을 필요가 없을 것 같다 그렇다면 class 정의를 하고, 바로 아랫줄에 있는 const는 ..

스플래쉬 화면은 모바일 앱을 실행시켰을때 가장 처음으로 나타나는 화면이다. 사용자 타입에 따라 다른 랜딩 화면을 제공하기 위한 준비 시간동안 로고와 같은 앱을 대표하는 내용으로 구성되어있다. 예를 들면, 네이버블로그, 넷플릯, 뱅크샐러드의 스플래쉬 화면이다. 그렇다면 플러터에서도 스플래시 화면을 넣는 방법을 알아보자! flutter_native_splash 패키지를 사용한다. pubspec.yaml에 dependency를 설정해준다. dependencies: flutter_native_splash: splash 화면에 보여줄 이미지를 assets 폴더를 만들어 넣어준다. 그리고 pubspec.yaml 파일에 flutter_native_splash를 추가해준다. color, image, background..

플러터 앱의 기본 아이콘을 쉽고 빠르게 변경하기 위해서 flutter_launcher_icons 패키지를 사용하였다. 만약 이 패키지를 사용하지 않고 아이콘을 변경하려면 안드로이드에서는 android/app/src/main/res 에 들어가서 파일의 이미지들을 모두 바꿔줘야한다. ios에서는 ios/Runner/Assets.xcassets 에 들어가서 AppIcon.appiconset 폴더 전체의 이미지 바꿔줘야한다. 이 패키지를 사용하면, 그냥 코드한줄이면 아이콘 변경이 가능하다. 사용하는 방법은 아주 쉽다! pubspec.yaml 파일에서 다음과 같이 수정해주면 된다. dev_dependencies: flutter_launcher_icons: flutter_icons: android: "launche..

플러터에서 전체 스크린의 배경색을 설정하는 방법을 알아보겠다. materialapp을 만들어주는 쪽에서 theme을 추가해주면 된다. return MaterialApp( // your other app initialization code theme: ThemeData(scaffoldBackgroundColor: Colors.white), ); 각 화면에서 배경색 설정하는 방법은 이렇게 scaffold 밑에 backgroundcolor로 배경색을 설정해주면 된다. void main() => runApp(new MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new Mater..