웹 페이지에 iOS6의 Smart App Banner 적용하기

iOS6의 새로운 기능 중 하나가 Smart App Banner입니다. 이 기능은 쉽게 말해서 아래와 같이 iOS에 내장된 Safari로 특정 웹페이지를 호출했을 때 화면 상단에 App 배너가 나타나게 하는 기능입니다. 적용을 위해서는 웹 페이지에 간단한 메타태그 한 줄만 넣어주면 됩니다. 참 간단하죠.   자 그럼 위 태그에 입력해야할 값들에 대해서 알아보겠습니다. 1. name 이 부분은 그냥 위와 같이 적어주시면 됩니다. itunes에 적용된 앱이라는 것을 명시하기 위함입니다. 2. content 2.1. app-id (필수) 앱스토어에 등록된 앱이 부여받은 ID값입니다. 이 값을 알기 위해서는 http://itunes.apple.com/linkmaker/ 에서 검색을 합니다. 저는 아래와 같이 아임리얼맛집을 검색했습니다. 하단에 결과가 나왔죠?  그럼 하단 오른쪽에 있는 “iPhone App Link”를 살포시 눌러줍니다. 아래와 같이 검색된 앱의 상세정보가 나타납니다. 여기에서 중요한 부분은 주소 중 “/idXXXXXXXXX?mt=” 의 XXXXXXXXX에 위치한 숫자입니다. 이 숫자가 app-id에 들어갈 ID값입니다. 2.2. affilidate-data (선택) 이 부분은 관련된 컨텐츠를 등록하기 위한 필드이며, http://www.apple.com/itunes/affiliates/ 에서 등록을 해야 사용이 가능합니다. 따로 테스트해 볼 방법은 없는 상황이라 자세한 사항은 위에 명시한 사이트에서 얻으셔야 합니다. 검색을 하다보니 잘…

가로 타임라인 인디케이터 (Horizontal Timeline Indicator)

핀터레스트에 올라온 UI/UX 관련 자료를 들여다보다가 문득 이런 것이 있으면 어떨까하고 구현하기 시작했습니다. 제목은 Horizontal Timeline Indicator 로 적었는게 이름만 거창하지 단순한 컨셉입니다.   간단히 그려본 기능 정의서입니다. (영문이 다소 잘못 쓰이거나 틀렸더라도 양해부탁드립니다 ㅠㅠ) 화면의 각 섹션은 편의상 색상으로 구분했으며 구성 목적상 세션이라고 표현하겠습니다. (몸담고 있는 회사의 H3 2012 iOS Client 에 적용해볼까해서 만들기 시작했습니다.) 전체는 첫 번째 세션의 시작시간부터 마지막 세션의 끝나는 시간까지를 나타냅니다. 타임라인 위에는 전체 시간 중에서 현재 시간을 나타내는 인디케이터(Indicator A)와 사용자가 터치한 곳의 정보를 보여줄 인디케이터(Indicator B)가 존재합니다. 사용자가 터치를 시작했을 경우에는 터치 후(touchedBegan) 손가락의 움직임(touchedChanged)에 따라 따라 Indicator B가 움직이며 위치한 시간을 알려주는 인디케이터가 나타납니다. (최종적으로는 세션 제목을 보여줄 생각입니다.) 터치가 끝나면(touchedEnded) 움직이던 Indicator B가 Indicator A로 이동하면서 사라집니다. 이 컨트롤러는 drawRect:를 사용해서 각 세션에 색상을 입히는 코드와 UIPanGestureRecognizer를 이용하여 터치 시작/변화/끝을 정의하였고 아날로그 시계 역시 drawRect:를 이용하였으며 drawRect:를 호출하기 위해 [self setNeedsDisplay] 메소드 호출 방법을 사용하였습니다. 현재는 인디케이터에 아날로그 시계만 배치하였지만 여기에는…

UIWebView 배경색 지정 및 그라데이션 없애기

