본문 바로가기

플러터31

[플러터] SearchBar Widget 사용하기 검색기능을 만들일이 있을지 모르겠지만, 예전에 슬쩍 봤었던, SearchBar Widget에 뭔가 신박한 무엇인가가.. 생겼나 살펴보았다.다짜고짜, SearchBar 위젯을 달아본다. 입력창에 별다른 제한을 두지 않으니, 그닥 큰 생각을 할 필요는 없었다.대충 숫자를 사용해서, string list를 만들고, 필터가 걸렸을때 사용할 빈 list를 만들었다. ListString> list = [  "1",  "2",  //... 중간 생략];ListString> filteredList = [];  입력값에 제한을 둔다면 컨트롤러가 필요하겠지만, 이번엔 건드리지 않는 것으로 한다. var textcontroller = TextEditingController();  복잡하지만, onChanged 이하 구문만 .. 2023. 7. 25.
[구글시트] Sheets로 이미지 URL의 EXIF 정보 얻어내기 Sheets로 이미지 URL의 EXIF 정보 얻어내기아래 그림처럼 플러터에서 이미지를 띄워주고, 하단에 EXIF 정보를 표기하고 싶다.    전제사항DB를 Sheets에 저장했다. 즉, 이미지는 별도의 웹에 올려져 있고, 이미지 경로만 있는 셈이다. EXIF 정보를 보기하는 방법은 두가지로, 플러터에서 이미지를 호출, bytecode로 변환, EXIF 정보추출하는 방법과 Sheets에서 미리 EXIF 정보를 추출 각 컬럼에 정보를 기재하는 방식이다. 플러터에서 추출하는 첫번째 방법은 이미지를 호출하는 것과 맞물려서, 퍼포먼스에 악영향을 줄 것이기 때문에 배제가 되었다. 두번째 방법은 Sheets의 appscript를 활용하여, EXIF 정보를 받아오는 방식으로 사전에 한번만 해놓으면 DB에 값이 들어가기.. 2023. 7. 24.
[플러터] 심플 애니메이션 Animated... 위젯을 쓰지 않고, 애니메이션을 사용하기 귀찮지만, 막상 하고 보면 마땅히 쓸 곳은 없고, 애매하다.    ContainerStateful Widget에서 SingleTickerProviderStateMixin 호출class _MainPageState extends StateMainPage>  with SingleTickerProviderStateMixin 컨트롤러와 애니메이션 변수 생성late AnimationController animationController;late Animation animation; 그리고 초기화,@overridevoid initState() {  // TODO: implement initState  super.initState();  animationC.. 2023. 7. 20.
[플러터] minSdkVersion 위치 특정 패키지를 사용하다보면, 최소한의 안드로이드 SDK를 00버전 이상으로 하라고 에러가 뜰 때가 있는데, app > build.gradle 파일을 보면, minSdkVersion 표기가 되어있지만, 음... 어딘가(flutter.minSdkVersion)를 참조하고 있다. 그냥 지우고 숫자를 입력해도 무방은 하다. defaultConfig { // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html). applicationId "com.example.fluttertest" // You can update the following values to match yo.. 2023. 7. 18.
[다트] 리스트 중복 제거 리스트에서 중복을 제거하는 방법이야 여러가지가 있겠지만, 아래 방법은 어떨까? toSet으로 중복을 제거하고, 다시 리스트로 바꿔주는 방법이다. List listSample = [1, 2, 2, 3, 4, 4, 23, 24, 324, 2353, 12, 1, 12]; main() { Set setSample = listSample.toSet(); print(setSample); // Console >> {1, 2, 3, 4, 23, 24, 324, 2353, 12} List setNewList = []; setNewList.addAll(setSample); print(setNewList); // Console >> [1, 2, 3, 4, 23, 24, 324, 2353, 12] print('newList\.. 2023. 7. 14.
[플러터] Map 정렬하기 아래와 같은 dblist Map이 있다고 하면, Mapint, Listdynamic>> dblist = {  0: [1, '가', 8, '나'],  1: [2, '마', 4, '바'],  2: [6, '자', 1, '치'],};  Map의 구성은 아래와 같다. print(dblist);//console >> {0: [1, 가, 8, 나], 1: [2, 마, 4, 바], 2: [6, 자, 1, 치]}  정렬을 위해 Key값을 리스트로 추출하는 방법은 아래와 같다. // 키 값을 리스트로 추출var sortedKeys = dblist.keys.toList(growable: false);print(sortedKeys);//console >> [0, 1, 2]  LinkedHashMap 사용을 위해서는 coll.. 2023. 7. 12.
[플러터] 구글 Sheets 를 DB로 사용해서 갤러리 만들기 #2 갤러리앱얼마전에 갤러리앱을 만들고 있다는 글을 썼었다.   [플러터] 구글 Sheets 를 DB로 사용해서 갤러리 만들기 #1플러터와 DB 이미지 갤러리라면, DB를 구성하고 이미지를 저장하고 관리하는 것이 여간 귀찮은 일이 아닐 것이다.(해본 적이 없어서 추정) 🤭🤭🤭🤭 Firebase로 youtube 리스트를 구성한 적이 있었sunnybong.tistory.com 이번엔 만드는 과정은 아니고, 만들다 보니 debug 모드에서는 아무 문제없지만, release모드에서는 구글Sheets에 호출한 데이터가 불러와지지 않는다. - release 모드인만큼 API키를 별도로 생성해야하는 줄 알고, SHA-1까지 생성은 했으나, 음... 입력할 곳이 없다.- playstore에 출고할 때처럼, 개발자 k.. 2023. 7. 12.
[플러터] .json theme 파일사용하기 main.dart 파일에서 패키지를 임포트 해준다.json_theme.dart는 외부 패키지이므로 pubspec.yaml 파일에 미리 등록을 해줘야 한다. import 'package:flutter/material.dart';import 'dart:convert'; // for jsonDecodeimport 'package:flutter/services.dart'; // for rootBundleimport 'package:json_theme/json_theme.dart'; // for theme decoder  assets 폴더안에 theme.json 파일을 저장해주고, 아래와 같이 불러온다. void main() async {  // 테마데이터 실행 _ from json_theme, asset  Wi.. 2023. 7. 11.
[플러터] 구글 Sheets 를 DB로 사용해서 갤러리 만들기 #1 플러터와 DB이미지 갤러리라면, DB를 구성하고 이미지를 저장하고 관리하는 것이 여간 귀찮은 일이 아닐 것이다.(해본 적이 없어서 추정) 🤭🤭🤭🤭Firebase로 youtube 리스트를 구성한 적이 있었는데, 모바일로 경로를 등록하는 것도 firebase에서 수기로 입력하는 것도 상당히 귀찮다. 그래서, 엑셀처럼 구글 Sheets 로 테이블을 구성하여, DB로 사용하는 방법을 구성해 보았다. GCP/Sheets 작업당연히, GCP 프로젝트를 생성해야한다. 꽤 오래전에 만들어 놓은터라... 무슨 난관이 있었는지 기억나지 않는다.   서비스 계정을 생성한다. 누르기만 하면 된다.   구글 Sheets의 원하는 프로젝트에 들어가서, share 에다가 서비스 계정을 공유해준다. 서비스 계정이 뭔가 했더니.. 2023. 5. 11.
[플러터] 자질구래한 methods PageView web에서 마우스로 swipe하기MaterialApp에서 scrollBehavior를 호출 class PreSetting extends StatelessWidget {  const PreSetting({super.key});  @override  Widget build(BuildContext context) {    return MultiProvider(      providers: [        ChangeNotifierProvider(create: ((context) => MyData())),      ],      child: MaterialApp(        debugShowCheckedModeBanner: false,        scrollBehavior: AppScroll.. 2023. 4. 20.
[플러터] Rive 오랜만에 사용 Riveflutter의 강점 중 하나는 Rive에 있다고들 말한다.그러므로 사용법을 알고 있는 것이 좋겠다. Rive 테스트Flare에서 Rive로 이름을 바꾼 뒤, 기능이 많이 추가되었는데, 기존에 편하게 사용했던 나인데, 오히려 사용에 혼란함이 생겼다.그래도, 무료이기도 하니, 아래와 같은 예제를 오랜만에 만들어본다.* 예제는 모바일에서 똑바로 나오지 않음 애니메이션을 컨트롤 하는 예제로, statemachine 이라는 rive 자체의 control 기능을 사용하지 않고, controller의 isActive를 사용했다. 이 브라우저는 iframe을 지원하지 않습니다  다음은, page transition 을 rive 애니메이션으로 사용한 것이다. 뜻밖의 장벽이 많다.;;;앞으로 더 많은 인터랙션을 .. 2023. 3. 26.
[플러터] web 빌드 그리고 row/column 리스트 개별 관리 Github에 flutter로 만든 웹사이트를 올릴때,flutter build web 으로 빌드web 폴더 pushindex 파일의 경로를 / 에서 ./ 로 수정  Row나 Column 위젯에서,리스트의 일부만 특정한 함수를 적용하고 싶다면, 리스트를 2개로 가르고, 1번리스트에만 기능을 적용한다. 그리고 두개의 리스트를 +로 합쳐준다.아래 예시는 리스트 중 3개의 Container Widget 중 1,2번만 색상이 변경되는 경우를 만들어 본 것이다. 이 브라우저는 iframe을 지원하지 않습니다  child: Row(  mainAxisAlignment: MainAxisAlignment.center,  children: colortilelist +      [        Container(       .. 2023. 3. 16.

티스토리툴바