오늘도 공부

Container 레이아웃 치트시트https://medium.com/jlouage/container-de5b0d3ad184 Flutter Layouts Walkthrough: Row, Column, Stack, Expanded, Paddinghttps://medium.com/coding-with-flutter/flutter-layouts-walkthrough-row-column-stack-expanded-padding-5ed64e8f9584 Flutter Layout Cheat Sheethttps://proandroiddev.com/flutter-layout-cheat-sheet-5363348d037e 레이아웃 Flutter 영상 #1https://codingwithflutter.com/

Flutter App Tutorial #1이 글의 모든 내용은 udemy 강좌를 공부하고 따라해본 내용입니다.https://www.udemy.com/dart-and-flutter-the-complete-developers-guide완성 된 형태이다.첫 화면에서 오른쪽 아래 플로팅 버튼 클릭시 오른쪽 화면처럼 이미지와 글자를 가진 뷰가 하나씩 추가되는 형태이다.소스는 http json 을 통해서 가져왔다.소스는 https://github.com/bear2u/flutter-sample-pic.git 에서 확인가능하다. main.dart 시작flutter는 첫진입은 일반적으로 lib/main.dart 로 시작된다.매트리얼 테마를 사용하기 위해서 import를 한다.runApp 은 메테리얼 라이버러리를 통해 실..

Await / Future 비동기 함수 호출Http 로 통신할때 일반적으로 비동기로 호출을 하는 편이다. 비동기란 함수 호출시 블럭이 되지 않고 한번 다 훝고 콜백식으로 완료가 됐을 경우 다시 결과를 받는 경우를 말한다.만약 아래와 같은 코드에서 실행시 결과값은 마지막에 'I got the data' 로 떨어지게 된다.그리고 자바스크립트에서 Promise 형태와 비슷한 걸 볼수 있다.import 'dart:async'; void main () { print('1. start to fetch data'); get('http://weasds.com') .then((data) { print(data); }); print('3. finish call to fetch the data'); } Future get(..

JSON 핸들러서버와 통신시 제일 자주 사용되는 형태가 JSON 이다. 그럼 다트에서는 어떻게 다룰수 있는 지 살펴보겠다.테스트 환경은 https://dartpad.dartlang.org/ 에서 진행한다.import 'dart:convert'; void main() { var rawJson = '{"url": "http://blah.jpg","id":1}'; var parsedJson = json.decode(rawJson); print(parsedJson); print(parsedJson['url']); } ............. {url: http://blah.jpg, id: 1} http://blah.jpg그리고 모델 클래스를 만들어서 매핑하고자 할때에는 값을 키값을 줘서 값을 가져온다음 set ..

Flutter 카카오톡 오픈 채팅방 바로가기 : https://open.kakao.com/o/gsshoXJ StatefulWidgetStatefulWidget은 위젯에 변경되는 state 를 담고 있는 커스텀 위젯을 뜻한다.그럼 어떤식으로 만들어지는 지 살펴보자.우선 StatefulWidget 을 extends 한다.class App extends StatefulWidget { } State를 상속받은 클래스를 만든다.class AppState extends State { int counter = 0; Widget build(context) { return MaterialApp( home: Scaffold( body: Text('$counter'), appBar: AppBar( title: Text("L..

Flutter 카카오톡 오픈 채팅방 바로가기 : https://open.kakao.com/o/gsshoXJ 커스텀 위젯 추가하나의 파일에 많은 코드를 추가시 복잡해지고 길어지는 단점이 있다. 이럴때 파일로 빼서 분리를 할수 있다.임포트 방법내부에 src 폴더를 만들고 그 안에 app.dart 파일을 만들자.클래스 구조를 만들수 있다.import 매트리얼Stateless(StatefulWidget)Widget class 생성Build 함수 구현main.dart 에서 src/app.dart 호출# src/app.dart import 'package:flutter/material.dart'; class App extends StatelessWidget { Widget build(context) { return..

Scaffold 위젯 추가 Flutter 카카오톡 오픈 채팅방 바로가기 : https://open.kakao.com/o/gsshoXJ 기본적으로 모바일 구조가 상단에 Appbar가 있으며 하단에 바텀시트가 있으며 floating action button이 있다.그 구조를 기본적으로 지원하는 하나의 위젯이 Scaffold라고 보면 된다.그럼 하나씩 적용해보자.import 'package:flutter/material.dart'; void main() { var app = MaterialApp( home: Scaffold( appBar: AppBar(), // 추가 ), ); runApp(app); }짜잔~ 이런 타이틀바가 생긴걸 볼수 있다. 이걸 AppBar 라고 한다.그리고 아래 floating butt..

Flutter 시작하기. Flutter 카카오톡 오픈 채팅방 바로가기 : https://open.kakao.com/o/gsshoXJ Flutter는 구글에서 나온 모바일 프레임워크입니다. Reactive Native 와 비슷하다고 보면 될것 같습니다. 네이티브 성격을 가진 하이브리드 앱인 셈이죠.무엇보다 강력한 점은 각 플랫폼(Android, IOS)에 있는 대표 디자인 즉 메테리얼 디자인을 손쉽게 짤수가 있습니다.하지만 플랫폼별로 다르게 나올수가 있는데 그 이유는 메테리얼도 플랫폼에 맞게 바뀌어서 나올 수 있기 때문입니다.만약 IOS 에서 특유의 시스템을 이용하고 싶으면 쿠퍼티노 위젯을 사용하면 됩니다.그 외에도 안드로이드 스튜디어, 비쥬얼 스튜디어 코드등 통합 IDE 도 사용 가능한 점이 큰 메리트입..

GDG 부산 카페 바로가기상하이로 출국올해 처음 GDG 부산에 합류를 하게되었다. 부산에 마땅한 개발행사가 없고 특히나 수도권인 서울에 다 몰려있는 현실이 너무 안타까워서 나라도 나서자라는 마음에 시작하게 된 GDG 부산... 이리저리 착오끝에 구글 IO extended를 작게나마 진행했으며 다음 행사를 앞두고 있다. 그런 와중에 상하이에서 GDG Asia를 진행하니 신청하라고 공지를 봤다. 혹시나 하는 마음에 신청해보고 얼떨결에 뽑히게 되었다. 그렇게 나름 하나씩 준비를 해나가는 과정에서 같은달에 Google IO Extended 2018 Busan 을 개최를 하고 8월 마지막달에 드디어 GDG 아시아 분들이 모여있는 상해로 가게 되었다. 조은님께서 알려주신 유심을 구매를 따로 하고(완소) 입국을 하고..