--- title: "모바일 앱을 위한 자동 링크 감지 기능" date: "2019-03-20" categories: - "mobile" - "mobile-development" - "mobiletogether" - "tools" tags: - "app-development" - "mobile-development" - "mobiletogether" - "mobiletogether-server" - "mobiletogether-simulator" description: Altova MobileTogether의 자동 링크 감지 기능은 추가적인 코딩 없이도 URL과 이메일 주소를 클릭 가능하게 만들어 모바일 앱 개발을 더욱 효율적으로 만들어줍니다. --- Status: #blog Tags: #app-development #mobile-development #mobiletogether #mobiletogether-server #mobiletogether-simulator Categories: [mobile-development](/blog/ko/category/mobile-development.md) | [low-code+no-code](/blog/ko/category/low-codeno-code.md) # 모바일 앱을 위한 자동 링크 감지 기능 모바일 앱과 전 세계 웹의 방대한 정보 자원을 통합하면 사용자 경험이 더욱 편리하고 효율적으로 개선됩니다. 특히, 특정 웹 콘텐츠가 자주 업데이트되는 경우에 이러한 효과가 더욱 두드러집니다. Altova사의 로우코드(low-code) 플랫폼인 MobileTogether의 최신 버전이 출시되었습니다 [크로스 플랫폼 모바일 개발 프레임워크](https://www.altova.com/ko/mobiletogether), 이 기능은 라벨 내의 URL 및 이메일 주소를 자동으로 감지하여 지원합니다. 링크를 클릭하거나 탭하면 해당 웹사이트 페이지가 브라우저 창에서 열리거나, 기기의 이메일 앱에서 새 메시지 초안이 새 창으로 열립니다. 이때 모바일 앱은 종료되지 않습니다. 개발자는 별도의 특별 코드를 추가할 필요가 없습니다. ![사용자가 앱과 상호 작용 중입니다](/blog/images/shutterstock_160560011-1.jpg) 자, 어떻게 작동하는지 살펴보겠습니다. MobileTogether에서 "라벨"은 텍스트를 포함하는 레이아웃 컨트롤입니다. 길이는 단일 문자부터 상세 정보가 포함된 여러 줄까지 다양할 수 있습니다. 내용의 경우, 개발자가 미리 정의한 정적인 내용일 수도 있고, 페이지의 특정 요소나 계산된 값에 따라 동적으로 변하는 내용일 수도 있습니다. 라벨의 표시 방식은 한 줄로 제한될 수도 있고, 텍스트 양에 따라 확장될 수도 있으며, 개발자는 표시되는 최대 줄 수를 설정하여 앱 UI 디자인 시 더욱 다양한 옵션을 제공할 수 있습니다. 각 레이블은 개별적으로 정의된 속성을 가지고 있으며, 아래와 같이 스타일 및 속성 창에서 선택할 수 있습니다. ![스타일 및 속성 도우미 창에서 자동 링크 감지 기능을 설정합니다](/blog/images/properties-dialog.png) "자동 링크 감지" 속성은 "없음", "명시적 링크만", 또는 "모든 링크"로 설정할 수 있습니다. 저희는 각 옵션을 보여주기 위해 샘플 앱을 만들었습니다. 아래 스크린샷은 MobileTogether Designer의 시뮬레이터 창에서 실행 중인 앱을 보여줍니다. 각 텍스트 줄은 개별적인 레이블이며, 세 그룹으로 나뉘어 각 자동 링크 감지 설정을 보여줍니다. ![MobileTogether 시뮬레이터 창에 표시되는 자동 링크 감지 기능](/blog/images/link-detection-1.png) 검출된 링크에는 자동으로 밑줄이 표시되며, 해당 링크를 클릭할 수 있습니다. ### 긴 텍스트 블록 내에서의 자동 링크 감지 기능 레이블에는 더 긴 텍스트 블록이 포함될 수 있으며, 이 텍스트 블록에는 여러 개의 링크가 포함될 수 있습니다. 아래 그림은 "모든 링크" 설정을 기반으로, 여러 개의 링크가 감지된 하나의 레이블을 보여줍니다 ![긴 텍스트 블록 내에서 여러 URL을 자동으로 감지하는 기능](/blog/images/link-detection-long-text.png) ### 계산된 텍스트 내에서 자동으로 링크를 감지하는 기능 라벨에 표시되는 텍스트는 XQuery 표현식을 기반으로 계산될 수 있습니다. 저희가 시연을 위해 개발한 "어디에 있나요" 앱은 이러한 기능을 보여주는 예시입니다 [외부 API 데이터와 연동](https://www.altova.com/blog/integrating-apis-and-mobile-apps/) 다음은 계산된 텍스트를 포함하는 몇 가지 레이블의 예시입니다 ![MobileTogether에서 XQuery 표현식을 사용하여 텍스트를 선택합니다](/blog/images/text-by-xquery.png) 이 기능은 사용자가 선택한 내용에 따라 특정 정보로 템플릿 하위 페이지를 채울 수 있도록 합니다. 아래 스크린샷은 안드로이드 기기에서 실행되는 하위 페이지를 보여줍니다. 사용자가 API 키를 수정하기 위해 "설치/업데이트" 버튼 중 하나를 클릭하면, 하위 페이지가 팝업 창으로 열립니다. 또한, 모든 링크에 대한 자동 링크 감지 기능을 통해 사용자는 API 제공업체의 설명 웹 페이지를 브라우저 창에서 열 수 있습니다. [![안드로이드 폰에서 계산된 텍스트에 포함된 링크를 자동으로 감지하는 기능](/blog/images/update-api-key-579x1030.png)](update-api-key.png) 자동 링크 감지 기능을 직접 사용해 보세요 [무료 MobileTogether 디자이너를 다운로드하세요](https://www.altova.com/ko/mobiletogether/download) 여러분이 첫 번째 크로스 플랫폼 모바일 앱 개발을 시작할 수 있도록!