모바일 개발

오늘 공부하는데 선언형 UI에 대해서 알게 되었다. Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('선언형 UI 예시')), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ ElevatedButton( onPressed: () { setState(() { count++; }); }, ..

dart문법을 이용해서 CLI환경에만 결과가 보이는 프로그램을 짤때는 바로바로 함수라던지 다트 문법을 바로바로 사용하면 된다.그런데 flutter 앱을 만들때는 UI코드를 짜고 그 사이에 조건문이라던지, 반복문을 사용해야하는데 이에 대해서 느꼈던 어려움을 말해보려고한다. flutter가 dart 문법을 이용한다는 것을 알것이다. 그러나 flutter는 UI코드를 짜면서 같이 기능을 구현해야하기에 난이도가 올라가는 것은 당연하다. 하지만 시뮬레이터를 이용해서 자신이 만들고있는 것을 바로 볼 수 있다는 장점이 있다. 그렇다면 flutter에서 어떻게 조건문, 반복문등을 쓸 수 있을까.UI를 구성하는 코드를 먼저 보자.flutter는 큰 형식으로는 위의 그림과 같이 큰 영역에서 작은 요소의 위젯이 계층적으로 ..

ListView 기차 앱의 마지막 화면으로 좌석을 선택하는 화면을 만들었다. 이때 선택하는 좌석 부분을 ListView로 구성을 해야했다. 역을 선택하는 화면에서 ListView를 이용했었다. 그래서 쉽게 구성할 것이라고 생각을 했었다. 하지만 이번에는 화면에 ListVeiw로만 구성하는 것이 아니라 다른 구성요소들 사이에 ListView를 넣는 것이었다.                 처음에는 이렇게 했다. 화면을 보면 좌석이 좌우 2줄씩 총 4줄로 구성되어있다. 그래서 세로줄로 된 위젯을 만들고 이것을 가로로 나열 하려고 코드를 짰다.그렇게 하니 리스트뷰를 포함해서 화면 하단의 버튼도 같이 나오지 않는 문제가 발생했다. ListView의 영역이 정해지지 않아서 오류가 발생한거같아 화면에 padding,..

저번시간에 push를 통해서 리스트에서 선택하는 역이 출발하는 역인지 도착하는 역인지 정보를 넘겼었다.onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) => StationListPage('$label'), ), ); },      onTap, 클릭이 되었을 때 실행되는 코드를 짜놓은 것이다. 저 코드를 이미 짜놓고 역을 클릭 했을 때 넘기는 정보도 같은 방식으로 진행하려고 했다. 그래서 같은 Navgiator.push를 써서 코드를 짜보았다. 그러자 코드에서 계속 오류가 발생했다. 오류를 해결하기 위해서 인터넷에 onTa..

오늘은 화면을 전활 할때 정보를 다음 화면에 정보를 전달하는 과정을 연습했다.  왼쪽의 화면에서 출발역과, 도착역을 클릭하면 '출발역', '도착역'이라는 글 정보를 오른쪽으로 넘겨서 상단에 표시할 수 있는 기능이다. 우선 하얀 사자 안에 글씨를 구성하는 코드이다. GestureDetector label(String label, String? station) { return GestureDetector( onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) => StationListPage('$label'), ), );..

ColumnColumn 위젯이란? ⇒ 위젯들을 세로로 배치하는 위젯!RowRow 위젯이란? ⇒ 위젯들을 가로로 배치하는 위젯!TextText 위젯이란? ⇒ 문자열을 화면에 표시하기 위한 위젯!SafeArea핸드폰 기기별로 조금씩 다른 디바이스 UI인 StatusBar(상태바) 영역등에 padding(여백)을 넣어주는 위젯SpacerRow나 Column에서 위젯 사이의 간격을 조정하는 데 사용사용 가능한 모든 공간을 차지함ExpandedExpanded 위젯은 Row, Column 내에서 남은 공간을 확장하여 공간을 채울 수 있도록 하는 위젯SizedBoxwidth 및 height 크기를 가지는 빈 상자상자 내에 위젯을 배치할 수도 있으며 빈 상자로 사용할 수도 있음

오늘은 dart를 넘어서 flutter를 공부하기 시작했다. dart는 개발언어로 기초를 배우는 느낌이라서 재미가 덜했지만 에뮬레이터를 돌리면서 코드로 짠 화면이 핸드폰 화면에 보여지는 것은 확실히 언어만을 공부할때보다 재밌다. 오늘은 앱 파일을 다운로드 후에 실해하는 과정에서 포함된 라이브러리 패키지가 제대로 인식이 안되는 문제가 발생했다. 해결하기 위해서 몇가지를 실행해보았다. 1. 필요한 패키지 설치하기.패키지가 설치 안되어있는 줄 알고 새로 설치하려고 보니, 패키지는 제대로 설치가 되어있었다. 2. 제설치 하기패키지 파일들을 호환성 문제인가 싶어서 문제를 해결하기 위해서 전체 업그레이드를 진행했다. 업데이트를 실시하고 자동으로 flutter doctor에서 문제가 없음을 확인했다. 3. 프로젝트 ..

1. 여러 몬스터의 정보를 읽어오기.첫번째로 맞닦들였던 문제는 몬스터의 정보를 가져오는 것이였다.몬스터의 정보는 하나였던 캐릭터와는 다르게 여러 마리이기 때문에 파일을 두번 나눠서 읽었어야했다.처음부터 파일의 주소에서 정보를 읽어오고나서, 각 몬스터들이 정보로 나누기 위해서 \n를 인식해서 나눠줬다.그리고 각 정보를 몬스터의 속성에 입력해주기위해서 몬스터들의 수만큼 반복문을 돌려서 입력해주고 입력한 몬스터 객채를 다시 monsters라는 리스트에 추가해서 사용했다. 처음에는 character처럼 불러오려다가 이중 리스트인데 어떻게 해야 각 속성에 매치해서 초기화 할 수 있을까 매우 고민했다. 그러다가 반복문을 사용해서 끊었던 list 하나의 정보를 요소로 만들고 다시 이중 리스트에 넣어서 사용하는 방법을..

어제는 파일에 저장된 내용을 읽어오는 방법을 써봤는데 오늘은 파일에 저장하는 방법을 알아봤다.save.writeAsStringSync('파일에 저장할 내용'); 다른 방법이 있을 수도 있지만 위는 어제 쓴 글에 readAsStringSync 방식과 같은 함수를 이용합니다.writeAsStringSync는 사용이 매우 쉽습니다. var save = File('파일 경로')save.writeAsStringSync('저장할 내용'); 먼저 파일 경로를 저장한 후에 경로에 함수를 사용해서 내용을 저장해주면 간단하게 저장하게 된다.

파일 읽기 //csv형식의 text파일을 불러옴 final file = File('lib/characters.txt'); //텍스트 파일의 정보를 String 형태로 변환 final contents = file.readAsStringSync(); //String으로 저장한 파일을 ,를 기준으로 나눠서 분리하기 final stats = contents.split(','); //이후에 저장한 데이터를 3개로 나눠서 리스트 형식으로 다루기 if (stats.length != 3) throw FormatException('Invalid character data'); int health = int.parse(stats[0]); int a..