android & mobile web : app에서 가로세로 화면전환 rotation을 막아놓은 상태에서 이미지클릭시 이미지를 가로로 full screen으로 보여주려면?

2013-08-14 14:44

쿨럭.... 지금 있는 곳에서 홈페이지의 기능을 축소하여 모바일버전을 출시했는데... 점점 모바일 유입량이 늘더니 폭발하기 시작하여서... 홈페이지 이상의 기능이 요구되기 시작하네요 ㅎㅎ;;

android 뿐만 아니라 곧 작업에 들어가야하는 appstore에 올릴 ios app도 마찬가지인데요;; app에서는 화면전환만 막아두었고 웹뷰로 저희 모바일 웹을 보여주고 있습니다. 생각보다 device의 rotation change 이벤트의 캐치율이 낮아서 화면전환을 application 단에서 막아버렸습니다.

회사의 주무기중 하나인 주식차트를 보여주는게 있는데 화면전환이 막혀있다보니 디바이스가 세로로 놓여있을때 자세한 차트를 보여주기가 힘들어 차트이미지를 클릭하였을때 차트이미지만 가로로 풀사이즈로 보여지게끔 했음 좋겠다네요;; 여기에 가능한지 모르겠는데, 이미지만 보여줄게 아니라 특정 차트나, 체크박스, 라디오박스도 들어가서 여러 이벤트가 먹히게끔 되었음 좋겠다고 하는데.....(가로로 풀사이징된 상태에서)

혹시나 해결하신 분들 계시면 조언을 구하고 싶습니다.

순수 mobile web 상태에서 이미지 클릭시에 가로로 풀사이징 되는것만이라도 해결되면 다음 문제는 또 고민해봐야 알겠지요 ^^;; 아, 이걸 절대 application 단에서 해결하면 안된다고 하네요. 나중에 그냥 순수 모바일웹만으로도 제공이 가능해야 한다 해서요 ^^;;;

실무에 대한 질문은 별로 없길래... 질문드려보아요 ㅋ (물론 server side도 아니구요....ㅎㅎ;;)

3개의 의견 from SLiPP

2013-08-15 21:31

css의 -webkit-transform: rotate(-90deg) 속성으로 답을 찾아보려고 했는데 쉽지 않네요. window의 width/height을 계산해서 이미지에 넣어주는식의 복합처리를 해주면 가능할 것 같긴 한데 내부 컴포넌트들까지 고려해야 한다면 쉽지 않겠네요. 형상이 좀 왜곡되어 우그러지기도 하고요.. 그냥 화면전환 여부를 유저에게 설정할 수 있도록 옵션으로 제공하는게 깔끔하지 않을까 합니다.

2013-08-16 17:26

@진우 답변감사합니다. ㅠㅠ 아쉽게도 화면전환은 절대 안된다고....흑흑흑 이너팝업같은 효과가 갑자기 생각이 나는데, 역시 화면전환 없이는 안되겠죠;;; 이미지 클릭시에 우선 서버에서 새로운 차트이미지를 만들어서 뿌려넣고 width값과 height값을 각각 디바이스 height값, 디바이스 width값으로 설정해준 후에... 화면전환이 되어서 자연스럽게 풀사이징이 되어야할텐데 화면전환이 막혀있어서 안되네욤. 후후;;; rotate를 고려해버리면 애초에 차트이미지가 세로로 그려져야하는데 이럴 경우엔 차트프로그램에서 막혀버리니;;; ㅎㅎ;;; 정말 골치아프네요 ㅋ

2013-08-16 17:33

@kimmunsu 이미지만 보여주는 케이스라면 두벌을 준비해서 뿌려주는것도 괜찮을것 같습니다. 원본이미지랑 90도 회전시킨 이미지 두벌을 생성해서 클릭시에는 회전시킨 이미지를 보여주는걸로-,.-a 컴포넌트는 답 안나오는것 같아요.

의견 추가하기

연관태그

← 목록으로