UIWebView를 사용할 때는 검은 배경색에 그라데이션이 지정되어 있다. 기본으로 사용하면 일단 WebView인 것을 알리게 되고 통일성도 없어서 난감할 때가 있다. 이 때 사용할 수 있는 자그만한 팁! – (void)setScrollViewBackgroundColor:(UIColor *)color { for (UIView *subview in [_webView subviews]) { if ([subview isKindOfClass:[UIScrollView class]]) { /* 배경색 지정 */ subview.backgroundColor = color; for (UIView *shadowView in [subview subviews]) { if ([shadowView isKindOfClass:[UIImageView class]]) { /* 그라데이션 숨기기 */ shadowView.hidden = YES; } } } } } 참고 사이트 http://stackoverflow.com/questions/3009063/remove-gradient-background-from-uiwebview http://stackoverflow.com/questions/8667150/uiwebview-background-is-set-to-clear-color-but-it-is-not-transparent

Twitter와 Facebook이 iOS에 통합되면서 바라본 Server와 Client 공유 주체에 대한 생각

iOS5에서는 Twitter가 iOS 내부에 framework로 자리잡았고, iOS6에서는 Facebook이 자리를 잡았다. 이 서비스들의 계정을 담당하는 ACAccount framework가 확장이 가능한 형태였고 다른 서비스들이 여기에 자리잡지 않을까란 생각을 했었는데 역시나였다. 한국에서는 사용빈도가 거의 없는 중국 SNS인 웨이보도 이번 iOS6에 통합되었다. 앞으로 또 어떤 서비스가 ACAccountType으로 자리잡을지… 이 부분에서 궁금점이 하나 생긴다. 기존의 web-based 서비스에 Twitter와 Facebook의 연동은 일반적으로 서버에서 이루어졌었다. 따라서 클라이언트에서는 연동 페이지를 서버측에서 받아서 보여주는 행위만 하였고, 더불어 공유 시 공유를 할 것인가 말 것인가를 서버측에 전달했었다. 하지만 여기서의 단점은 서버측 네트워크 비용이다. 예상 외의 네트워크 비용이 들어간다는 것이다. 그리고 공유 시점이다. 서버 DB에 데이터가 입력이 성공했을 경우 서버측에서는 다시 이를 공유하게 되는데 순차적으로 처리되어야 하기 때문에 사용자는 이 처리가 끝날 때까지 기다려야 했다. 문제는 공유 시점에서 오류가 났을 경우에 클라이언트에서는 오류 메시지를 보내게 되고 사용자는 retry를 했을 때 서버에서는 이를 처리하기 위한 로직이 필요한 상황이 된다. 중복 자료라고 등록을 안하거나 공유만 따로 수행하거나 기타 등등… 만약 이를 클라이언트에서 한다면? 일단…

Facebook Hack – Seoul 간단 참여후기 (1)

2012. 3. 27. Facebook 에서 주최하는 Hack 행사에 참여했습니다. 정확히 세어보진 않았지만 들리는 말에는 약 250여명의 개발자들이 참여했고 대기자도 엄청났지만 장소가 협소해서 더 모시질 못했다고 하더군요. 저는 선조치 후보고로 인해 다행히 참가했습니다. 오전 9시에는 Facebook을 처음 접하는 개발자분들을 위한 Crash Course! 소위 특강이었습니다. 주요 기능들과 함께 용어 배우기, 인증하기, SDK 소개, API 호출 방법 등이 간단히 소개되었습니다. 그 외에 세션들은 아래와 같습니다. Hack 소개에서는 팀 단위로 Social App, Open Graph, Game 세 부분 중 하나를 선택하고 진행한다고 미리 팀을 구성하라고 하더군요. 회사에서 혼자 참여했고 아는 분도 없어서 그냥 Hack 하기 전에 돌아갈까라는 고민도 많았습니다만 밥이라도 먹고 가자라는 생각에 죽치다가 점심을 먹어보고는 저녁도 먹고 가자.. 저녁 먹고는 한 번 해보자! 라고 맘이 시간마다 변해서 Hack까지 참여하고 왔습니다. 우선 Hack 이전에 공유할 정보들을 나열해보겠습니다. 오전에는 세션 순서를 보면 알 수 있듯이 대부분이 개요에 대한 설명이었습니다. 이미 Facebook Documentation에서 언급된 내용들이어서 약간은 실망스러웠습니다. 하지만! 오후 2시 세션인 Native App Development에서는 제 트위터와 페이스북…