2016-07-13 16 views
1

ここではプログラミングの新しい人物です。また、私の最初の投稿。私はこれについていくつかの調査をしようとしましたが、いくつかのスレッドを見つけましたが、ほとんどがiOSの場合は数年前です。iOS拡大可能な画像の上にUIButtonの位置を固定して、画像を拡大して拡大/縮小するようにしました。

iOSアプリでは、一部の機器の機械パネルの高精細画像にクリック可能なボタンを配置しようとしています。アイデアは、ユーザーが画像をズームインしたり、スイッチをタップしたり、スイッチの内容を説明するポップアップを表示したりすることができます。

私はいくつかのビデオを見て、UIScrollViewを作成して、それにUIImageViewのHDイメージを配置することができました。ズームイン/アウトして、パネルをうまく動かすことができます。

UIButtonを使用してパネルの「クリック可能な」領域を定義すると、これが最良の方法であるかどうかはわかりません。しかし、ボタンは私にいくつかの問題を抱えています:

拡大後、ボタンはHD画像に対して同じピクセルにとどまらず、ズームの際にボタンのサイズが「拡大」しません。ズームインすると、ボタンがカバーする領域が小さくなり、正しい場所を超えて表示されなくなります。

私は、HD画像と相対的なスクロールビューに対して相対的な制約を適用しようとしました。私は画像とボタンをスタックに入れようとしました。明らかに、私はここでいくつかの基本を欠いている。これは私がいるところではあまりにも進んでいるようです。

この問題を解決する方法はありますか?また、UIButtonの代わりにタップジェスチャーを試してみるのがよいでしょうか?

ありがとうございました! PS:このトピックに関するチュートリアルのビデオや記事をお待ちしております。

答えて

0

ボタンをスクロールビューの親の子(スクロールビューの兄弟)にし、スクロールビューの後に並べると、上に表示されます。

 parent view (probably the view controllers view) 
      | 
    |-----------| 
scrollView button 

スクロールがスクロールやズームされた前に、あなたはCGRect imageButtonFrame = CGRectMake(10,20,80,40)に表示するボタンが欲しい、のは言ってみましょう。これらの座標は「画像空間」にあると言えるかもしれません。スクロールビューの兄弟にこれらをマップする関数は次のようになります。このことについての素晴らしい何

UIView *parentView = self.view; // this assumes both button and scrollView are children of the view controller's view 
self.button.frame = [scrollView convertRect:imageButtonFrame toView:parentView]; 

はUIScrollViewのは、contentOffsetzoomScaleそれ自身を認識して、それらの値に対する計算を行うことです。そのコードスニペットを使用してボタンのフレームを設定している限り、そのフレームはimageButtonFrameというイメージスペースに固定されたままになります。

scrollViewの代理人になることによって、最新のフレームをキープ...

self.scrollView.delegate = self; 

そして見つけるときとオフセットやズームレベルの変更のための:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView { 
    self.button.frame = // ... as above 
} 

同じscrollViewDidZoom:(UIScrollView *)scrollView

+0

ダン、返信ありがとう!これの実装は私のスキルレベルを少し上回っているようです。私は、上記の目的が客観的であると思うという概念を理解しており、迅速にはほとんど慣れていません。私の周りで遊ぶことができるこれのスウィフト版がありますか? – user1269290

1

私はついにこの答えを見つけました。それは非常に簡単です。このボタンは、イメージが存在するimageViewのサブビューとして追加する必要があります。私はインターフェイスを介してこれを行うことができませんでしたが、プログラムでしかこのようにはできませんでした:

imageView.addSubview(button) 

残りはスウィフトのようです。ボタンはイメージと完全に移動してスケーリングしています。

関連する問題