develop 52

[Flutter] dropdown button 만들기 iOS 스타일과 안드로이드 스타일

Cupertino와 Material 우선 Cupertino는 iOS 스타일이고, Material은 android 스타일이다. Material app 으로 감싸고 있든, cupertino 로 감싸고 있든 dropdown은 어떤 스타일이든 만들 수 있다. dropdown button 만들기 iOS스타일 우선 iOS 스타일로 dropdown 을 만들때에는 아래의 공식 사이트를 참고 했다. https://docs.flutter.dev/development/ui/widgets/cupertino Cupertino (iOS-style) widgets A catalog of Flutter's widgets implementing the Cupertino design language. docs.flutter.dev //..

develop/Flutter 2023.04.17

[flutter] json Dart Model 객체로 맵핑하기 라이브러리 X 웹으로 생성

iOS로 개발하기로 해놓고 냅다 flutter 다시하기,,, 한입으로 두말하기 넘 자연스럽다~ .fromJson, .toJson 함수로 일일이 맵핑하기에는 좀,,,,,, 귀찮다.. 라이브러리가 있지만, 솔직히 소규모는 필요없다.. 개인개발자들에게는, 그리고 라이브러리,, 가 더 귀찮은 나 같은 개발자 json을 넣으면 Model 객체를 생성해주는 서비스가 많은데 dart라고 없을까..! Json 값을 넣으면 dart 모델 생성할 수 있다. https://javiercbk.github.io/json_to_dart/ JSON to Dart JSON to Dart Paste your JSON in the textarea below, click convert and get your Dart classes for..

develop/Flutter 2023.04.14

[Flutter] 그림자 버튼 만들기 BoxShadow 사용하기

