sd4beatles 님의 블로그

1. Before Start- DrawerFlutter에서 **Drawer(드로어)**는 화면의 왼쪽(또는 오른쪽)에서 슬라이드하여 나타나는 패널로, 보통 내비게이션 메뉴를 표시하는 데 사용됩니다. 드로어는 앱의 다양한 섹션이나 기능으로 쉽게 접근할 수 있도록 해줍니다.- ListTile- SwitchListTile2. Prodjct2.1 Main Drawer 정의(part 01) - DrawerHeaderDrawer는 Scaffold의 dreawer option으로 들어가게 된다. 물론, 그 방대한 Drawer Widget을 option에 집어넣게 된다면, 가독성을 저하시키는 원인이 되므로, 우리는 일단 이를 ./widgets/main_drawer.dart에 집어넣는다.import 'package:fl..

1. copyWith() method만약 우리가 object 또는 관련된 object가 있고, properties를 변경하고 싶다고 가정하자. 그렇다면, 일일히 우리가 성질들을 하나씩 다시 정의내리는 것은 정말로 귀찮은 일이 될것이다. (예를들면, object.prop1=true,object.prop2="red" ....아 같이 말이다.) 이럴 때를 대비해서, 우리는 copyWith method를 사용하게 된다. 이 method는 우리가 변경하고 싶어하는 객체의 성질들과 그에 해당되는 values를 가지고 오며, 변경된 값을 반환한다.2. ColorSchem Class에 관련된 글ColorSchem Class는 따로 글을 남기지 않을 예정이다. 왜냐하면, 아래의 blog가 너무 상세하게 기술하고 있어서,..

1. Dismissible웹을 사용할때, 손가락으로 swiping해서 제거하는 경우를 많이 보았을 것이다. 이러한 기능을 우리 어플에게도 구현을 해보도록 하자. 이럴 때,쓰는 것이 바로 Dismissble이라는 클래스인데, 이는 아래와 같다."Dragging or flinging this widget in the DismissDirection causes the child to slide out of view."Dismissible({required Key key, required Widget child,...)1) Dismissible : Widget child (required)현재 우리의 어플 같은 경우엔, 지우고 싶은 item은 ExpenseItem이며, 해당되는 index의 expense를 집어..

1. Flutter 문법1.1 setState()setState()는 framework에게 현재 객체의 상태가 바뀌었다는 것을 알려주는 method이다. 그렇지만, 여기에는 정말로 주의할 점이 있는데 이는 아래와 같다."변수의 선언 위치가 정말로 중요하다! 변수의 선언 위치에 따라서 변경이 되지 않을 수 있다" *import 'package:flutter/material.dart';class MyWidget extends StatefulWidget { const MyWidget({super.key}); @override State createState() => _MyWidgetState();}class _MyWidgetState extends State { @override Widget buil..

1. TextEditingController Class이전의 방식으로 text filed의 값을 조정하는 방법은 사실 초기변수를 선언해야하고, 그리고 user가 interface를 통해서 값을 집어넣으면,이를 수정하는 함수를 선언도 했어야 했다. 그러나, 이러한 방식은 사실 상당히 귀찮다는 것을 알수가 있다. 이러한 코드라인을 간결하게 해주는 flutter에서 제공되어지는 TexEdigingController class를 대안으로 고려해볼 수 있다."If you modify the text or selection properties, the text field will be notified and will update itself appropriately."이의 공식문서 한 문장이 이 class를 잘 대..

3.1 Setting an AppBar with a Tittleuser가 자산의 expense를 추가할 수 있도록 해주는 하나의 장치를 추가하려고 한다. 이때, 자주 쓰이는 app layout이 바로 appbar이다. 이러한 기본적인 틀을 이용하여 앱의 모양을 만들도록 하자.3.1.1 appBar 설정메인 화면에서 (+) 아이콘 클릭을 하면, 새로운 창이 아래로부터 올라오면서, user가 새로운 expense 를 담을 수 있는 기능을 구현해보도록 하자.이때, 유용하게 사용하는 것이 바로 이다.expenses.dart 파일로 이동해서, 추가적인 코드를 집어넣어 보자. scaffold 부분에서 appBar option을 사용하도록 하자. 이때, 주의할 점은 appBar option은 특정 widget을 매개..

1. Introduction지금까지, 위의 화면을 만들었으며,  widgets을 저장할 수 있는 폴더를 생성해서 담아두도록 하자.- lib|-models|-widgets|-expense\_item.dart|-expenses\_list.dart  현재까지 우리는 아래의 class를 정의내리고 살펴보았다.   그리고 이번 시간에 우리가 정의내릴 class는 바로 Expense Item이다. 자세한 설명은 아래의 내용을 참조할 것.  Expense (일반 Class)  각 Expense가 가져야할 목록들을 지정하는 클래스      - title   - amount   - date   - category    - uuidExpenses (StatefulWidget)- State class에 현재까지 user가 ..

1. Defining Expenses/Expense Widget Class✍️ Flutter Note StatefulWidget, StatelessWidget에 관련된 내용은 "면접질문->Flutter->생명주기 편"을 볼것.- 우리는 두개의 class를 만들예정이다. 이때, 첫번째 widget은 StatefulWidget으로 상시간의 변경을 UI에 반영해 줄 수 있는 widget이다. 다른 하나는, original widget과 소통할 수 있는 state class로 __ExpensesState라고 명시한다. 또한 StatefulWidget은 State객체를 통해서 상태의 변화를 나타내는데,- createState()만들 때 나왔던, 을 로 바꾸며 , Expenses의 constructor에는 pare..