본문 바로가기

[Mobile]/[Flutter]

(86)
[Flutter] Retrofit, Dio로 편하게 API 통신하자 Flutter로 외부 백엔드와 연동할때가 있다.매번 불필요한 모델을 만들지 말고 아래와 같이 편하게 연동부를 개발하자  1. 먼저 pubspec.yaml에 필요한 패키지를 추가dependencies: dio: ^5.4.0 retrofit: ^4.0.3 json_annotation: ^4.8.1dev_dependencies: retrofit_generator: ^7.0.7 build_runner: ^2.4.6 json_serializable: ^6.7.1 2. api-service.dartimport 'package:dio/dio.dart';import 'package:retrofit/http.dart';part 'api_service.g.dart';@RestApi(baseUrl: "http:/..
[Flutter] Riverpod 적용기 (기본) Flutter로 Riverpod를 적용하여 개발을 진행해보자Riverpod는 누구나 알다싶이, 상태 관리에 대한 기술이다. 상태관리란, 데이터가 변경될때, 메모리관리 또는 UI 컴포넌트 영향등을 관리해주는 기술이라고 이해하면 편하다.야생의 개발자의 경우에는 그냥 일단 개발을 따라 해보고 천천히 이해하는데나도 약간 이런걸 좋아하는것같다? 일단 적용해보자 1. Riverpod 플러그인 추가flutter_riverpod: ^2.6.1 2. Riverpod 요소 StateState는 상태관리의 대상이 되는 Entity라고 이해하면 편하다.class SensorState { final double accX, accY, accZ; final double gyroX, gyroY, gyroZ; SensorStat..
[Flutter] textformfield 클릭시 화면이 리스트를 가리는 현상 흔히 말하는 키보드영역때문에 화면이 가리는 것이다. 가려진 화면만큼 이동하는게 아니라 키보드가 고정처럼 붙어버려서 입력창을 클릭하면 화면이 가려져서 아래와 같이 해결했다. 우선 입력하는 위젯을 크게 scrollview로 감싸줬다. SingleChildScrollView( child: NewMessages2( roomId: widget.chatResponse.id.toString(), userId: userProvider.userInfo.id.toString(), userName: userProvider.userInfo.name, ), ) 사실 이렇게 해도 되지만 해당 위젯의 build 최상위에 아래와 같은 부분도 추가해줬다. 해당 부분을 추가해야지 키보드가 올라왔을때 화면을 밀어준다. @override ..
[Flutter] StreamBuilder State redraw 이슈 최근에 채팅 관련 모듈을 개발하면서, StreamBuilder를 사용했다. 해당 사용할때 이슈가있었는데 해당 부분에 대해서는 아래와 같다. * 채팅 입력 * 채팅 내용 위와 같이 두개의 State를 가지는 위젯들이 있었다. 해당 채팅 내용을 입력할때, 키보드가 위로 올라가면서 화면을 가리는 이슈때문에, 해당 키보드 때문에 화면이 밀리면 다시 그려주게끔 개발을 해놨다. 해당 부분 때문에 StreamBuilder에서 계속 값을 재 connection을 시키려고했다. 해당 이슈로 인해, 조금만 클릭해서 progressbar가 돌았고, 나도 돌았다. 해결 방법은 생각보다 간단하다. 아래와 같이 stream으로 받아오는 변수를 밖으로 빼면 된다. 소스코드는 아래와 같다. import 'package:flutter..
[flutter] 앱에 광고 달기 앱에 광고를 달자 애드몹에 회원가입하고 프로젝트를 연결하는 법 등등은 그냥 보면 알수 있다. 정리를 해도, 사용자 인터페이스가 변경되면 의미가 없어서 패스 무튼, 애드몹의 가입 및 연동을 완료해서 앱 ID가 발급 되었다는 이후 부터 진행한다. 1. 플러터 의존성 추가 flutter pub add google_mobile_ads 2. aos, ios 설정 AOS -manifest.xml ... IOS - info.plist GADApplicationIdentifier [YOUR iOS APP ID] LSRequiresIPhoneOS SKAdNetworkItems SKAdNetworkIdentifier cstr6suwn9.skadnetwork SKAdNetworkIdentifier 4fzdc2evr5.ska..
[Flutter] Icon launcher 사용하기 앱의 아이콘에 대한 리소스를 자동으로 세팅해주는 라이브러리이다. 1. 아이콘 이미지를 assets하위에 세팅한다. 2. flutter dev환경에서 해당 라이브러리르 import 한다. flutter pub add flutter_launcher_icons --dev 3. ./flutter_launcher_icons.yaml 생성 및 해당 파일 내용 추가 flutter_icons: ios: true android: true image_path: "assets/images/app_icon.png" remove_alpha_ios: true 4. 라이브러리 실행 flutter pub run flutter_launcher_icons:main 해당 과 같이 하면, 아이콘이 정상적으로 등록되어, aos,ios에 맞게..
[Flutter] IOS 애플 로그인, 회원탈퇴 IOS 의 심사 과정은 굉~장히 빡세다. 특히 애플은 소셜 로그인이 달려있으면, 애플 로그인이 무조건 달려있어야 하고 로그아웃시 애플 과 연동을 끊었는지를 무조건 본다. 이에 애플 로그인 로그아웃을 정리한다. 애플 디벨로퍼 내용은 조금 어려울 수도있고, 복잡해 보이는데 크게는 그냥 3가지이다. Certificates,Identifiers,Key 이렇게 추가를 해주고 서로 매핑 시켜준다고 보면된다. [애플 로그인 하기] 애플 로그인 애플로그인은 뭐 기타 소셜 로그인과 같이 굉장히 쉽다. sign_in_with_apple: ^5.0.0 AppleDeveloper 설정 (Identifiers, key 생성하기) 이렇게 까지만 하면 일단, 애플 로그인을 위한 설정이 끝난다. 플러터 로그인 소스 나는 apple ..
[Flutter] Rendering Object 오류 Usually, this means that the Expanded widget has the wrong ancestor RenderObjectWidget. Typically, Expanded widgets are placed directly inside Flex widgets. The offending Expanded is currently placed inside a SizedBox widget. 가끔 Expanded를 붙이면 발생하는 오류이다. 이 에러를 해결하기 위해서는 위젯의 상관관계를 알아야 한다. 그냥 무턱대고 쓰면 안되고 Column이나 확장 가능한 위젯 내에서만 사용가능하다. child: Expanded( child: SingleChildScrollView( scrollDirection:..