반응형

애플 개발자 미가입자의 경우,
기기 설치 후 7일만 사용할 수 있습니다.

1. 웹 빌딩하기 www 폴더가 생성됩니다.

ng build

2. ios 빌딩

ionic capacitor add ios

3. xcode 열기

3.1. open a project of file > ios/App/App.wcworkspace선택 > 환경설정 > 계정 설정(+ 계정 추가)

파일 열기 및 계정 설정

3.2. 아이폰 케이블로 연결하기(아이폰과 연결 안될 시 정품 케이블 사용)

3.3. PROJECT의 TARGETS의 App에서 Signing&Capabilities 에서 팀 설정 > iOS Device 설정 > Build(재생버튼)

앱 빌드 설정 및 빌딩

4. 신뢰하지 않는 개발자 해결하기

아이폰에서 설정 > 일반 > 기기 관리 > 개발자 앱 > 신뢰하기

반응형

'프로그래밍 > Ionic' 카테고리의 다른 글

ionic-modal tutorial 예제  (0) 2021.07.03
ion-input 안드로이드 작동  (0) 2021.06.07
아이오닉 form handling  (0) 2020.02.14
Ionic 4 배포하기  (0) 2019.11.08
Ionic 4 searchbar 자동완성  (0) 2019.10.24
반응형

아이오닉(앵귤러)로 Array데이터를 필터링 하는 방법입니다.

 

기존방식: DOM을 직접 수정. Class나 style를 추가하여 DOM에 값을 추가하는 방식이었습니다.

jQuery 및 elemnt에 직접 접근하여 Class 추가 및 제거, style의 display값을 변경합니다.

기존의 방식처럼 element에 속성 값을 추가하려고 하면 에러가 발생합니다.

렌더링 할 때 제어할 수 없는 값이 추가되어 있기 때문입니다.

 

그렇다면 어떻게 해야할까요?

 

프로그래시브 프레임워크에서는 Array data를 직접 서버사이드 렌더링 처럼 처리합니다.

1. 데이터 javascript로 배열 데이터 필터

2. HTML 렌더링

<!-- HTML -->
<ion-header>
  <ion-toolbar>
    <ion-title>숫자 필터</ion-title>
  </ion-toolbar>
</ion-header>
 
<ion-content>
  <ion-item>
    <ion-button color="success" fill="solid" slot="end" (click)="filterArray($event.target, 1)" clickable>짝수</ion-button>
    <ion-button color="medium" fill="solid" slot="end" (click)="filterArray($event.target, 0)" clickable>홀수</ion-button>
  </ion-item>
  <ion-list>
    <ion-card >
      <ion-card-header color="primary">
        <ion-label>위에 필터를 눌러보세요.</ion-label>
      </ion-card-header>
      <ion-item *ngFor="let number of filteredArray; let idx = index;">
        <ion-grid>
          <ion-row>
            <ion-col size-sm="2">
              <ion-label position="floating">{{number}}</ion-label>
            </ion-col>
          </ion-row>
        </ion-grid>
      </ion-item>
    </ion-card>
  </ion-list>
</ion-content>


// angular
import { Component, OnInit } from '@angular/core';

  filteredArray: number[] = [...this.array];
  
  private _array: number[] = [1,2,3,4,5,6];
  private _filter: number[] = [];
  
  constructor() {}

  filterArray(element: HTMLElement, reminder: number) {
    this._addToFilter(reminder);
    if(this._filter.length > 0) {
      this._filter.forEach(_reminder => this._filterByReminder(_reminder))
    }
    this._toggleButtonOutline(element);
  }
  
  private _filterByReminder(reminder: number) {
    this.filteredArray = this.filteredArray.filter(number => number % 2 == reminder);
  }  

  private _addToFilter(reminder) {
    if(this._filter_has(reminder)) {
      this._resetArray();
      this._filter_pop(reminder);
    } else {
      this._filter.push(reminder);
    }
  }

  private _filter_has(reminder: number): boolean {
    return this.filter.indexOf(reminder)>-1;
  }

  private _resetArray() {
    this.filteredArray = [...this._array]
  }

  private _filter_pop(target: number) {
    this._filter = this._filter.filter(num => num != target);
  }

  private _toggleButtonOutline(button: HTMLElement) {
    button['fill'] = button['fill'] == "outline" ? "solid" : "outline";
  }