요즘 유행하는 그림자 버튼 UI를 만들어 보자 BoxShadow를 사용하여 그림자를 줄 수 있다. GestureDetector를 사용했지만, 버튼으로 감싸도 가능.. GestureDetector( onTap: (){// Action}, child: Container( decoration: BoxDecoration( color: Colors.white, // background color boxShadow: [ BoxShadow( color: Colors.grey.withOpacity(0.5), spreadRadius: 5, blurRadius: 7, offset: Offset(0, 1), ), ], shape: BoxShape.circle, ), child: Container( margin: EdgeIn..

develop/Flutter 2023.04.09

[Flutter] iOS 개발에서 Flutter, 다시 iOS 개발자로 (Flutter 개발 후기)

iOS개발자에서 Flutter 개발자로 생계형 개발자인 본인은 안드랑 iOS랑 같이 빌드를 해서 부자가 되겠다는 부푼 꿈을 안고 flutter 개발에 뛰어 들었다. ... 뛰어만 들었다. 뭐,, 다른 이유 없이 단순계산으로 iOS앱을 안드에도 배포하면 수익이 2배!! 하며 플루터 개발을 시작한것이다. 정말 크로스 플랫폼이라는 이유로 뭐,, iOS 개발이 잘 맞았으니, flutter도 잘 맞겠지라며 안일한 생각으로 시작했다. 언제나 그렇듯 가벼운 마음으로, 푼돈이라도 벌어보자는 마음으로, 그 결과.. Flutter 개발자에서 다시 iOS개발자로 아이폰 5부터 애플 생태계를 벗어난적 없는 앱등이에게는 flutter의 기본 디자인이 너무 구렸지만 어떻게든 원하는대로 만들어 가려고 했다. 다만, 나는 디자이너 ..

develop/Flutter 2023.03.08

[VSCode] 최근 열었던 파일기록 삭제하기 - 깨끗한 환경 만들기 in Mac Windows

VScode에서 최근에 열었던 기록을 삭제하고 싶을 땐, 어떻게 해야 할까 너무 많아 헷갈리기 때문에 다 지워버릴꺼다.. flutter로 넘어오면서 vscode를 쓰고 있지만, 여전히 어렵다.. 그리고 xcode로 돌아가고 싶은 충동을 느낀다... 안드,, 포기할 수 없지,, 그래 그래 참아보자 하면서 xcode에서 습관처럼 하던 최근 기록 삭제를 하려 한다. 우선 vscode 실행 우리가 지울 건 Ctrl + R 에서 조회되는 아래 사진의 기록을 지울 것이다. 방법 mac : Command + Shift + P windows : Ctrl + Shift + P Clear Recently opened 검색 > 실행 clear를 누르면 이렇게 클린- 해진다. 결론 자기만족과 더러움을 해결했다!

develop 2023.03.07

[Flutter] iOS16업데이트 이후 Flutter 아이폰 기기 연결 안됨 해결하기

OS를 16으로 업데이트 이후 갑자기 폰 연결이 안되어서 실 기기에 빌드 하지 못하고 있었다. 하지만,, 파워 귀찮음으로 그저 시뮬레이터에만 돌렸다 하지만 미룰 수 없어 나의 업데이트.. Xcode 업데이트 마저 하고 빌드하려고 방법을 찾던중 문제 확인하기 flutter doctor 돌리고 나니 ! Error: E의 Apple Watch needs to connect to determine its availability. Check the connection between the device and its companion iPhone, and the connection between the iPhone and Xcode. Both devices may also need to be restarted an..

develop/Flutter 2023.02.12

[Flutter] Theme 다크모드 라이트모드 설정 하기 - 시스템 모드로 사용하기

dark 모드가 세상에 나오고 개발자들과 디자이너들은 더 귀찮고 힘들어진것 같다. 물론 iOS13이후로 눈이 더 편해진 것은 사실이지만 말이다. 사용자 입장에서는 정말 편한데, 개발자와 디자이너들은 뭐.. 귀찮을 뿐이지만 말이다. 그래도 사용자 친화적으로 개발을 하기 위해서는 다크모드와 라이트모드를 모두 지원하는게 좋은 방법 중 하나이며 그렇게 하는건 역시나 귀찮다. 하지만 iOS에 비해 flutter는 파일만 복사 붙여넣기로 증식하면 되서 나름... 편한거 같다. (내 기준) Theme 사용 선언하기 그럼 다크모드를 설정해보자! Theme을 메인에서 설정해주어야 하는 부분이 있는데, 아래와 같이 적용하면 된다. main.dart void main() async { WidgetsFlutterBinding..

develop/Flutter 2023.02.10

[Flutter] Themes Playground 이용하기 앱 색조합 찾기 추천

개인 개발자, 특히 디자인 능력이 모자란 사람이 있다. 는 나.. 개인 개발을 하면서 절실히 느끼는 기획력과 디자인의 중요성 회사 다닐 때는 당연하게 생각하며 디자인 검수받을 때 단전에서 올라오는 빡침을 억누르지 못했는데, 존경하는 디자인 선생님덜.. 죄송합니다. 혼자하니, 덜 떨어진 디자인 능력이 한탄스러울 뿐.. 최근 공개된 themes Playground에서 색 조합을 추천을 해줘서.. 그나마 나은 것 같다. 빨간 워닝 색도 수십가지가 있는 게 너무.. 그 미묘한 차이라는 게 생각보다 크다. https://rydmike.com/flexcolorscheme/themesplayground-v6/#/ Themes rydmike.com 위 사이트에서 추천하는 색 조합이 있다. 이렇게, primary컬러, ..

develop/Flutter 2023.02.08

[Flutter] progress bar 진행률 계산하기 percent_indicator 사용하기

flutter는 progress bar를 지원하지만.. 예쁘지 않다.. ㅎㅎpackage:flutter/src/material/progress_indicator.dart간단하게 설명하자면value : 진행률backgroundColor : 기본 백그라운드 색 color: 테두리 색 valueColor: 진행률 색상  LinearProgressIndicator( value: 0, backgroundColor: Color.fromARGB(255, 138, 65, 65), color: Colors.black45, valueColor: AlwaysStoppedAnimation(Colors.white), minHeight: 10.0, semanticsLabe..

develop/Flutter 2023.02.07