프로그래밍 193

[vue3] Vue3 프로젝트에서 웹과 모바일 연동 문제 해결 emitter 문제

문제 설명Vue3를 사용하는 프로젝트에서 웹에서는 emitter를 통해 이벤트가 정상적으로 전달되지만, 모바일 앱에서는 이벤트가 전달되지 않는 문제가 발생했습니다. 문제의 원인은 웹과 모바일의 초기 접근 파일이 다르기 때문입니다.문제 원인웹 초기 접근 파일: AppTr.vue모바일 초기 접근 파일: AppMobileTr.vue문제가 발생한 컴포넌트는 infoChartToTr.vue입니다. 이 컴포넌트가 웹에서는 AppTr.vue에 import 되어 있어 이벤트가 정상적으로 처리되지만, 모바일에서는 AppMobileTr.vue에 import 되어 있지 않아 이벤트가 처리되지 않았습니다.해결 방법모바일 초기 접근 파일인 AppMobileTr.vue에 infoChartToTr.vue 컴포넌트를 import 하..

프로그래밍/Js 2024.05.29

앱에서 input 클릭시 뷰포트 안으로 들어오게 하는 방법

this.document.activeElement.scrollIntoView()는 웹 페이지에서 현재 포커스된(활성화된) 요소를 뷰포트(viewport) 내에 보이도록 스크롤하는 메서드 호출을 의미합니다. 이것은 웹 페이지의 사용자 인터페이스에서 특정 요소에 포커스가 주어졌을 때, 해당 요소가 사용자에게 보이도록 자동으로 스크롤하는 데 사용됩니다.용도사용자가 웹 페이지에서 키보드를 사용하거나 특정 상호작용을 통해 요소를 활성화할 때, 해당 요소가 뷰포트 밖에 있을 수 있습니다. 이때 scrollIntoView()를 사용하면 활성화된 요소가 자동으로 뷰포트 안으로 스크롤되어 사용자에게 보여지도록 할 수 있습니다. 이는 특히 접근성 측면에서 유용하며, 사용자 경험을 개선하는 데 도움이 됩니다.작동 방식thi..

프로그래밍/Js 2024.05.08

[flutter] iOS 빌드시 오류 Error (Xcode): Cycle inside Runner

Failed to build iOS app Could not build the precompiled application for the device. Error (Xcode): Cycle inside Runner; building could produce unreliable results. Cycle details: → Target 'Runner': CodeSign /Users/nayakim/Documents/naya/program/me/mobile/webview_flutter_onlyweb_kt/build/ios/Debug-iphoneos/Runner.app ○ That command depends on command in Target 'Runner': script phase “[CP] Embed Po..

[vue3] 컴포지션API 에서 defineEmits 하는 역할은?

이 코드에서 defineEmits는 emit 함수를 반환합니다. emit 함수를 사용하여 이벤트를 발생시킬 수 있습니다. 위의 코드에서는 'Click me' 버튼을 클릭할 때 notifyParent 함수가 실행되면서 'notify'라는 이벤트를 부모 컴포넌트로 발송합니다. 이를 부모 컴포넌트에서 사용하려면 다음과 같이 할 수 있습니다: Child notified! 이렇게하면 자식 컴포넌트에서 발생한 'notify' 이벤트를 감지하고, 그에 대한 처리를 수행할 수 있습니다. 을 사용하면 코드가 간결해지고 가독성이 향상되는 등의 이점을 얻을 수 있습니다.

프로그래밍/vue 2024.01.09

[flutter] home_widget 0.4.0 이용하여 iOS 홈위젯 생성 방법

flutter 프로젝트에서 xcode 실행 ✘ nayakim  ~/Documents/naya/program/mobile/flutter/flutter-codelabs/homescreen_codelab/step_03   main ±✚  ll total 40 -rw-r--r--@ 1 nayakim staff 78B Dec 7 11:25 analysis_options.yaml drwxr-xr-x@ 9 nayakim staff 288B Dec 7 11:33 android drwxr-xr-x 6 nayakim staff 192B Dec 7 11:34 build drwxr-xr-x@ 3 nayakim staff 96B Dec 7 11:25 fonts drwxr-xr-x@ 13 nayakim staff 416B..

[flutter] Flutter에서 홈 화면 앱 위젯 웹뷰 메뉴 바로가기 방법 (안드로이드)

목적 : 홈 화면의 위젯에서 바로가기 메뉴 클릭시 웹뷰의 메뉴 이동 개념도 홈화면 위젯에서 버튼 클릭시 아래와 같은 순서로 실행됩니다. 홈화면 위젯에서 버튼 클릭 -> WidgetProvider -> flutter(main.dart) WidgetProvider 에서는 홈위젯의 어떤 메뉴가 클릭되었는지 확인합니다. 해결되지 않았던부분이 menu1 클릭시 앱이 화면에 보여줘야 되는데 안보이고 내부 데이터만 보여진 부분입니다. 이때의 코드는 아래와 같습니다. 수정전 val backgroundIntentMenu1 = HomeWidgetBackgroundIntent.getBroadcast(context, Uri.parse("myAppWidget://updatecountermenu1")) setOnClickPend..

[flutter] Flutter에서 홈 화면 앱 위젯 2개 만드는 방법 (안드로이드)

flutter 에서 홈 화면 앱 위젯 2개 만드는 방법을 소개합니다. 순서는 아래와 같이 추가해주면 됩니다. AndroidManifest.xml 2번째 위젯 추가 res/xml/widget_info_large.xml 추가 res/layout/widget_layout_large.xml 추가 WidgetProviderLarge.kt 추가 안드로이드 위젯 전체 흐름도 프로젝트 구조 .AndroidManifest.xml 2번째 위젯 추가 Android 홈 화면 위젯 (home widget)을 정의하는 데 사용되는 AndroidManifest.xml 파일의 일부입니다. 위 코드는 두 개의 위젯 (1번 위젯 및 2번 위젯)을 정의하고 각 위젯의 설정 및 동작을 정의합니다. 중요하게 봐야할 코드는 val views ..

[flutter] 인터넷에서 데이터 가져오기 GET/POST (fetch)

목적 : flutter 를 이용하여 인터넷에서 웹페이지 가져오는 방법 1. pubspec.yaml http 모듈 추가 dependencies: http: ^0.13.6 http 패키지를 가져옵니다. import 'package:http/http.dart' as http; 또한 AndroidManifest.xml 파일에 인터넷 권한을 추가하세요. 2. 네트워크 요청하기 Future fetchPrdCd() async { final response = await http.get(Uri.parse('http://abcd.com/quics')); if(response.statusCode == 200) { print('>>>환율위젯받아옴'+response.body); } else { throw Exception("..

[flutter] Flutter에서 홈 화면 앱 위젯을 만드는 방법 1 (안드로이드)

본 포스트에서는 Flutter 앱에서 홈 위젯을 만들어 앱을 더욱 멋지고 화려하게 만드는 방법을 알고자 합니다. 위젯의 버튼을 클릭하면 환율이 변경됩니다. 현재 환율은 랜덤으로 변경된다. -> url 페이지에 받아와서 출력해야함 1. pubspec.yaml home_widget 패키지를 추가 dependencies: home_widget: ^0.3.0 pubspec.yaml name: webview_flutter_onlyweb_kt description: A new Flutter project. # The following line prevents the package from being accidentally published to # pub.dev using `flutter pub publish`. ..