본문 바로가기

[Mobile]/[Flutter]

 (86)
[Flutter] 간단한 로그인 화면 간단하게 위젯 배치로 로그인 화면에 대한 구성을 개발 해보자 간단하게 보면 아래와 같은 구조로 시작해야한다. Stateful 이던 state이던 필수로 구현해야하는 메소드가 있기 때문이다. import 'package:flutter/cupertino.dart'; class LoginPage extends StatefulWidget { LoginPage({Key? key}) : super(key: key); @override State createState() => _LoginPageState(); } class _LoginPageState extends State{ @override Widget build(BuildContext context) { // TODO: implement build throw ..
[Flutter] 화면 구성 위젯 이해하기 1) Container 위젯 별도로 컨테이너에 크기를 지정하면 아래와 같이 변경된다. 컨테이너 안에 컨테이너를 생성할 수 있다. 우선 차일드에 하나의 텍스트를 추가해보자 해당 마진을 주면, 각각의 영역에 마진이 생기게 된다. 이와 반대로 패딩의 개념이 있다. 추가로 컨테이너나 디바이스에 대한 길이값을 알 수있다. 고정된 길이나 높이가 아니라 디바이스 대비 길이나 높이를 구할수 있는 것이다. height: MediaQuery.of(context).size.height/2, 해당 값으로 주게 되면, 디바이스 기준으로 데이터가 설정되게 된다. 2) Column 위젯 여러개의 자식 옵션을 가질수 있다는 특징이 있다. 컬럼말고도 Row 위젯이 있다. 가로로 정렬하냐, 세로로 정렬하냐의 차이가 전부이다. 3) Ro..
[Flutter] 샘플 프로젝트 분석 플러터 프로젝트를 시작하면 아래와 같다. 카운터 어플리케이션 및 주석이 달려있다. import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: const MyHomePage..
[Flutter] 계층 구조 이해하기 플러터에서 위젯은 계층 구조로 이루어져 있다. 뭐 전체적인 모습은 아닐수도있다.하지만 해당 구조로 이루어져 있고 계층 형으로 각각의 부모를 상속 받는다. 위젯의 트리를 반환하는 build()함수를 구현하여, 고유 특성 정의가 가능하다. 계층 구조는 위젯의 UI를 더 구체적으로 표현이 가능하다. 계층들은 앱을 만드는 데 많은 옵션을 주고, 위젯 계층 블록들을 사용할 수 있게 한다. UI는 크게 두가지로 분류한다. 변경되는 화면 or 불변의 화면 사용자가 버튼을 누를때마다 변경되면 StateFul widget이다. 쉽게 얘기하면, 팝업 메뉴 버튼이 있고, 이에 따라 State가 계속 바뀐다고 가정하자 그러면, 해당 앱은 Stateful widget이고 State를 받아서 계속 변경되는 것이다.
[Flutter] 애증의 플러터에 FCM 붙여보기 애증의 플러터...일단개발 공부는 재밌다 ㅎㅎ 일단 이번에는 FCM을 붙여볼 것이다. 1. flutter fcm pub update flutter pub add firebase_messaging 2. Ios xcode configuration update 아래 블로그를 따라서, IOS 앱도 등록하고 background, notification등 필요부분을 설정해주면된다. background fetch 부분은 하지말자! 거기하면 .. 좀 이상해진다. 무튼 APN도 등록해주고, 앱등록도 안했다면 앱 등록도 해주도록 하자. https://firebase.flutter.dev/docs/messaging/apple-integration/ FCM via APNs Integration | FlutterFire iOS..
[Flutter] Boot pay로 정기 결제 구현하기 우선, 플러터로 정기결제 구현하기다. 최대한 간편하고 쉽게 구현할 예정이다. 1) 부트 페이 관리자 세팅 결제수단 설정으로, 샌드박스 모드를 켜둔다. 카드 결제 + 카드정기 결제수단을 허용하기 때문에 해당만 켜두었다. 해당 세팅이 끝나면, web,aos,ios에 대한 아이디 값을 받게 된다.(연동 키값) 2. pubspec.yaml 파일에 추가 dependencies: flutter: sdk: flutter # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. assets_audio_player: ^3.0.6 google_sign_in: ..
[Flutter] IOS 앱 빌드 및 배포 (TestFilght) 1. 앱 식별자 등록 developer.apple.com > 식별자 관리 > Bundle Id에 대한 추가를 해줘야 한다. 아래와 같이 만들고, 새앱으로 이동해준다. 2.신규 앱 등록 해당 신규 앱을 추가하면, 아까 식별자로 등록한 번들 ID가 목록에 노출되며, 등록이 가능하다. 테스트 플라이트 화면을 보면 빌드를 업로드 해야하는데, 이때 Flutter 를 사용해서 빌드를 올리는 법을 알아보자 어차피 테스트던 릴리즈던 전부 같은 빌드 파일을 생성해야한다. 1. 디펜던시 설치 flutterproject / ios / 하위의 경로에서 아래 명령어로, 필요한 디펜던시를 깔아준다. pod install 2. 프로젝트 폴더 이동 후 Runner.xcworkspace를 입력해서 xcode를 열어준다. Product..
[Flutter] Aos 앱 빌드 릴리즈 하기 일단 플러터 기반으로 빌드함. 옛날에는 스무스하게 진행했는데, 다시 해보니까 바뀐것도 좀 있고 그래서 이슈가 많음 그래서, 정리함 나중에 또 고생하기 싫은 나를 위해... 콘솔 플레이스토어 접속 및 앱을 만듬, 패키지 정보를 넣는거나 기타 앱 정보를 넣는 그런건 인터넷에도 많고 그냥 찾아서 할 수 있음 중요한건 appbundle을 빌드하는데 오류가 많음 Appbundle 빌드 1. 키 생성 이렇게 생성하지 않으면, 나중에 빌드할때 알고리즘 관련 이슈가 발생함 keytool -genkey -v -keystore ~/key.jks -keyalg RSA -keysize 2048 -validity 10000 -alias key -storetype JKS 빌드 파일 관련된 내용은 크게 아래와 같음 app/buil..

티스토리툴바