![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/NM1A4/btrxHZ3NUrm/0uF0Dal2TP0AN669vheK6k/img.png)
Size 를 입력할 때 보면, SIze(10, 10) 이렇게 단위 없이 숫자를 입력한다. 이때 10이 픽셀로 얼마정도의 크기인지 가늠이 되지 않아 구글링을 했다. 답은 아래와 같다. 장치마다 pixelRatio가 있으며 이 값을 곱한 값이 pixel값이라는 것이다. 참고 자료 https://stackoverflow.com/questions/50596099/what-is-unit-of-measurement-in-flutter What is unit of measurement in flutter as usual, we use dp for Android and pt(point) for ios as a unit of measurement. 1 pt = 1/72 inch 1 dp = 1/160 inch But i..
Stack 안에서 위젯의 위치를 width와 height로 설정할 때 현재 가능한 영역 내에서 비율로 위치시키는 방법이 궁금했다. width는 왼쪽에서부터 30% 오른쪽으로, height는 위쪽(top)에서부터 20% 아래쪽으로 처럼 말이다. 구글링을 했더니 stackoverflow에 방법이 있었다. 질문은 2017년에 올라온 것이지만, 답변에는 2021년에 올라온 것도 있어 참고할만 하다. 이와중에 이 질문자가 Remi Rousselet 이다~! 답변도 자기가 해놨네. 몰라서 질문했다기보다 알려주려고 한건가보다 Positioned.fill 과 LayoutBuilder를 이용해서 stack 아래에서 사용가능한 영역을 알아낸 뒤에, 원하는 위치에 위젯을 두기 위해 padding으로 나머지 공간을 점유하는 ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/cJtxVh/btroJhSpwNt/a47pvqFQHiAjiMz99Tz6IK/img.jpg)
앱이 실행되는 장치에 따라 앱이 보여지는게 달라진다 가장 큰 문제가 글자 크기 인데, 태블릿이나 pc냐 모바일 폰이냐에따라 표시되어야 하는 글자 크기가 달라지므로 적응적으로 글자 크기를 변화시켜주는 것이 중요하다. 나의 경우, 테블릿 환경에서 작업을 하면서 text 위젯을 fittedBox.scaleDown으로 만들어 넣고있다. 그러면 모바일에서 앱을 실행하더라도 글자를 줄여서 표현되기 때문에 큰 문제는 없었다. 그런데 혹시나 좀더 편리하거나 효과가 좋은 위젯이나 방법이 있나 싶어서 잠시 찾아보았다. Responsive design의 기본적인 정보는 아래링크를 참고하면된다. https://docs.flutter.dev/development/ui/layout/adaptive-responsive Creati..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bffYUS/btroFL7a368/2OaxKKLsEiGFhBflbZLT2K/img.jpg)
Container 크기 지정이 없을 경우 차지할 수 있는 최대의 범위를 가져간다. SizedBox 크기르 지정하지 않을 경우 Child를 나타낼 수 있는 최소한의 layout을 가져간다. Stack 자식들중 가장큰 크기에 맞춘다. 여러 자식들의 Alignment를 다 다르게 주고 싶어서 Align으로 감싼뒤 alignment property에 원하는 Alignment(x, y)를 넣어 보았는데 x축으로는 적용이 되는데 y축으로는 alignment가 적용이 되지 않는다. Stack에 api doc를 보았더니 아래와 같은 내용이 있다. https://api.flutter.dev/flutter/widgets/Stack-class.html Stack class - widgets library - Dart API..
유튜브에서 본 코드를 따라서 사용하다가, scaffoldKey를 생성하던데, 이걸 어디다 쓰는지 모르겠다. var scaffoldKey = GlobalKey(); 이렇게 선언하고 있는데, 전역(scaffold 아래의 어느 위젯에서든)으로 scaffold의 state를 쉽게 참조 할 수 있게 해주는 듯해보이다. 하지만 정확하게 이해하기 위해 구글링을 더 해보았다. https://stackoverflow.com/questions/68993864/scaffold-key-what-the-purpose-is-and-where-it-is-used Scaffold key - what the purpose is and where it is used What is scaffoldKey what the purpose is..
Medium에 찾은 Flutter에서 유용한 VScode 단축키 설명글 (링크) 앱을 만들면서 기본적으로 정의 해줘야 하는 것들에 대해서. 1. 해당 앱에서 사용할 Theme 정의. main.dart 파일이나, theme 파일을 만들어서 정리해두면 좋을 듯. 글씨체, 폰트사이즈, 색상 등등. 2. 화면의 크기에 반응하여 screen이 small인지, medium인지, large인지 알려주는 Class. 이렇게 하면 나중에 화면의 크기에 반응하는 boundary(pixel 값)를 쉽게 수정할 수 있다. 3. App 내에서 보여주는 text 들만 모아둔 파일. 이렇게 해놓으면, 앱에서 다양한 언어를 지원할 시, 이때 사용될 text 파일만 다른 언어로 변경해주면 된다. 4. Debug Banner 삭제
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/6YADJ/btrmxKICLud/o9d2nlE1OSABAkGM6Uio8K/img.png)
오늘 공부하면서 외워야 할 것 정리 assets 폴더는 lib 와 같은 level에 만든다. 그리고 pubspec.yaml 파일에 aseets 폴더를 명시해준다. Controller에 TickerProvider 또는 vsync property는 왜 있는 것인가 궁금해서 찾아보았다. flutter에서 에니메이션을 보여주는 위젯이 가려졌을 때도 Ticker의 duration에 따라 계속 애니메이션을 refresh하는데, 이것을 방지하기 위해서 해당 위젯(this)을 Controller와 연결(binding)하여 해당 위젯이 가려졌을 때 controller도 refresh하지 않도록 하기 위해 사용 된다. (참고 링크) Web 프로그램을 만들때 화면 상단에 App bar라고 해야할지 Tab bar라고 해야할지..
- Total
- Today
- Yesterday
- plugin
- Syncfusion
- 앱
- addPostFrameCallback
- 크롬
- UI
- 인사이트
- 디자인
- Bluetooth
- 플러터
- error
- SizedBox
- 앱개발
- 앱 프로그래밍
- 다트
- hide
- IOS
- TextField
- firebase
- 문제 해결
- BLE
- 이미지
- TextFormField
- UX
- Chrome
- 한빛미디어
- 에러
- position
- Flutter
- DART
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |