ionic 2.0 에서 카드와 스크롤러를 조합하면 이미지가 스크롤되는 카드를 쉽게 만들 수 있다.

이미지의 크기가 서로 다를 수 있음에 주의해야 하며, 코드에서는 ion-slide 태그에 height:auto 속성을 주어서 작은 이미지는 수직으로 중앙에 위치하도록 설정하였다.

첫번째 사진은 height:auto가 설정된 이미지
두번째는 설정하지 않았을 때
세번째는 풀사이즈

Posted by pjc0247
로컬에서 동작하는 웹앱에서도 제공되는 REST API등을 사용하기 위해 OAuth 인증(구글, 페이스북 등)을 지원해야 하는 경우가 종종 있습니다.

기본적인 OAuth에서는 로그인 단계에서 로그인 제공자가 앱 개발자쪽으로 콜백을 주는 부분이 있는데 이를 별도의 서버를 두지 않고도, 인앱 브라우저의 이벤트를 구독하여 url을 받아 파싱하는것만으로 처리할 수 있습니다.

예제는 의 OAuth를 구현하는것으로 작성하였습니다.

예제를 실행하기 위해서는 InAppBrowser 플러그인을 설치해 주세요


또한 cordova를 위한 oauth 플러그인이 이미 준비되어 있습니다. 조금 유명한 서비스(깃허브, 구글) 등은 이곳에 이미 구현체가 작성되어 있으니 이걸 사용하시면 됩니다.

Posted by pjc0247

Native Scrolling

By default, Ionic 1.2 will use native scrolling on all platforms. When we first built Ionic, native overflow scrolling was very buggy in the browser, and to bring parity with features we’ve come to expect from mobile apps, such as pull-to-refresh and virtual scrolling, we decided we needed to have full control over our scroll view, so we utilized a JS scrolling technique. Generally, this worked okay on iOS but was poor on Android.

A few months ago we released a new version of Ionic with many of the core scrolling-related features implemented to work with the modern overflow scrolling on new devices and browsers (including modern Web Views on Android and Crosswalk). Today we are taking it a step further and making native scrolling the default.

In general, this should be a pretty immediate and possibly significant performance and user experience improvement to your Ionic apps,especially on Android.

However, there’s a slight possibility that the change could impact your app or any external libraries that depended on the old scrolling method, so please test with the new version.

To force Javascript scrolling, use <ion-content overflow-scroll="false">. Note: collection repeat still uses Javascript scrolling which we will phase out in 1.3.

안드로이드 환경에서 엄청나게 버벅이던 스크롤 속도가, 1.2 버전에서 패치되었습니다.

단순히 기존 프로젝트에 ionic 버전을 교체하는것만으로도 엄청난 속도 향상을 불러올 수 있습니다.

직접 테스트해본 바로는
만들다가 스크롤 속도가 엄청 느려서 포기한 프로젝트에 버전만 교체하니 스크롤이 날아다닙니다.

Posted by pjc0247
TAG ionic, scroll