Flutter(121)
-
[025] 플러터 (Flutter) 배우기 - TTS(Text To Speech): 텍스트를 소리로 나타내기
안녕하세요~ totally 개발자입니다. TTS(Text To Speech) 오늘 다룰 부분은 TTS(Text To Speech)입니다. TTS란 용어 그대로 텍스트를 소리로 나타내는 것입니다. 플러터 패키지를 사용하기 때문에 pubspec.yaml 파일에 다음처럼 명시해주시면 됩니다. 그 다음 flutter_tts.dart를 import 해줍니다. 10번째, 11번째 줄처럼 FlutterTts와 TextEditingController 인스턴스를 만들어줍니다. 다음으로는 13-20번째 줄처럼 initState 메소드를 만들어주어 초기화될 때 tts.setLanguage("ko-KR")과 tts.setSpeechRate(0.5)를 사용하여 언어와 언어를 말하는 속도를 지정해줍니다. 영어인 경우에는 "en-..
2023.01.20 -
[024] 플러터 (Flutter) 배우기 - Lifecycle (플러터 생명주기)
안녕하세요~ totally 개발자입니다. 오늘 이 시간에는 플러터의 Lifecycle 생명주기에 대해서 살펴보도록 하겠습니다. 플러터에는 Stateless Widget과 Stateful Widget으로 나뉘어집니다. Stateless Widget은 제목 그대로 상태 없는 위젯으로 구조가 매우 단순합니다. Constructor라고 하는 생성자와 Widget build가 사용되어 화면에 출력될 내용을 표시합니다. 위의 예제를 보시면 extends StatelessWidget으로 표시되어 있고 const STATELESSWIDGETEXAMPLE() 생성자를 만들어줍니다. 그 다음에 @override를 작성한 뒤에 Widget build(BuildContext context)로 출력할 위젯을 작성하면 됩니다. ..
2023.01.17 -
[023] 플러터 (Flutter) 배우기 - Shared Preferences (디스크에 간단한 데이터 저장)
안녕하세요~ totally 개발자입니다. SharedPreferences 오늘 살펴볼 부분은 SharedPreferences입니다. 간단한 자료를 디스크에 저장할 때 유용하게 사용되며 방대한 자료는 이 방법을 권장하지 않습니다. 이 SharedPreferences는 다양하게 사용될 수 있습니다. 예를 들어 사용자의 정보를 기억한다던지 앱을 사용하고 종료한 후 기존에 설정해두었던 데이터를 불러오는 상황에서 유용합니다. 사용 방법은 간단하며 key, value 구조로 되어 있습니다. 사용하는 방법은 아래와 같습니다. 1) pubspec.yaml에 shared_preferences: 2.0.5 (현재 기준 2.0.15이지만 필자는 2.0.5로 진행했습니다)를 입력합니다. 버전 및 공식 문서는 아래에서 확인하시..
2022.12.11 -
[022] 플러터 (Flutter) 배우기 - FutureBuilder, Future, Async, Await, 로딩표시, JSON 파일 불러오기
안녕하세요, totally 개발자입니다. 오늘 다룰 부분은 좀 방대하지만 Flutter에서 반드시 알아야 할 부분으로 FutureBuilder, Future, Async, Await, 로딩 중일 때 로딩중임을 표시하는 방법, JSON 파일을 불러오는 플러터에서 불러와서 출력하는 방법들입니다. 이 개념은 비동기(Asynchronous) 처리로써, 보통 한 작업을 처리하고 나서 다음 작업을 처리하는 반면, 비동기에서는 한 작업을 일단 처리를 시작하고 처리가 끝나지 않았음에도 불구하고 다음 코드 작업 실행에 착수합니다. 그 때 플러터에서 사용하는 개념이 Future, Async, Await입니다. async 키워드는 함수 부분에 붙여주고 await는 실행해야 하는 함수 앞에 붙여주면 됩니다. 바로 예제를 확인..
2022.11.30 -
[021] 플러터 (Flutter) 배우기 - Youtube Video (유튜브 동영상 삽입)
안녕하세요~ totally 개발자입니다. Youtube Video 오늘은 플러터에 유튜브 동영상을 삽입하는 방법에 대하여 알아보겠습니다. 이 유튜브 동영상 삽입을 위해서는 플러그인을 사용해야 하는데 진행 과정은 아래와 같습니다. 1. 플러그인 설정 2. Info.plist 수정 3. 동영상 및 비디오 컨트롤러 추가 먼저 플러그인 설정부터 확인해보도록 하겠습니다. 1. 플러그인 설정 우선 프로젝트 경로에 있는 pubspec.yaml 파일을 찾고 dependencies: 아래 줄에 youtube_player_flutter: 을 추가해줍니다. 2. Info.plist 수정 ios -> Runner -> Info.plist에 5,6번째 줄처럼 io.flutter.embedded_views_preview 넣어줍니..
2022.11.11 -
[020] 플러터 (Flutter) 배우기 - Navigator (화면 이동 - Navigator push, pop)
안녕하세요~ totally 개발자입니다. Navigator 오늘 다룰 부분은 Navigator로 화면을 이동하고 전환할 때 사용됩니다. Navigator는 스택(Stack) 구조를 통하여 구현되며 제일 간단하게 다음 화면으로 이동, 이전 화면으로 이동 이 2가지를 먼저 이해하면 됩니다. 그 2가지는 push와 pop입니다. push를 사용하는 것이 다음 화면으로 이동, pop을 사용하면 현재 화면을 꺼내기 즉 이전 화면으로 돌아가는 형태가 됩니다. 바로 예제로 들어가보도록 하겠습니다. 첫 번째 스크린입니다. Navigator.push 메소드를 이용하면 다음 화면으로 전환할 수 있는데, 그 구조는 18-23번째 줄처럼 Navigator.push(context, MaterialPageRoute(builder..
2022.11.05