필터 버튼 보이는 것 때문에 매쏘드에서 reminder의 개념이 헤깔리네요...

반응형

'프로그래밍 > Angular' 카테고리의 다른 글

Pipe 재사용 및 Shared Module 사용법  (0) 2021.07.09
Service VS EventEmitter  (0) 2020.02.19
Dynamic Component  (0) 2019.09.13
Authentication & Route Protection  (0) 2019.09.06
Http  (0) 2019.08.20
반응형

완성된 코드입니다.

import android.content.Context
import android.view.inputmethod.InputMethodManager

val inputMethodManager = activity?.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager

private fun hideKeyboard(inputMethodManager: InputMethodManager, view: View) {
  inputMethodManager.hideSoftInputFromWindow(view.windowToken, 0);
  view.clearFocus()
}

안드로이드 스튜디오를 이용해서 Bottom Navigation Activity를 생성하여 시작하였습니다.

 

안드로이드에서 엔터키 등을 누를 때, soft keyboard를 숨기려고 했는데 안되는 겁니다!

당연히 Keyboard라는 Utility 클래스가 있어서 Keyboard.hide()하면 될줄 알았습니다.

구글링 해보니 InputMethodManager.hideSoftInputFromWindow()를 실행해야 하더군요!

 

InputMethodManager imm=(InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);

방식이 제일 많이 사용되더군요.

 

하 지 만

코틀린에서는 activity.getSystemService()하는데 안되더군요...

InputMethodManager를 불러오기 위해선 activity가 있는지 모르기 때문에 activity?.getSystemService()을 사용할 수 있었습니다.

 

현재 foucs된 view를 가져오거나 윈도우 토큰을 이용해서 view를 주입하여 키보드를 닫아보았습니다.

import android.app.Activity

public static void hideKeyboard(Activity activity) {
  var imm = (InputMethodManager) activity?.getSystemService(Activity.INPUT_METHOD_SERVICE) as InputMethodManager
  var view = activity?.currentFocus
  if (view == null) {view = View(activity)}

  imm.hideSoftInputFromWindow(view.windowToken, 0);
}

오... 상식이 박살나 버렸습니다..

 

EditText에서는 작동하지 않는겁니다! 크흐 멋지다 안드로이드!

 

Fragment가 떠있는 동안에는 Fragment의 Activity를 EditText가 사용할 수 없다고 하네요. 하하하하 :)

더 망가지는 나의 코드~

 

또 한번의 삽을 프니..

Fragment에서 Context를 불러올 수 없는 겁니다 ㅠㅠ

INPUT_METHOD_SERVICE를 갖고있는 Context를 찾을 수가 없더군요..

 

키보드 하나 내리는데... Context와 View / Window가 필요하다니 뭐 조금 생각해보니. 이해는 갔습니다.

keyboard가 독립적으로 나오는것이 아니라는것에 좀 의아했죠.

public static void hideKeyboardFrom(Context context, View view) {
    InputMethodManager imm = context.getSystemService(Activity.INPUT_METHOD_SERVICE) as InputMethodManager
    imm.hideSoftInputFromWindow(view.getWindowToken(), 0);
}

아.. 파라미터 2개 생기고 넘나 아름답네요...


WindowsoftInputMode의 설정값

안드로이는 첫번째 EditText에 초기 포커스 자동적으로 할당하거나 Activity에 focusable을 할당합니다.

일반적으로 Input매쏘드에 따라 fouct이벤트가 반응해야 합니다.

AndroidManifest.xml에서 windowSoftInputMode의 stateAlwaysHidden으로 속성을 설정하면, 초기 포커스 설정이 무시됩니다.

<activity
  android:name=".MyActivity"
  android:windowSoftInputMode="stateAlwaysHidden"/>​

windowSoftInputMode세팅은 자동 focus 이벤트에만 적용되고, 터치 이벤트에 대해서는 적용 안 됩니다.

stateAlwaysHidden이라는 말보다는 ignoreInitalFocus가 훨신 어울리는 네이밍일텐데요.. 엄청 오해를 사게 만드네요.

 

윈도우 토큰을 얻는 다른 방법

view에 포커싱이 안된다면(Fragment를 바꾸었을 경우)

 if (view == null) view = View(activity) 대신에

 

view = root.windowToken

로 대체합니다.

 

