플러터에서 특정 위젯의 크기와 위치를 반환 받는 방법은 아래와 같다. 코드 //GlobalKey를 선언한다. GlobalKey _viewKey = GlobalKey(); void initState(){ //Build가 실행되어 위젯이 그려진 후 해당 함수가 실행된다. WidgetsBinding.instance.addPostFrameCallback((timeStamp) { _getSize(); }); } _getSize(){ //위젯 key로 RenderBox를 정의한다. RenderBox _viewBox = _viewKey.currentContext.findRenderObject(); Offset offset = _viewBox.localToGlobal(Offset.zero); //위젯의 좌표를 반환받는..

플러터에서 글꼴, 폰트를 변경하는 방법이다. 프로젝트 설정 1. 먼저 사용할 폰트를 프로젝트내에 넣어준다. 일반적으로 assets/font/ 폴더 내에 넣는다. 2. pubspec.yaml의 최하단에 보이는 fonts:에 아래의 예시처럼 작성한다. fonts: - family: Yanolja fonts: - asset: assets/font/yanolja_Bold.otf weight: 700 - asset: assets/font/yanolja_Regular.otf - family: Jalnan fonts: - asset: assets/font/JalnanOTF.otf style: italic 예시 코드에서 사용하고자 하는 폰트는 Yanolja체와 Jalnan체이다. family가 코딩 시 사용할 폰트의 ..

[Flutter] 플러터 Web 개발하는 법 플러터는 앱&웹을 동시에 제작할 수 있다. 앱을 크롬과 같은 웹 브라우저에서 실행 시키는 건데, 전통적인 웹과는 인터페이스가 다르다. 디스코드를 생각하면 쉽게 이해가 될 것이다. 플러터 공 muhly.tistory.com 플러터로 웹을 빌드하는 방법은 위의 글을 참고하길 바란다. 이번에는 Firebase를 플러터 웹과 연결하는 방법을 알아보겠다. Firebase 패키지 추가하기 dependencies: flutter: sdk: flutter firebase_core_web: ^1.2.0 pubspec.yaml에 Firebase core web 패키지를 추가한다. 해당 패키지는 단순 연동을 위한 것이며, 데이터 입출력 혹은 로그인을 위해서는 추가 패키지가 필요하..

Text 위젯에서 Click에 따른 이벤트가 필요하다거나, 하나의 Text 라인에서 각 부분들이 다른 TextStyle을 가져야 할때, RichText라는 위젯을 사용한다. 구조가 조금 특이한 위젯이다. RichText라는 최상단 위젯에 text 속성으로 TextSpan 위젯을 준다. TextSpan 위젯은 children을 받을 수 있고, 여기에 TextSpan을 여러개 생성해서 넣어준다. RichText( text: TextSpan(children: [ TextSpan( text: '안녕하세요.', style: TextStyle(color: Colors.black)), TextSpan( text: '저는 ', style: TextStyle(fontWeight: FontWeight.w700)), Tex..

dart에서는 포인터가 존재하지 않는다. 따라서 부모 클래스에서 호출시킨 자식 클래스가 부모 클래스 내부 변수 값을 변화시키기 위해서는 부모 클래스에서 변수 값을 변화시키는 함수를 선언하고, 해당 함수를 자식 클래스의 매개변수로 넘겨주어야한다. 단순하게 설명해서 set, get 형태의 함수를 일반 함수로 선언하고 이를 자식 클래스의 생성자에 넘겨주는 것이다. 단, set,get 형태는 인수로 넘기고 받을 수 없으니 Function의 형태로 넘겨주어야한다. (혹은 typedef로 별도 타입을 생성해준다) 아래는 두 가지 방법의 예시이다. 재사용 가능한 형태의 예시1과 조금 더 간결한 형태의 예시2이다. 예시1. 부모 클래스에서 함수를 생성하고, 함수를 인수로 자식 클래스로 넘겨주는 방법 class Pare..