1

タブバーからアイコンをポップアップさせる適切な方法に興味があります。たとえば、Food Spotting アプリ (以下を参照してください)。クリックすると、中央のタブ バー項目から 3 つのアイコンが飛び出します。

このようなことを行うための標準的な方法はありますか? ありがとうございました！

ここに画像の説明を入力

4

3 に答える 3

1

最初のステップでは、中央のタブ バー ボタンの上に UIButton を配置する必要があるというのが一般的なコンセンサスだと思います。リンクされているコード gazzola は、これに役立つようです。次のステップは、中央のボタン タッチのハンドルを取得し、そこから新しいボタンをアニメーション化することです。

次のコードは、新しいボタンを作成し、Food Spotting アプリと同様の方法でアニメーション化する方法を示しています。

2 つのプロパティが定義されていると仮定します。

@property (nonatomic, weak) IBOutlet UIButton *ourExpandButton;
@property (nonatomic, assign) BOOL buttonsExpanded;

1 つ目は中央のボタンへのアウトレットで、2 つ目はボタンが表示されているかどうかを判断するためのブール値です。

- (void)viewDidAppear:(BOOL)animated
{
    UIButton *button1 = [UIButton buttonWithType:UIButtonTypeCustom];
    UIButton *button2 = [UIButton buttonWithType:UIButtonTypeCustom];
    UIButton *button3 = [UIButton buttonWithType:UIButtonTypeCustom];

    button1.backgroundColor = [UIColor redColor];
    button2.backgroundColor = [UIColor blueColor];
    button3.backgroundColor = [UIColor yellowColor];

    // Make the buttons 0 width and height so when we animate they seem to grow
    // Position them in the center of the button that expands them
    button1.frame = CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0);
    button2.frame = CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0);
    button3.frame = CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0);

    [button1 addTarget:self action:@selector(someMethod:) forControlEvents:UIControlEventTouchUpInside];
    [button2 addTarget:self action:@selector(someMethod:) forControlEvents:UIControlEventTouchUpInside];
    [button3 addTarget:self action:@selector(someMethod:) forControlEvents:UIControlEventTouchUpInside];

    button1.tag = 101;
    button2.tag = 102;
    button3.tag = 103;

    [self.view addSubview:button1];
    [self.view addSubview:button2];
    [self.view addSubview:button3];
}

viewDidAppear では、ストーリーボードですべて実行できるボタンを設定しているだけです。

次のメソッドは、展開ボタンの touchUpInside イベントに関連付けられます。

- (IBAction)expandButtonTouched:(id)sender
{
    if (!self.buttonsExpanded) {
        [UIView animateWithDuration:0.25 animations:^{
            float screenWidth = self.view.frame.size.width;
            float screenHeight = self.view.frame.size.height;
            [[self.view viewWithTag:101] setFrame:CGRectMake((screenWidth/3 - 22.0), (screenHeight - 100), 44.0, 44.0)];
            [[self.view viewWithTag:102] setFrame:CGRectMake((screenWidth/2 - 22.0), (screenHeight - 150), 44.0, 44.0)];
            [[self.view viewWithTag:103] setFrame:CGRectMake((2*screenWidth/3 - 22.0), (screenHeight - 100), 44.0, 44.0)];
        } completion:^(BOOL finished) {
            self.buttonsExpanded = YES;
        }];
    } else {
        [UIView animateWithDuration:0.25 animations:^{
            [[self.view viewWithTag:101] setFrame:CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0)];
            [[self.view viewWithTag:102] setFrame:CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0)];
            [[self.view viewWithTag:103] setFrame:CGRectMake(self.ourExpandButton.center.x, self.ourExpandButton.center.y, 0.0, 0.0)];
        } completion:^(BOOL finished) {
            self.buttonsExpanded = NO;
        }];
    }
}

これにより、ボタンが放射状または半円状にアニメートされ、ボタンが移動するにつれて大きくなります。ボタンをアニメーション化する場所を正確に把握し、それに応じて数値を調整する必要があることに注意してください。また、明らかに、ボタンには背景色だけでなく画像を指定する必要があります。

このコードは、Food Spotting のバウンス アニメーション (ボタンが目的地を過ぎて元に戻るバウンス アニメーション) を追加しません。これを追加するには、アニメーションのボタン フレームをボタンを移動させたい位置に変更し、完了ブロックに別のアニメーションを追加して、ボタンを最終的な目的地に移動します。

最終結果の画像を投稿しますが、評判が十分ではありません。

于 2013-05-20T18:43:57.070 に答える
0

このコードをチェックして、半円形に表示するのに役立ちます

于 2013-03-14T12:28:27.727 に答える
0

中央のタブバー ボタンを作成する方法を示す例がここにあります ( git コード)。Dhara と Rushabh によって投稿されたコードを確認する必要があります。

幸運を。

于 2013-03-14T12:51:33.990 に答える