본문 바로가기

앱 개발

[앱 개발] Flutter SDK is not found in the specified location / Scaffolding / Row(children : [다중 요소] / MainAxisalignment

나를 변화시키는 방법 

 

1. 살고 있는 장소를 바꾼다. 

2. 만나는 사람을 바꾼다. 

3. 내가 사용하는 시간을 바꾼다. 

 

내 자신의 상황을 바꿀 수 있는 것은 결국 나 밖에 없기에, 처음부터 flutter 강의를 다시 듣기로 했다. 

대신 커리큘럼을 따라가기로 ...! 아직 실력이 없는 상태에서 나만의 앱을 만들려고 하니까, 뭐가 잘 안되긴 안된다. 확실히! 

이런 얘기를 하는 이유는, 이전 포스팅과 중복된 내용이 나와도 이해 부탁 ^^!

 

flutter에서 새 프로젝트를 만들어줄 때는 flutter SDK 압출 폴더를 푼 곳에 만들어주어야 한다. 

flutter SDK 압축 폴더를 푼 곳을 우선 확인해준다. 

필자의 경우 flutter\bin으로 잘 설정되어 있는것을 확인할 수 있다. 아닐 그렇다면 왜 이런 문제가 

찾아보니 version 업그레이드를 하라고 해서 했더니 해결되었다. 

flutter --version으로 버전 확인하고, flutter upgrade를 통해 버전 업그레이드를 해보시길 

참 생각해보니 예전보다는 powershell이 좀 익숙하다. 컴알못 시절에는 검은창 나오면 바로 X버튼만 눌렀는데 ㅋㄷ

The project file 'C:\flutter\.idea' already exists. Would you like to overwrite it
(1) 덮어쓰기 : 해당 파일이나 디렉토리가 중요하지 않을때 선택 
(2)  다른 이름으로 저장하기 : 기존 파일 보존 가능, 파일을 새로운 이름으로 저장 
-> 위와 같은 문구가 뜬다면 (2)번의 방법으로 그냥 파일을 새로운 이름으로 저장해주면 된다. 

 

지금의 상황을 바꾸기 위해서는 내가 사용하는 시간을 변화시키는 것만이 유일한 해답이 될 수 있다... 

이 코드가 틀린 이유 

Material app의 home 프로퍼티에 여러 위젯을 사용했기 때문

home 프로퍼티에는 하나의 위젯만이 사용 가능하다. 

또한 SizedBox 위젯에서는 color요소를 직접 지정할 수 없기 때문에, color요소는 child 파라미터를 활용하여 지정 ㄱㄱ

 

위젯 안에 위젯을 넣기 위해서는 위젯의 소괄호 안에 child 파라미터를 넣어줌으로써 위젯을 넣어줄 수 있다. 

하지만 항상 child 파라미터를 사용하는 것은 아니고, 사용할 수 있는 곳이 따로 정해져 있다. 

 

MaterialApp()을 써놓고 시작하면, 구글 스타일의 다양한 위젯을 사용할 수 있고, (커스터마이징 할 경우도 포함) 

Cupertino()를 써놓고 시작하면, 아이폰 스타일의 위젯들을 사용할 수 있다.

-> 꼭 MaterialApp()을 써놓고 시작하자 

 

앱을 상단-중앙-하단으로 나눠주는 Scaffold() 위젯 

 

여러 요소들을 가로로 배치하고 싶다면 Row위젯과 Children 파라미터 사용하기 

여러 요소들을 세로로 배치하고 싶다면 Column 위젯과 Children 파라미터 사용하기

 

Row, Column 요소들을 정렬하려면, mainAxisAlignment 파라미터 활용하기 

 

Row의 경우, mainaxis가 가로이므로, mainAxisAlignment가 가로 정렬이 되고,

Column의 경우 mainaxis가 세로이므로, mainAxisAlignment가 세로 정렬이 된다.

  

mainAxisAlignment: MainAxisAlignment.Center - 가로 정렬 / MainAxisAlignment.spaceEvenly - 가로 정렬 + 간격 맞춤

crossAxisAlignment: CrossAxisAlignment.center - 세로 정렬

위의 틀린 코드를 아래와 같이 고쳐보았다. 

scaffold, Row/Column(children: [  리스트 형태로 다중 요소 넣기  ]  ), mainAxisalignment를 활용해 수정해볼 수 있었다.  

 

그리고 마지막으로, 자동완성 기능 !!!

Ctrl + space 키를 눌러서 자동완성 ㄱㄱ 

파라미터 우측에 뭐 넣을지 까먹었으면, 파라미터에 마우스 올려보면 타입을 정해준다. 

 

오늘의 숙제 

-body에서 여러 요소들을 넣을때는 바로 Row/Column(children : [])를 활용했는데, BottomAppBar의 경우 한번 child 파라미터로 감싸는 과정이 필요하다. => child: Row(Children: [])

-AppBar의 경우 tilte속성을 사용하여 Text위젯을 사용 

-나머지 코드 작성은 위와 동일 

오늘 배운 내용 결과물 

앱은 뭔가 내가 만든걸 앱스토어에 출시할 수도 있다는 생각에 좀 더 재미있게 배우는 것 같다. 목표의식 up