키보드가 보이는 포커싱을 지우고 싶을 때(백그라운드에서 어플을 열경우)

매소드 맨 마지막줄에 추가해주세요

view.clearFocus();

stackoverflow.com/questions/1109022/how-do-you-close-hide-the-android-soft-keyboard-using-java?page=1&tab=votes#tab-top

 

How do you close/hide the Android soft keyboard using Java?

I have an EditText and a Button in my layout. After writing in the edit field and clicking on the Button, I want to hide the virtual keyboard when touching outside the keyboard. I assume that this ...

stackoverflow.com

위 글에서 투표수가 제일 많은 답변을 재미있게 바꾸어 보았습니다.

 

저도 2시간정도 소모했던 ㅠㅠ 삽질이였네요! 저처럼 시간버리는분이 없으셨길 바랍니다!

반응형
반응형

애뮬레이터가 켜진뒤 오른쪽 메뉴바 맨아래 ... 을 누릅니다.

qemu-system-x86_64의 화면

...을 누른후 왼쪽 탭에서 [Microphone]을 선택하신후 Virtual microphone uses host audio input을 해주세요~

안드로이드 설정 화면

 

하지만 여기서도 ㅠㅠ 소리 인풋은 있지만 아웃풋은 해결되지 않습니다...

유익한 정보로 도움이 되셨길 바랍니다:)

반응형
반응형

크롬 개발자 툴을 이용하여, HTML 어디에 어느 Event 바인딩 되어있는지 알아보는 글입니다.

 

0. 크롬을 킨다.

1. 아무 사이트나 들어간다.

2. F12를 눌러 개발자 툴을 킨다.

3. 요소선택을 누른다.

4. 원하는 요소(버튼, 인풋)를 선택한다.

5. EventListeners 탭으로 이동한다.

6. 이벤트가 존재한다면 해당 이벤트와 링크를 누른다.


오랜만에 크롬 개발자 툴(이하 개발자 툴)을 써서 HTML을 뜯어보는 시간을 갖았습니다.

 

아주 쉽게 EventListner의 바인딩과 어떤 종류인지, 그리고 어디에 있는지도 쉽게 알 수있게되었죠.

 

구글사이트에서 크롬 개발자툴을 킨 화면

개발자 툴에서 오른쪽 'Event Listeners'를 누르면 아래쪽에 쭉 나열되어 있는것이 보입니다.

 

로그인 버튼에 어떤 event가 바인딩 되어 있는지 알아보겠습니다.

element 선택 기능으로 로그인 버튼에 mouseover한 사진

개발자 툴의 element 선택 하는 기능을 사용하여 로그인 버튼을 선택해보겠습니다.

선택한 element에 바인딩된 이벤트

Event Listener에 보면 click, keydown, keyup 3개의 리스너가 연결되어 있습니다.

 

해당 이벤트를 선택하고, Tree모양으로 나열된 링크를 눌러 보겠습니다.

이벤트 링크를 눌렀을때, JS에 바인딩된 위치를 나타내는 화면

어떤 javaScript파일의 어디에 있는지 나타내고 있습니다.

javascript를 빌드할 때, 중요한 부분은 난독화하고 압축하여 보기는 어렵게 되어있지만, addListener, removeListener 그리고 예외처리와 같이 바인딩 되어있는 것을 수 볼 수 있습니다.

 

음... 예시가 좋지 않은 관계로 국내 사이트로 진행해보겠습니다.

네이버 사이트의 이벤트 바인딩

index.html에 어떤 이벤트가 걸려있는지 보이는군요.

window.document.getElementById('search_btn').click() 

하면 바로 실행이 될것같군요.

 

디버깅 할 때 정말 유용하겠죠!?

 

P.S: 국내 사이트들은 ㅠㅠ 코드에 직관성이 정말 너무 뛰어나네요....

반응형

'프로그래밍' 카테고리의 다른 글

제페토 script unity - Mac OS  (0) 2021.12.27
반응형

안드로이드 에뮬레이터 와이파이 및 3/4/5g이 인터넷에 연결이 안될 때 해결 방법입니다.

 

mac 터미널에 입력합니다.

/Users/<사용자명>/Library/Android/sdk/emulator/emulator @<에뮬레이터이름> -dns-server <dns.server.ip.address>

<~> <>사이의 내용은 사용자마다 다릅니다.

 

<에뮬레이터이름> 확인 방법

