ionic2, Angular에서 Voice Over/Voice Assistant/Talk Back이 켜져 있을 때 원하는 문장을 읽어주는 법 (모바일 접근성)

2019/07/24 - [개발/ionic2, Angular] - ionic에서 모바일 접근성 적용하기 (1) : toast

ionic에서 모바일 접근성 적용하기 (1) : toast

↑위 글과 연결된 글입니다.

지난번에 ionic2, Angular에서 toast를 모바일 접근성을 위해 작업한 적이 있었다.

그러나 그 작업은 ios의 voice over에서는 원하는 대로 동작하지 않았고, 다른 방법이 필요해졌다.

그래서 찾은 것이 MobileAccessibility의 speak이다.

사실 먼저 찾은 것은 swift에서 사용하는 코드였는데 ionic에서 비슷한 코드를 찾아보니 MobileAccessibility에 있었다.

 

코드는 다음과 같다.

 

1. phonegap-plugin-mobile-accessibility를 설치한다.

$ ionic cordova plugin add phonegap-plugin-mobile-accessibility

 

2. 읽기를 원하는 지점에 해당 코드를 삽입한다.

if ((<any>window) && (<any>window).MobileAccessibility) {
  setTimeout(()=>{
    (<any>window).MobileAccessibility.speak(msg);
  }, 1000);
}

msg가 읽기를 원하는 내용이다.

1초 정도 늦게 읽는 것이 원래 읽으려던 것을 읽고 원하는 내용(msg)을 읽도록 하기가 좋았다.

(1초 정도 늦게 읽게 하지 않으면 내가 원하는 내용을 읽다가 원래 읽으려던 것을 읽어버려서 내가 명령한 것이 무시되는 경우를 경험했다)

 

참고 : https://stackoverflow.com/questions/31776907/is-there-any-way-to-have-voiceover-read-a-label-on-command