ピンが上にあるUIScrollView ImageView

Question

UIScrollViewはUIImageViewです。私はこのimageViewのピンを見せたい。 ImageViewのサブビューとしてピンを追加すると、縮尺変換がピンで発生する場合を除いてすべてが素晴らしいです。私はこの振る舞いを望んでおらず、ピンを同じにしておきたい。

私は、ImageViewの上にある別のビューにピンを追加することを選択し、UIScrollViewのサブビューも選択します。あなたが想像するならここのアイデアは地図の上を横切っている層を持つことです、そして、私はそれらをプロットするところにピンを表示します。

ImageViewの場合は、レイヤービューにピンを追加しても表示されません。しかし、この問題は、ImageViewがスケール変換を行ったため、ピンの位置が元の原点x/yと一致しなくなります。

基本的に、これはピン付きの場所のカスタムマップです。ピンを浮かせてImageViewをズームイン/ズームアウトしないようにしようとしていますが、ズームが発生したときにどこに配置したかを覚えておいてください。

いくつかのコード：

scrollView = [[UIScrollView alloc] initWithFrame:viewRect]; 

scrollView.delegate = self; 
scrollView.pagingEnabled = NO; 
scrollView.scrollsToTop = NO; 
[scrollView setBackgroundColor:[UIColor clearColor]]; 
scrollView.clipsToBounds = YES; // default is NO, we want to restrict drawing within our scrollview 
scrollView.bounces = YES; 
scrollView.autoresizingMask = UIViewAutoresizingFlexibleHeight; 
scrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite; 

imageViewMap = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.png"]]; 

imageViewMap.userInteractionEnabled = YES; 

viewRect = CGRectMake(0,0,imageViewMap.image.size.width,imageViewMap.image.size.height); 

//viewRect = CGRectMake(0,0,2976,3928); 

[scrollView addSubview:imageViewMap]; 

[scrollView setContentSize:CGSizeMake(viewRect.size.width, viewRect.size.height)]; 

iconsView = [[UIView alloc] initWithFrame:imageViewMap.frame]; 

[scrollView addSubview:iconsView]; 

コードは、いくつかのイベントで、後にピンを追加します。

[iconsView addSubview:pinIcon]; 

スケールが発生したときに移動せずにマップ上にピンを移動させる方法を試しています。

Answer 1

ピン（iconsView）専用のビューですべてのピンを保持するというアイディアが好きですが、imageViewMapというサブビューとして追加することにしました。

QuartzCore.frameworkファイルをプロジェクトにインポートします。

ビューコントローラMyViewControllerを呼び出します。

#import <QuartzCore/QuartzCore.h> 
@interface MyViewController : UIViewController <UIScrollViewDelegate> 
@property (retain) UIScrollView *scrollView; 
@property (retain) UIImageView *imageView; 

//など

@implementation MyViewController 

@synthesize scrollView; 
@synthesize imageView; 

に私はあなたがピンビューまたはDropPinViewControllerというビューコントローラを持っていると仮定します。画像を使っているだけなら、UIImageViewでもかまいませんが、ピンにはラベルが付いているので、xibを使いました。ピンは、アンカーポイントをそこに置くので、xibの下の中心を指している必要があります。

MyViewControllerのviewDidLoadで、pinViewをimageViewのサブビューとして追加します。 scrollViewにサブビューとしてimageViewを追加します。 scrollViewのコンテンツサイズを設定します。

scrollView.delegate = self; 

これらのデリゲートメソッドを使用しますデビッド・ブラウンへ

