我很好奇从标签栏弹出图标的正确方法。例如,Food Spotting 应用程序(请参见下文)。如果单击它,则从中心选项卡栏项目中弹出三个图标。
有没有标准的方法来做这样的事情?谢谢!
我很好奇从标签栏弹出图标的正确方法。例如,Food Spotting 应用程序(请参见下文)。如果单击它,则从中心选项卡栏项目中弹出三个图标。
有没有标准的方法来做这样的事情?谢谢!
我认为普遍的共识是,第一步,您应该在中心标签栏按钮上放置一个 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 所具有的弹跳动画,在该动画中,按钮越过它们的目的地并后退。要添加它,只需将动画中的按钮帧更改为您希望按钮移动的最远距离,然后在完成块中添加另一个动画,将它们移动到最终目的地。
我会发布最终结果的图像,但我没有足够的声誉。
查看此代码,它有助于以半圆形方式向您展示
这里有一个示例(git 代码),展示了如何制作居中的标签栏按钮。这是您需要的一个很好的开始,您应该检查 Dhara 和 Rushabh 发布的代码。
祝你好运。