전체 글75 [Flutter] 클론 코딩(당근) 기능 추가 - ( week 2 ) 당근 프로젝트에서 추가적으로 기능을 구현한다. Like Button 좋아요 버튼을 클릭 시 하트의 색이 변경되도록 한다. 위젯의 상태가 변경되는 것이므로 해당 Feed 클래스를 Stateful로 변경해주어야 한다. 기능을 사용해서 클래스를 생성하면 기본적으로 StatelessWidget으로 만들어지는데 이를 Refactor를 사용해서 StatefulWidget으로 전환해 준다. StatefulWidget은 두 가지 클래스로 구분이 되는데 build 함수는 State를 상속받는 _FeedState 함수 내부에 있다. 따라서 필요한 기능은 이 영역에서 정의한다. 1. 상태 저장 상태를 저장하기 위해서 변수를 선언한다. 변수는 true, false로 저장되는 bool 타입으로 선언하며 기본값은 false로 해.. 2023. 4. 15. [Flutter] 파일 분리 - ( week 2 ) 코드의 양이 많아지게 되면서 점점 가독성이 떨어지게 되는데 Flutter는 일반적으로 큰 위젯들 단위로 파일을 분리해서 관리한다. 현재 작업이 진행중인 당근을 클론 한 프로젝트의 코드를 분리해 보도록 한다. home_page.dart 현재 main.dart 파일이 위치한 폴더 내에 home_page.dart 파일을 새로 생성해 준다. 그리고 main.dart에 작성한 HomPage 클래스 전체를 home_page.dart 파일로 옮겨준다. 코드를 옮기게 되면 두 파일 모두 에러가 발생한다. home_page.dart에서 발생한 에러는 해당 파일에서도 사용되는 라이브러리에 대한 Import가 필요하므로 상단에 패키지를 불러오는 코드를 작성해 주어야 한다. // home_page.dart import 'pa.. 2023. 4. 15. [Flutter] 클론 코딩(당근) - ( week 2 ) 당근마켓 애플리케이션을 따라 만들어 본다. HomePage StatelessWidget을 상속받은 HomePage 클래스를 선언하고 이 클래스 내부에서 속성들을 통해 화면을 그린다. class HomePage extends StatelessWidget { const HomePage({super.key}); // 생성자, 클래스 객체를 만들때 처음 호출되는 함수(초기화 역할) @override Widget build(BuildContext context) { return Scaffold( body: Center(child: Text("home page")), ); } } 화면에 띄우기 위해서는 HomePage 클래스를 메인함수에서 호출해주어야 한다. class MyApp extends StatelessWi.. 2023. 4. 15. [Flutter] 네비게이션 - ( week 2 ) 앱 안에서 화면을 이동할 때 사용할 수 있다. Flutter에서는 각 화면을 Route라고 부르며 이 라우터를 전환할 때는 Navigator를 사용한다. // 페이지 이동 Navigator.push( context, MaterialPageRoute(builder: (context) => SecondPage()), // 이동하려는 페이지 ); // 현재 화면 종료 Navigator.pop(context); // 종료 Navigator 두 화면을 전환하는 예시 // ignore_for_file: prefer_const_constructors import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp ext.. 2023. 4. 15. 이전 1 ··· 10 11 12 13 14 15 16 ··· 19 다음
