flutter

[Flutter] 이미지 넣기

플러터에서 이미지를 띄울떈 어떻게 해야할까요? 그럴땐 Image 위젯을 사용합니다. 또한, Flutter에서 지원하는 이미지 포맷은 JPEG, PNG, GIF, WebP, BMP, WBMP 입니다. 다만, 웹에서 사용하는 img 태그의 경우 src에 네트워크든 로컬이든 상관 없이 경로를 추가하면 끝이였지만 Flutter의 경우 네트워크 이미지와 로컬 이미지를 불러오는 방식이 서로 다릅니다. 그러면 어떻게 불러오는 지 간단하게 알아보겠습니다! 네트워크 이미지 불러오기 Image.network() Image.network( 'https://flutter-ko.dev/images/flutter-logo-sharing.png'), 위와 같이 이미지 주소를 입력하면 Flutter가 이미지 파일을 다운로드해서 캐시..

Flutter 여백을 주는 위젯

Container 위젯 padding 프로퍼티를 사용하면 여백을 줄 수 있다. Container( padding: EdgeInsets.all(10), ) Padding 위젯 padding 프로퍼티를 사용하면 여백을 줄 수 있다. Padding ( padding: EdgeInsets.all(10), ) EdgeInsets은 뭔가요? padding, margin과 같이 네 개의 방향(상하좌우)에 여백을 줄 떄 사용하는 클래스입니다. TextDirection 의 영향을 받지 않습니다 EdgeInsets 인스턴스를 만드는 방법에 대한 몇 가지 예입니다. //모든 측면(상하좌우) const EdgeInsets.all(0.0) //세로(vertical), 가로(horizontal) const EdgeInsets.s..

Flutter 화면 배치에 쓰는 기본 위젯 정리

위젯 소개 Flutter 위젯은 React에 영감을 얻어 구축되었다. Flutter는 위젯으로 UI를 구성합니다. 1. Container 아무것도 없는 위젯으로 컨테이너 위젯을 사용하여 직사각형 시각적 요소를 작성할 수 있다. 컨테이너는 여백, 패딩, 가로, 세로 등 적용할 수 있다. 또한, 매트릭스를 사용한 3차원 공간에서 변환과 BoxDecoration으로 배경, 테두리, 그림자 등을 장식할 수 있고 child 프로퍼티로 다른 위젯을 자식으로 가질 수 있다. 다음은 Scaffold의 body 프로퍼티에 container를 작성한 예제이다. class _MyHomePageState extends State { @override Widget build(BuildContext context) { retur..