從標籤欄彈出的圖標

我很好奇從正確的方式使圖標從標籤欄彈出。例如，Food Spotting應用程序（請參閱下文）。如果點擊它，有三個圖標從中心標籤欄項目彈出。從標籤欄彈出的圖標

有沒有一種標準的方式去做這樣的事情？謝謝！

enter image description here

2013-03-14 Brandon

可能有一些opsource項目可能會這樣做，但我的猜測是你必須建立這個你自己。 – rckoenes 2013-03-14 11:38:39

以爲我可能 - 要做到這一點，我需要類似以下的東西嗎？ 1）確認點擊了中間的tabbar項目，2）點擊該tabbar項目時出現的圖像，3）附加到每個圖像的動作...類似的東西？ – Brandon 2013-03-14 11:43:44

這聽起來像它可以工作，我只需在中央選項卡上放置一個「UIButton」來檢測水龍頭。並使用['CABasicAnimation']（https://developer.apple.com/library/mac/#documentation/GraphicsImaging/Reference/CABasicAnimation_class/Introduction/Introduction。html）來動畫另一個按鈕。 – rckoenes 2013-03-14 11:47:20

我認爲一般的共識是，第一步，你應該放置在中心標籤欄按鈕的UIButton。代碼gazzola鏈接到似乎對此有幫助。下一步是獲取中心按鈕觸摸的句柄，並將新按鈕從其中移出。

以下代碼顯示瞭如何創建新按鈕並以類似於Food Spotting應用程序的方式爲它們設置動畫。

假設你有定義兩個屬性：

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

第一個是一個出口中心按鈕，和用於確定所述按鈕表示第二布爾值。

- (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-20 18:43:57 btking

看看這個code它幫助向您顯示半圓形方式

來源

2013-03-14 12:28:27 Dhara

有展示如何製作中心的TabBar按鈕，在這裏一個例子（git code）。這是你需要的一個不錯的開始，他們應該檢查由Dhara和 Rushabh發佈的代碼。

祝你好運。

來源

2013-03-14 12:51:33 gazzola

從標籤欄彈出的圖標

回答

相關問題