본문 바로가기

728x90

플러터3

[Flutter] Flutter 레이아웃 쉽게 이해하기 - 1 (feat. Column,Row,MainAxisAlignment,CrossAlignment) 안녕하세요 Foma 💻 입니다! 정말 오랜만에 Flutter를 다시 공부하는데.. 레이아웃 하는 방법이 iOS와는 달라서.. 헷갈리더라구요. 그래서 레이아웃 하는 방법을 쉽게 이해하기 위해서 글을 정리해보려고 합니다! 바로 시작할게요~ Column 먼저 컬럼 위젯부터 다뤄보겠습니다. 컬럼은 "행"을 뜻하죠? 즉, 세로로 위젯들을 배치하고 싶을 때 사용하는 위젯입니다. 아래와 같이 아무런 옵션을 주지 않으면 왼쪽 상단에 배치되게 됩니다. Column(children: [CircleAvatar(radius: 50.0)]) 컬럼 안에 여러 개의 위젯을 넣으면 아래와 같이 세로로 배치되게 됩니다. Column(children: [CircleAvatar(radius: 50.0), CircleAvatar(radiu.. 2021. 12. 11.

[Dart] Mixin이란? (feat. 여러 클래스 상속받기) 안녕하세요 Foma👟 입니다! Dart에 대한 첫 글을 쓰게 됐는데요. 오늘은 Dart에서 여러 클래스의 코드를 재사용할 수 있는 Mixin에 대해서 알아보겠습니다. 바로 시작할게요~ Mixin이란? 공식 문서에는 아래와 같이 나와있습니다. "Mixin은 여러 클래스 계층에서 클래스 코드를 재사용하는 방법입니다." 덧붙여 Mixin을 사용하기 위해선 with 키워드를 사용해 이름을 적어주면 된다고 나와있습니다. Example 아래와 같이 클래스들이 있다고 가정할게요. 보통 아래와 같이 Player 클래스를 만들고 아래 하위 클래스는 상위 클래스를 상속받아서 메소드를 사용합니다. class Player { void play() { print("경기하는 중..."); } } class BasketBallPl.. 2021. 8. 21.

[Flutter] 이미지와 폰트 적용하기 (Image & Font) 안녕하세요 Foma 입니다! 오늘은 이미지와 폰트 적용하는 법에 대해서 정리해보겠습니다. (비쥬얼 스튜디오 기준으로 설명드릴게요) 바로 시작할게요~ 1. 이미지 비쥬얼 스튜디오에 images파일을 만들어주세요. images 안에 이미지 파일을 넣어주세요. pubspec.yaml 파일로 이동하셔서 아래와 같이 파일 경로와 이미지 이름을 넣어주세요. assets: - images/profile.png AssetImage에 이미지 경로와 이름을 넣어주세요. CircleAvatar( radius: 50.0, backgroundImage: AssetImage('images/profile.png'), ), 이렇게 하면 아래와 같이 이미지가 적용됩니다. 2. 폰트 먼저 아래 구글 폰트 사이트로 가서 원하는 폰트를 다.. 2021. 4. 11.

이전 1 다음

728x90

티스토리툴바