아기개발자의 성장일기

Marquee Widget 만들기 (1) - alternate 에서 이어지는 글입니다. 이 글에서는 1번 타입 (계속 한방향으로 흘러가는 Marquee) 을 만들어본 것을 기록합니다. 참고로 Marquee는 flutter package가 이미 몇개있는데, text 하나만 받을 수 있게 구현되어있더라구요,, 저는 이미지 + text로 된 list를 받을 수 있는 위젯으로 만들어보려고 합니다. text만 scroll하기 원하신다면 이미 잘되어있는 package를 쓰시기를 추천드립니다. [1] 코드 이렇게 Marquee 위젯을 만들어주고 앱에서 테스트 해봅니다. [2] 코드 설명 이전 글의 alternate marquee와 다른 점은 build 메소드와 scroll 메소드 밖에 없는 데요 이거 위주로 살펴보겠..

[1] 용어 보통 Marquee 라고 부르는 것은 두가지 타입이 있습니다. 1) 계속 한 방향으로 흘러가는 Marquee 2) 왼쪽 갔다가 오른쪽 갔다가(?) 를 계속 반복하는 Marquee 이 두개를 각각 나눠 말하는 일반적인 용어를 찾고 싶었는데 못찾았습니다,,, 보통은(특히 웹에서) 1번 타입을 Marquee라고 많이 부르고 있기는 합니다,, (marquee는 현수막이라는 뜻이에요) 그러면 2번을 PingpongMarquee 라고 네이밍해서 일단 만들어보겠습니다. (이름이 잘 안떠오르네요,,😳) ===> (추가) 여기 블로그 에서 봤는데 html에서는 1번을 scroll, 2번을 alternate 속성이라고 부른다고 합니다 [2] PingpongMarquee 만들기 # Step 1. 우선 state..

[1] Device Info Flutter에서 공식 제공하는 device_info 패키지를 사용하면 됩니다. 패키지 설치 후, 예제코드 를 참고해서 구현해주겠습니다. iOS 기기 정보가 예상한 값이 아니죠...? www.theiphonewiki.com/wiki/Models 여기보면 Generation과 Identifier가 각각 있는데요, 위 패키지에서는 Generation을 알려주는 필드는 없고 Identifier를 알려주는 필드만 있습니다 🥲🥲 위의 실행결과에서 iPhone12,1 을 보고 iPhone11이구나! 하고 알아야하는 것입니다..! 하지만 이렇게 매칭하기 힘드니까 pub.dev/packages/ios_utsname_ext 패키지를 쓸 수 있습니다. 이 패키지는 iOSProductionNam..

[ 목표 ] 보통 앱의 설정 탭에 문의하기(또는 피드백 보내기) 기능을 넣어서 사용자가 회사 또는 개발자에게 의견을 보낼 수 있도록 합니다. 아이폰 기준, 기본 메일 앱이 깔려있고 메일 앱에 이메일을 등록해놨다면 email을 보낼 수 있는 폼이 나오고 아니라면 얼럿을 띄워줍니다. (MFMailComposeViewController 로 이 기능을 구현합니다.) '포토위젯' 앱의 경우 '프립' 앱의 경우 검색해보니, 안드로이드는 기본 메일 앱이 gmail이라서 gmail 앱 으로 랜딩시킨다고 하네요. 플러터 문서를 검색해보니 email 관련해서 제공해주는 Widget이나 유틸 같은 것은 따로 없는 것 같고 써드파티 패키지를 검색해보니 나옵니다..! (flutter email send라고 검색하면 됨) 저는 ..

[1] 목표 Flutter의 텍스트에 Gradient 넣어주는 법을 알아보겠습니다. Text의 TextStyle에는 foreground값을 지정해줄 수 있는데요..!! 타입은 Paint 입니다. 이 foreground값을 설정해줘서 Gradient Color를 줘보겠습니다. [2] Paint 클래스 우선 Paint 클래스에 대해서 살펴봅시다. Paint 클래스는 말그대로(?) drawing관련 클래스입니다. 그리고 Constructor는 딱 하나! 디폴트값으로 모든 프로퍼티가 설정되어있는 empty Paint object를 만들어주는 게 있습니다. 그래서 예를들어 이렇게 못쓰고 Paint(color: Colors.white); // 에러 Paint(Colors.white); // 에러 이렇게 써야합니다...