- (void)scrollViewDidZoom:(UIScrollView *)aScrollView 
{ 
    for (UIView *dropPinView in imageView.subviews) {  
    CGRect oldFrame = dropPinView.frame; 
    // 0.5 means the anchor is centered on the x axis. 1 means the anchor is at the bottom of the view. If you comment out this line, the pin's center will stay where it is regardless of how much you zoom. I have it so that the bottom of the pin stays fixed. This should help user RomeoF. 
    [dropPinView.layer setAnchorPoint:CGPointMake(0.5, 1)]; 
    dropPinView.frame = oldFrame; 
    // When you zoom in on scrollView, it gets a larger zoom scale value. 
    // You transform the pin by scaling it by the inverse of this value. 
    dropPinView.transform = CGAffineTransformMakeScale(1.0/scrollView.zoomScale, 1.0/scrollView.zoomScale); 
} 

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView 
{ 
    return imageView; 
} 

Answer 2

私が実装した1つのことは、私の問題を解決していませんが、正しいパスの下にあると思います。

Anchor a UIView

次のように私は私のビュー階層を持っています。

UIScrollView 
- UIImageView (map image) 
- IconsView (layer image to hold icons) 

私は解決する必要がある次のステップは、私のピンを維持することですUIImageViewが内外にズームしているときに同じ場所に固定IconsViewに加えます。

私はのサブビューであり、Origin XとYを更新したすべてのピンを通過するforループを持っていました。これはUIScrollViewの代理人のscrollViewDidScrollメソッドにありました。

このテクニックは、マップ上にピンがたくさんある場合、処理が必要な処理が多すぎるため、デバイスには恐ろしい性能があります。

Answer 3

いくつかの提言：

1）あなたはそれがデフォルトで表示されるようにしようとするピンの数を制限し、Googleマップアプリに気づくでしょう。一致する可能性がさらに高い場合でも、中心点に最も近い結果のみが表示されます。

2）スクロールまたはピンチ動作中にピンを簡単に非表示にすることで、インターフェイスが反応したままで、イメージビューの移動が停止したときにピンを再描画することができます。

3）多数のピンを表示してアニメーション化する必要がある場合、CABasicAnimationsを使用してピンとバックグラウンドを同時にアニメーション化し、バックドロップを変換するのと同じ数学を使用してピンの位置を変換することもできます規模。これは、アニメーションをよりスムーズに広げ、かなり低いレベルでアニメーションを実行することによってディスプレイをスムーズにすることができますが、他の課題や制限があります。

http://developer.apple.com/iphone/library/documentation/Cocoa/Conceptual/Animation_Types_Timing/Articles/PropertyAnimations.html#//apple_ref/doc/uid/TP40006672-SW1

バーニー

Answer 4

私は同じ問題を抱えていると私は手動で非常にきれいではありませんピンの位置を補正するアイデアを見つけます。次に、デリゲート関数viewForZoomingInScrollView:で返されたビューにピンを描画し、ズームの終了後にサブビュー（マーカー）サイズを更新します。

しかし、これはGoogleマップアプリでは可能ですが、再作成できません。

もう1つ： 私は、 'viewForZoomingInScrollView'ではないUIScrollViewにサブビューを追加すると誰も私の動作の展示セットを説明できますか？たとえば、次のようになります。

UIImageView* marker = [[UIImageView alloc] initWithImage: myMarkerImage]; 
[marker setCenter: CGPointMake(250,150)]; 
[myScrollView addSubview: marker]; 

これは、最初のビューとパンニングには問題ありません。ズームすると、それらのサブビューのサイズは変更されませんが、これは実際に私たちが目指しているものですが、問題はUIViewフレームの原点がスクロールビュー全体でいくらか奇妙な方法で移動することです。ズームインすると、marker.frame.size.originは常に左上隅（スーパービュー（0,0））に向かって移動し、実際にズームアウトしているような印象を与えているようです。 「ズームセンター」は常に画面中央になければならないので、これも奇妙です。まあ、今はそれを手に入れません。

バンプ。 ;）

Answer 5

感謝を。あなたのコードは、私がコメントアウトしなければならなかった1行を除いて機能します。私のプロジェクトでは、UIScrollViewを持っていて、UIImageViewの上にマップが表示され、次に最後にダブルタップジェスチャーを検出した後にコードが配置されるピン（ボタン）が表示されます。あなたのコードはズームスケールを考慮に入れるのに役立ちました。しかし、ズームするためにピンチすると、各ピンはダブルタップされた図面の特定の部分に「張り付いて」いませんでした。私はこの行をコメントアウトしたときに解決策を見つけました：

//[dropPinView.layer setAnchorPoint：CGPointMake（0.5、1）];

私は完全な理解はしていませんが、私のコードは今動作します！他の人が私の経験から恩恵を受けることを願っているDavidに感謝します！