17

foursquare が会場の詳細ビューをデザインした方法が本当に気に入っています。特に、ビューの「ヘッダー」に会場の場所が記載されたマップ...どのように作成されましたか? 詳細は明らかにいくつかの uiscrollview (多分 uitableview ?) であり、その背後 (ヘッダー内) にマップがあるため、上にスクロールすると、スクロール ビューがバウンスするときにマップが明らかになります...これを行う方法を知っている人はいますか?

ここに画像の説明を入力

4

3 に答える 3

32

これが私がそれを再現する方法です:-

UIViewControllerビューとして aを持つ aが必要ですUIScrollView。次に、UIViewスクロールビューに追加するコンテンツは次のようになります:-

ここに画像の説明を入力 - のフレームにはMKMapView負のy位置があります。この場合、デフォルトの状態 (ドラッグ前) では 100 ポイントのマップしか表示されません。
- MKMapView インスタンスでズームとスクロールを無効にする必要があります。

centerCoordinate次に、下にドラッグしたMKMapViewときにの を下に移動し、その中心位置を調整するのがコツです。

そのために、画面上の x ポイントをドラッグしたときにマップの中心座標をどれだけ移動する必要があるかを知るために、デルタ緯度として表す 1 ポイントの量を計算します:- 

- (void)viewDidLoad {
    [super viewDidLoad];
    UIScrollView* scrollView = (UIScrollView*)self.view;
    [scrollView addSubview:contentView];
    scrollView.contentSize = contentView.frame.size;
    scrollView.delegate = self;
    center = CLLocationCoordinate2DMake(43.6010, 7.0774);
    mapView.region = MKCoordinateRegionMakeWithDistance(center, 1000, 1000);
    mapView.centerCoordinate = center;
    //We compute how much latitude represent 1point.
    //so that we know how much the center coordinate of the map should be moved 
    //when being dragged.
    CLLocationCoordinate2D referencePosition = [mapView convertPoint:CGPointMake(0, 0) toCoordinateFromView:mapView];
    CLLocationCoordinate2D referencePosition2 = [mapView convertPoint:CGPointMake(0, 100) toCoordinateFromView:mapView];
    deltaLatFor1px = (referencePosition2.latitude - referencePosition.latitude)/100;
}

これらのプロパティが初期化されたら、 の動作を実装する必要がありUIScrollViewDelegateます。ドラッグすると、ポイントで表された動きが緯度に変換されます。次に、この値の半分を使用してマップの中心を移動します。

- (void)scrollViewDidScroll:(UIScrollView *)theScrollView {
    CGFloat y = theScrollView.contentOffset.y;
    // did we drag ?
    if (y<0) {
        //we moved y pixels down, how much latitude is that ?
        double deltaLat = y*deltaLatFor1px;
        //Move the center coordinate accordingly 
        CLLocationCoordinate2D newCenter = CLLocationCoordinate2DMake(center.latitude-deltaLat/2, center.longitude);
        mapView.centerCoordinate = newCenter;
    }
}

foursquare アプリと同じ動作が得られます (ただし、foursquare アプリでは、マップの中心がジャンプする傾向があります。ここでは、中心の変更がスムーズに行われます)。

于 2012-06-27T19:32:57.980 に答える
0

Yonel さんの回答はいいのですが、マップの中央にピンがあるので問題が見つかりました。負の Y のため、ポイントは UINavigationBar の下に隠されています。

次に、負の Y を設定せず、スクロール オフセットに従って mapView.frame を修正しました。

私のmapViewは320 x 160です

_mapView.frame = CGRectMake(0, 160, 320, -160+y);

これが誰かに役立つことを願っています。

于 2014-05-23T02:32:05.330 に答える