목록Flutter (14)
민스씨의 일취일장

WebSocket 통신을 위한 간단한 Flutter UI를 구성해 보았다.WebSocket - Flutter 프론트 구성하기1. Flutter 프로젝트 생성기본 프로젝트에 추가해 줄 의존성은 하나이다.web_socket_channelflutter pub add web_socket_channel2. UI 구성간단하게 버튼을 누르면 숫자를 서버로 보내서, 메시지를 받도록 구성해 보았다. 메시지를 받으면 숫자를 1씩 늘려줘 몇번 통신을 주고 받았는지 표시하였다.final WebSocketChannel channel = WebSocketChannel.connect(Uri.parse('ws://localhost:8080/ws'));var cnt = 1;@overrideWidget build(BuildCo..

shared_preference 사용방법에 대한 글이다.Flutter - shared_preference 사용 방법shared_preferences란?shared_preferences는 Android와 iOS의 네이티브 저장소를 사용하기 위해 사용하는 플러그인이다. 네이티브 저장소를 사용할 때, Android는 SharedPreferences API를, iOS는 NSUserDefaults를 사용한다. Flutter에서 shared_preferences는 이 둘을 감싸고 있어 하나의 코드로 함께 다룰 수 있도록 도와준다.사용방법1️⃣ 패키지 설치하기pubspec.yaml에 패키지를 추가해준다.dependencies: shared_preferences: latest_version추가(설치) 후 flutte..

Flutter로 만든 안드로이드 앱 배포 준비 과정 글이다.Flutter로 만든 안드로이드 앱 배포 준비 과정버전 관리가장 먼저 해야 할 일은, 버전을 관리하는 것이다. 하나의 애플리케이션의 버전은 유일해야 하기 때문에 변경 수준에 맞게 버전을 관리해 줘야 한다. 버전 관리는 pubspec.yaml 파일의 version 속성값 관리를 뜻한다.version : major.minor.patch+versionex)version : 1.1.1+15여기서 1.1.1을 버전 이름(version name)이라 하며, 15를 빌드 넘버(build number)라 부르는데, 안드로이드는 버전 코드(version code) iOS에서는 프로젝트 버전(project version)이라고 부르기도 한다.버전 관리 예시1.0...

MateiralApp과 AppBar 각각 title을 갖고 있는 이유에 대한 글입니다.MaterialApp title vs. AppBar title상황MaterialApp에서 title을 설정한 뒤, 색상을 여러 가지 설정해 보아도 설정이 되지 않아 이것저것 살펴보다 Flutter로 앱을 만들 때 title이 두 번 작성된다는 것을 인식하게 되었다.MaterialApp & AppBartitle이 작성되는 곳은 최상단 위젯에서 작성되는 MaterialApp 내에서와 MaterialApp 내 home에 위치하는 Page 위젯의 AppBar 내이다.둘의 차이점공식 문서를 살펴보면 차이가 명확하다.MaterialAppMaterialApp에서의 title은 사용자(device)가 애플리케이션(앱)을 식별하기 위해..

FlatButton이 없어진뒤(deprecated and removed) 새로운 button을 적용해야 한다.FlatButton 없어짐FlatButton이 없어진지 오래되었다. 하지만 여전히 여러 강의자료 등에서 FlatButton을 사용하고 있다. 이렇게 현재 없어진 버튼들을 적용해 실습을 적용해야 할 때 사용할 수 있는 버튼들에 대해서 알아보자.공식문서일단 모든 정보는 공식문서에 잘 설명돼 있다. 공식 문서로 확인하고 싶다면, 아래 링크에서 확인 가능하다. New Buttons and Button ThemesThe basic material button classes have been replaced.docs.flutter.dev새로운 버튼공식문서까지 안가고 현재 글에서 원하는 답을 찾을 수 있게 간..

Text 위젯에서 textAlign을 center 속성으로 지정해도 가운데 정렬이 되지 않는 이유와 해결책에 대한 글이다.Flutter - Text 위젯에서 textAlign 속성 지정으로 가운데 정렬이 되지 않는 이슈현상Text 위젯 사용법을 다양하게 익혀보던 중, textAlign 속성으로 지정할 때 가운데 정렬이 되지 않는 이슈가 있었다.body: Column( children: [ Text( 'center aligned text', textAlign: TextAlign.center, ) ],),원인Text가 html의 span과 같이 문자열이 차지하는 너비 영역만을 차지하기 때문이다. 만약 작성한 텍스트가 길어서 화면 가로 너비를 모두 차지했다면 문제없이 가운데..