/Users/<사용자명>/Library/Android/sdk/emulator/emulator -list-avds

 

<dns.server.ip.address> 확인 방법

환경설정 -> 네트워크 -> Wi-Fi -> 고급 -> DNS

 


맥북 유저 입니다.

 

Android Studio에서 WebView를 만들고 Google사이트에 접속해 보았습니다.

 

그런데

net::ERR_NAME_NOT_RESOLVED

이러한 문구가 뜨는 겁니다!!!!

net::ERR_TIMED_OUT 화면

원인을 알아보니... 여러 경우가 있지만,
저의 경우는 인터넷이 연결되지 않은 경우 였습니다.

 

와이파이 연결표시가 있음에도 인터넷 연결안됨 이라는 글자가 나오더군요!

 

맥북의 인터넷과 안드로이드 인터넷이 다르다면서 흙흙 그래서 stack over flow를 뒤적뒤적했습니다.

 

stackoverflow.com/questions/44535500/internet-stopped-working-on-android-emulator-mac-os

 

Internet stopped working on Android Emulator (Mac OS)

I am using Android Studio 2.3(Latest). Till yesterday it was all good and working, today emulator is not connecting to the data network. I couldn't find any solution working so far. My Mac is runni...

stackoverflow.com

 

근본적인 해결책 보다는 꼼수라고하던데 저처럼 시간손해 보시지 않길 바랍니다.

반응형
반응형

1. 재부팅을 한다( Command + R을 켜질떄 까지 계속 누르고 있습니다.)
켜지면 리커버리 모드 접속됨.

1.2 암호입력 후 들어가서 상단 바에서 유틸리티 -> 터미널

csrutil disable

 


1.3재부팅

2. 재부팅후 터미널 열어서 입력

sqlite3 ~/Library/Application\ Support/com.apple.TCC/TCC.db "INSERT or REPLACE INTO access VALUES('kTCCServiceMicrophone','com.riotgames.leagueoflegends',0,2,0,1,NULL,NULL,NULL,'UNUSED',NULL,0,1551892126);"

 

암호입력

3. 아래 2개 입력

/usr/libexec/PlistBuddy -c "Add NSMicrophoneUsageDescription string" /Applications/League\ of\ Legends.app/Contents/Info.plist
/usr/libexec/PlistBuddy -c "Set :NSMicrophoneUsageDescription Using voice chat" /Applications/League\ of\ Legends.app/Contents/Info.plist


4. 재부팅을 한다( Command + R을 누르고 있는다.)
켜지면 리커버리 모드 접속됨.

4.2 암호입력 후 들어가서 상단 바에서 유틸리티 -> 터미널

csrutil enable


입력
4.3재부팅

 

마이크 권한 테스트 하는 법:

제대로 작동하는지 확인하는 방법은 여러개 있습니다.

 

1. 시스템 환경설정 -> 보안 및 개인정보 -> 개인 정보 보호 -> 마이크

마이크 리스트에 이 있는지 확인합니다.

 

2. 롤 클라이언트에서, 설정(Settings -> 음성(Vioce)

마이크를 테스트합니다.

 

3. 최소 1명이상이 있는 게임 준비화면(lobby)에서 보이스 챗을 실행합니다.

 

버그:

테스트 중, 권한이 세팅되었음에도 음성채팅이 안되는 것을 발견했습니다. 

로비에 들어갈 때, 로비창에서 음성채팅 "연결"을 눌렀지만, 아무런 알림없이 곧바로 연결이 끊어지는 현상입니다.

왜 이런 버그가 발생하는지 모르겠습니다.

이런 버그가 발생하고 어느날 갑자기 음성채팅이 원활이 되었습니다. 아무런 변경을 안했는데 말이죠...

그러니

이러한 경우가 발생한다면 겜을 걍 즐기며 기다려주세요. 언젠간... 됩니다.

 

출처 : www.reddit.com/r/leagueoflegends/comments/k218hl/how_to_fix_voice_chat_on_macos_big_sur/

 

반응형
반응형

버튼을 눌러 다음 씬으로 넘어가는 방법을 알아봅니다.

 

1. 씬을 생성한다. (Title_Scene & Game_Scene)

2. Build Settings

3. 씬 안에 버튼을 생성한다.

4. 버튼을 눌렀을 때 작동할 Object를 생성한다.(Create Empty)

5. Logic을 담당하는 Script파일을 생성한다.

6. Script파일을 Object에 넣는다.

7. 버튼의 On Click()메서드에 Script Logic을 할당한다.


Project[Tab] -> Create -> Scene

Scene의 이름을 "Title_Scene"으로 변경합니다. (동일한 방법으로 "Game_Scene"를 생성합니다.)

 

File -> Build Settings...

Project[Tab]->Title_Scene 클릭 -> Build Settings[window] -> Add Open Scenes

Hierarchy[Tab] -> Create -> UI -> Button

Hierarchy[Tab] -> Create -> Create Empty

GameObject를 "Logic_Object"로 변경합니다.

 

Project[Tab] -> Create -> C# Script

스크립트 이름을 "Logic_Title"로 변경합니다.

// Logic_Title.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;

public class Logic_Title : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }
    
    public void NextScene()
    {
        SceneManager.LoadScene("Game_Scene");
    }
}