iOS 앱 출시 준비하기 , Android 앱 출시 준비하기 위의 플러터 공식문서를 참고해서 진행한 기록을 남깁니다 ✏️ Part1. iOS Part2. 안드로이드 로 해보겠습니다 🔥 Part 1. iOS [1] Display Name 입력 플러터앱 > iOS > Runner 를 열고 displayname을 입력해줍니다. [2] 앱 아이콘 등록 준비한 앱아이콘을 등록해줍니다. [3] 아카이빙해서 AppStoreConnect 업로드 엑스코드에서 Product > Archieve 해주고 Distributed App 누른 뒤, AppStoreConnect에 업로드해주면 됩니다. Part 2. 안드로이드 [1] DisplayName 입력 안드로이드 > app > src > main에 있는 AndroidManif..

Firebase Dynamic Link를 플러터 앱에 사용해보겠습니다. [ 목표 ] 카톡 공유 > 초대 수락하기를 누르면 앱이 실행되고 특정 화면으로 이동시켜준다! (만약 앱이 안깔려있으면 스토어로 이동 + 사용자가 앱 설치하면 특정화면으로 이동) TODO - 카톡 메세지 템플릿의 '초대 수락하기 버튼'을 만들때 링크를 넣어주기 - 저 링크를 앱에서 받을 수 있도록 하기 [ 구현 큰그림 ] [ firebase_dynamic_links 패키지 설치 ] pub.dev/packages/firebase_dynamic_links 이 패키지를 설치해줍니다. pubspec.yaml에 가서 추가해주고 flutter pub get 명령어를 해주면 끝-! 이제 Part1. 링크 수신하기 Part2. 링크 만들기 Part3..

[1] kakao_flutter_sdk 설치하기 카카오에서 Kakao API를 쓸 수 있는 Flutter SDK를 제공하고 있습니다. (github.com/kakao/kakao_flutter_sdk) 안드, iOS 서포트하고 웹은 곧 서포트해줄 예정이라고 합니다. 저는 카톡공유하기 기능을 만들고 싶어서 Kakao API 중 LinkApi를 쓸 예정입니다. 그럼 우선 패키지를 설치해줄게요. pubspec.yaml > dependencies에 kakao_flutter_sdk: ^0.5.2 를 추가하고 pub get을 눌러주세요 [2] Kakao API 살펴보기 문서를 보면 KakaoAPI는 Token-based API 랑 App key based API로 나눠집니다. 1) Token-based API acc..

[ 문제 ] 안드로이드 스튜디오에서 Run을 해서 앱을 설치한 후, 앱을 날리고 다시 런치해보면 앱이 안나오거나 "iOS 14부터 디버그모드에서는 홈스크린에서 앱을 launch 할수없다. 안드스튜디오나 엑코에서 런치할 수만 있다 !!" 라는 에러메세지가 나오거나 한다. [ Flutter의 빌드 모드 ] 기본적으로 flutter run은 디버그 모드로 컴파일해서 위의 이슈가 발생한 것이다. 프로파일 또는 릴리즈모드로 빌드하면 잘된다. Flutter의 빌드모드 문서를 보고 정리!!+ 근데 저는 문서에 있는대로 안드로이드 스튜디오에서 Run > Run하면 릴리즈가 아니라 디버그모드로 되더라구요,,😳 그래서 명령어로 돌렸어요,,

Clipboard 클래스에는 시스템의 클립보드와 interacting하는 Utility methods들이 있습니다. (문서: api.flutter.dev/flutter/services/Clipboard-class.html ) 저는 setData를 사용해서 COPY를 눌렀을때 코드가 복사되도록 해줄게요 Copy버튼을 이렇게 만들어주면 끝-! CupertinoButton( child: Text("COPY", style: TextStyle(fontFamily: MyFontFamily.gyeonggiMedium, color: MyColor.white, fontSize: 12)), padding: EdgeInsets.zero, color: MyColor.black, onPressed: () { Clipboard...