개발/Flutter

▪ flutter / firebase 연동하기 플러터와 firebase를 연동하는 방법은 쉬운 편입니다. 그런데, 전 오래 걸렸습니다 😑 firebase 콘솔에서 안드로이트 프로젝트를 새로 만들어주고 flutter 파일로 돌아와서 app 폴더속의 build.gradle 파일에 필요한 정보들을 넣어주면 됩니다. firebase문제가 상세하게 설명해주기 때문에 어려울게 없습니다. 모든 파일들 업데이트를 끝내고 오류메세지를 만났는데, flutter sdk버젼과 firebase 버젼이 상호가 안 되서였습니다. 이럴땐 android > app > build.gradle 파일에 midSdkVersion과 targetSdkVersion을 아래와 같이 넣어주면 됩니다. 숫자만 더해주면 되는데 전 그걸 모르고 엄청 해맸..

플러터에서는 route라는 개념으로 페이지 이동이 가능합니다. 이 때 이동할 곳을 page라고 생각해주면 됩니다. 굳이 파일을 따로 나누지 않아도 같은 파일 안에서 page만 나눠주면 됩니다. 참 쉽죵? 😁 이동 할 때 쓰는 것으로는 Navagator 메서드를 사용하시면 됩니다. main.dart Container( margin: EdgeInsets.only(top: 100, left: 0), width: 100, child: IconButton( icon: Text('Signup', style: TextStyle(fontSize: 20),), onPressed: (){ Navigator.push(context, MaterialPageRoute(builder: (context) => SignUpPage(..

반복되는 부분을 손수 쓰지 않고 반복해서 만들 수 있다. 이 때 쓸 수 있는 것이 ListView.builder 이다. ◾ Example 지금부터 만들어 볼 부분인데 보라색이 list_view부분이고 icons가 파란색부분이다 ◾ Code list_view에 반복되는 부분을 따로 파일(icons.dart)로 빼서 더하는거다. list_view.dart Container( margin: EdgeInsets.only(top: 10, bottom: 20), child: Text('${descList[index]}'), ), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( '${majorList[index]}', style: T..

플러터로 코드를 적어내려갈 때면 계속해서 보게되는 단어, BuildContext ... 그냥 단순하게 context라는 어떤 인자를 받는 메소드라고 생각했는데, 코딩셰프님이 여기에 대한 이야기를 강의를 만드셨다. 여전히 잘 이해는 안 되지만 코딩셰프님의 이야기를 간단하게 요약해보았다 ◾ A handle to the location of a widget in the widget tree 위젯 트리에서 현재 위젯의 위치를 알 수 있는 정보 모든 Widget은 BuildMethod를 가진다. 그리고 그 위젯은 계층 구조를 가지고 있다. Buildmethod는 scaffold를 리턴하는데 context(인자값)을 넣어서 한다. ◾ Each widget has its own BuildContext, which b..

◾ 완성모습 앞서 아이콘을 넣어서 만든 메뉴에 햄버거 버튼을 눌렀을 때 사이드로 열리는 메뉴를 만들었습니다! flutter에서는 drawer이라는 것으로 쉽게 만들 수 가 있답니다! ◾ 기본 구성 drawer 을 만들고, 그 안에 자식 위젯(child)으로 ListView를 만들어줍니다. 그 자식 위젯 안에 또 다른 하위 위젯(children)을 생성해줍니다. ListView는 두가지로 구성이 됩니다. 일단 Header부분에서 계정이름, 프로필 사진 등을 넣어주고, 다른 페이지로 넘어갈 수 있는 메뉴를 ListTile이라는 이름 아래 생성해줍니다 ListTile구성에 보시면 onTap이 있는데, 이 부분은 나중에 가면 더 깊게 공부할 예정이지만 간단하게 onPressed와 비교해보자면 onPressed는..

◾ 완성 모습 ◾ code class Grade extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.amber[800], appBar: AppBar( title: Text('BBANTO'), centerTitle: true, backgroundColor: Colors.amber[700], elevation: 0.0, //left side leading: IconButton( icon: Icon(Icons.menu), onPressed: () { print('menu button is clicked'); }, ), actions: [ IconButton( ..

1. Flutter에서 위젯이란? UI를 만들고 구성하는 모든 기본 단위 요소를 위젯이라고 합니다. 눈에 보이는 요소뿐만 아니라 보이지 않는 요소들까지도 위젯이라고 합니다. 한마디로 Eveything is Widget. 2. 위젯 타입 Stateless widget 상태가 없는 정적인 위젯을 뜻합니다. 스크린상에 존재는 하지만 아무것도 가지지 않고, 실시간 데이터 저장을 못하는 위젯입니다. 어떠한 상탱를 유발하는 value 값도 가지지 않고 있습니다. 예를 들어서 image, text Stateful widget 어떤 상태를 가지고 계속 움직임이나 변화가 있는 위젯 사용자 인터랙션에 따라서 달라지는 위젯입니다. 예를 들면 input, checkbox 3. 위젯 구성(트리) 위의 설명처럼 많은 요소들이 위..