Hierarchy[Tab] -> Logic_Object -> Inspector[Tab] -> Add Component -> Logic_Title

Hierarchy[Tab] -> Canvas -> Button -> Inspector[Tab] -> Button (Script) On Click() -> +(Add to List) 클릭

Hierarchy[Tab] -> Canvas -> Button -> Inspector[Tab] -> Button (Script) On Click() -> O (Select Object) 클릭 

Hierarchy[Tab] -> Canvas -> Button -> Inspector[Tab] -> Button (Script) On Click() -> No Function -> Logic_Title -> NextScene()

 

Play를 눌러 실행했지만 버튼이 눌리지 않는경우!

유니티의 버그입니다.

해당 씬(Scene)에서 canvas를 만든 후에 지워주세요.

다시 플레이 하여 버튼의 작동여부를 확인합니다.


 

버튼을 누르면, 버튼이 없는 화면으로 넘어가게 됩니다.

반응형
반응형

복사버튼은 PC 크롬에서만 지원합니다.

1. 재부팅을 한다( Command + R을 켜질떄 까지 계속 누르고 있습니다.)
켜지면 리커버리 모드 접속됨.

1.2 암호입력 후 들어가서 상단 바에서 유틸리티 -> 터미널

csrutil disable 

 


1.3재부팅

2. 재부팅후 터미널 열어서 입력

sudo sqlite3 ~/Library/Application\ Support/com.apple.TCC/TCC.db "INSERT or REPLACE INTO access VALUES('kTCCServiceMicrophone','com.riotgames.leagueoflegends',0,1,1,NULL,NULL,NULL,'UNUSED',NULL,0,1551892126);"

 

암호입력

3. 아래 2개 입력

/usr/libexec/PlistBuddy -c "Add NSMicrophoneUsageDescription string" /Applications/League\ of\ Legends.app/Contents/Info.plist
/usr/libexec/PlistBuddy -c "Set :NSMicrophoneUsageDescription Using voice chat" /Applications/League\ of\ Legends.app/Contents/Info.plist


4. 재부팅을 한다( Command + R을 누른다)
켜지면 리커버리 모드 접속됨.

4.2 암호입력 후 들어가서 상단 바에서 유틸리티 -> 터미널

csrutil enable


입력
4.3재부팅

 

출처 : https://www.reddit.com/r/leagueoflegends/comments/ay9o4s/how_to_fix_voice_chat_in_macos_mojave/

 

반응형
반응형

Service:

내부 컴퍼넌트의 ngOnInit 및 ngOndestroy가 라우터로 인해서 의도와는 다르게 작동할 경우 유용합니다. 실시간으로 데이터 통신을 

하지만, 메모리 leak을 발생할 수 있기 때문에, Subscription을 이용해서 반드시 destory합니다.

 

넓은 범위에 걸쳐 brodcasting을 하기 때문에 child, parent와 상관없이 일정 범위를 지정해준다면 쉽게 data communication에 편리합니다.

편리한만큼 여러 사람들과 개발하면, 그 의미를 잊기 쉽습니다.

 

eventEmitter:

cascading으로 1단계씩 움직일 때 직관적으로 유용합니다. 지정된 형식으로 한정된 범위로 Event를 전송하기 때문에, 개발하는 입장에서 쉽게 이용할 수 있지만, 데이터 변동된 값이 trigger를 작동시키기엔 무리가 있습니다.

반응형

+ Recent posts