[질문] 이미지 zoom 관련

JavaScript Titanium
1

안녕하세요~ 개발하는 중에 이미지를 zoom 시킬수 있도록 하는 부분이 있는데요

기존에 소스를 찾다 보니 imageView 를 ScrollView에 add 시켜서 줌하도록 하는 예제를

확인했습니다.

근데 scrollView 자체가 horizontal , vertical 2개의 옵션을 하나만 줄수가 있도록 되있다고 본거같아서요… 실제로 적용을 해도 한부분만 스크롤이 되고…

기본 갤러리의 사진보기 처럼 상하좌수 스크롤이 다 될수 있도록 만들수는 없을까요?

2

scrollView에서 horizontal, vertical 둘다 줄수 있습니다.
주의하실점은 scrollView는 height이 보여주고자 하는 object가 scrollView보다 같거나 작을 경우 스크롤할 필요가 없어지기 때문에 스크롤 되지 않는다는 점입니다. 아마도 그 문제 때문으로 보입니다. 아래의 샘플코드입니다.
.js file

$.img.addEventListener(‘pinch’, function(e) {
var t = Ti.UI.create2DMatrix().scale(e.scale);
$.img.transform = t;
});

jss file

“#scroll”:{
width: Ti.UI.SIZE,
contentWidth:‘auto’,
contentHeight:‘auto’,
top: 0,
showVerticalScrollIndicator:true,
showHorizontalScrollIndicator:true
}
"#img":{
width : ‘120%’,
height : ‘120%’
}

xml file

<.ScrollView id=“scroll”>
<.ImageView id=“img” image="/images/announce.png"/>
<./ScrollView>

1개의 좋아요
3

참고하세요.
iOS scrollview zoom (아쉽게 iOS만 적용되는군요)

var scrollView = Titanium.UI.createScrollView({
contentWidth:‘auto’,
contentHeight:‘auto’,
top:0,
showVerticalScrollIndicator:true,
showHorizontalScrollIndicator:true
minZoomScale:0, // your view can not zoom out smaller then 100%
maxZoomScale:10, // your view can zoom in with a factor 10 (1000% ?)
zoomScale:5 // default zoomed in stage when view is added on window (500%)
});