Flutter 에서 코딩한 프로그램을 실행시 실행 장치가 Web(크롬)일 경우, 실행된 앱에서 이미지(네트워크를 통해 불러오는)가 로딩되지 않았다. 그리고 엑스박스 안에 "Failed to load network image" 라는 메세지가 있다. 이상하다. 네트워크에 있는 이미지가 문제가 있나? 싶어서 URL을 가져다가 크롬 브라우저 주소창에 붙여넣고 엔터를 치니 사진이 잘 뜬다. 문제를 해결하게 구글링을 했다. StackOverFlow에 있는 설명과 해결책. CORS is a mechanism that browsers use to control how one site accesses the resources of another site. It is designed such that, by default..
flutter 2.3.2 을 쓰고 있다가, 오늘 2.5.2로 업그레이드 했는데 이 때부터 웹(크롭)에서 앱을 올려 테스트 하던것에 문제가 생겼다. 마우스로 스크롤이 되지 않는 것이었다. 이상하다 싶어서 다시 모바일 에뮬레이터로 실행시켜보니, 문제없이 잘 동작했다. 웹에서 돌릴때만 이러한 문제가 발생했다. 구글링을 해보니 flutter 2.5 버전이후부터는 웹(PC)에서 마우스를 이용한 drag를 막아 놓았다고 한다. 그래서 이것을 해결하려면 ScrollBehavior 에서 dragDevices 에 mouse를 추가해줘야 했다. 자세한 내용은 아래 참고. https://flutter.dev/docs/release/breaking-changes/default-scroll-behavior-drag 위의 페이지..
VSCode에서 flutter code를 Chrome에서 실행시키기 위해 F5를 누르면, Failed to create server socket (OS Error: Failed to start accept) 에러가 뜬다. 이 문구를 구글에서 검색하면 해결책으로 flutter run -d chrome --web-hostname=127.0.0.1 --web-port=8080 와 같이 hostname 에 자신을 가리키는 URL을 입력해서 실행하면 된다고 한다. 하지만 실행할 때마다 일일이 저렇게 명령어를 치기에는 귀찮다. 그래찾은 방법이 .vscode 폴더(없으면 생성해서)에 launch.json 파일을 만들어서 아래와 같이 입력하고 저장해놓는 것이다. { "version": "0.2.0", "configur..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bTlisH/btraWUhjHSz/VLVJiL56sJB1juooi0zKd1/img.png)
ScrollController Listview, GridView, CustomScrollView 등과 같은 scrollable widget을 컨트롤 한다. 멤버 변수들을 State objects로 저장하고, 각각 State.build 를 이용해 재사용한다. 하나의 scroll controller는 여러개의 scrollable widgets을 컨트롤할 수 있지만, offset 값을 가져오는 등의 몇몇 동작을 위해서는 하나의 scroller widget 과 연결되어 사용해야 한다. scroll controller는 개별 scrollable widget의 특정 상태를 관리하기 위해 ScrollPosition을 생성한다. custom ScrollPosition을 사용하기 위해서는 ScrollController의..
이번주 Flutter 유튜브의 DecodingFlutter 섹션 에는 "Packages versus Plugins?" 라는 제목의 영상이 올라왔다. https://www.youtube.com/watch?v=Y9WifT8aN6o 나도 궁금했지만 찾아보지는 않았던 부분인데, 업로드된 영상의 제목을 보고 바로 클릭해서 봤다. 한글 자막이 없어 100% 이해를 못해서, 인터넷에서 검색을 해서 부족한 부분을 채웠다. 아래 링크에 있는 글이 잘 정리 되어있는 듯하다. https://www.linkedin.com/pulse/difference-between-dart-package-plugin-flutter-leo-uzair Difference Between Dart Package and Plugin in Flutte..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bUe90j/btraMpvEyOw/lK22f5ur2Iz1c59jCb9wnk/img.png)
CustomPaint CustomPaint는 canvas를 제공하는 위젯이다. painter, child, foregroundPainter가 다 그림을 그리는 property인데 왜 나뉘어져 있는지 모르겠다. 순서대로 painter, child, foregroundPainter를 stack 처럼 쌓아올리며 그린다. 즉, 나중에 그려지는 위젯이 위에 위치한다 CustomPaint에서 제공하는 size의 크기는 크게 3부분의 값으로 부터 영향을 받는다 CustomPoaint 위젯의 크기는 기본적으로 부모 > 자식(child) > size (CustomPaint의 속성) 순으로 우선순위를 둔다. 부모가 크기를 가장 우선적으로 적용하며, 부모에 명시된 크기가 없을 경우 CustomPaint의 자식의 크기를 적용..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/ccDRWw/btq9s2I0Qo0/SqelE1jYKXad9zGZewtVnk/img.png)
참고하는 패키지의 코드에서 addPostFrameCallback이 있다. 아래와 같이 사용되고 있었다. WidgetsBinding.instance!.addPostFrameCallback( function ) WidgetsBinding 부터 찾아봐야겠다. Flutter api 웹페이지에는 아래와 같이 나온다. 그리고 addPostFrameCallback 은, 그리고 WidgetsBinding 이 Mixin 으로 선언되어있는데 뒤에 on 키워드가 있다. on 키워드가 어떤건지 기억이 나지 않아 다시 찾아보았다. 아래 블로그 참고. https://paulaner80.tistory.com/entry/Dart-mixin-%EC%9D%B4%EB%9E%80-1 Dart mixin 이란? 1. 믹스인이 필요한 이유 C..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/u9izG/btq8ubfDHQI/r8KYrmkrM8DdUfslO45990/img.png)
왜 Stack의 첫번째 child로 비어있는 SizedBox를 깔아주는 것일까? 현재 참고 하고 있는 Time table 패키지의 코드를 보면 Stack 위젯의 children의 첫번째로 SizedBox를 사용하고 있다. 내부에 의미있는 child도 없는, 빈 box 를 왜 처음에 깔아두는지 몰라서 검색해 보았다. 참고자료1 (링크) Stack 내에서 자리표시자(a syntactic placeholder)로 SizedBox를 사용한다고 한다. SizedBox는 const constructor라서 그렇지 않은 Container에 비해 컴파일러가 더 효율적인 코드를 생성할 수 있다고 한다. 또한 Container는 SizedBox에 비해 많은 properties 와 methods를 가지고 있어서 초기화 하는..
- Total
- Today
- Yesterday
- UX
- 한빛미디어
- 문제 해결
- 앱 프로그래밍
- BLE
- 다트
- DART
- TextFormField
- position
- 디자인
- 앱
- Syncfusion
- IOS
- Chrome
- TextField
- addPostFrameCallback
- 에러
- UI
- plugin
- Flutter
- 이미지
- 플러터
- hide
- Bluetooth
- error
- 앱개발
- firebase
- 크롬
- SizedBox
- 인사이트
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |