UAModalPanel 是一个高度可定制的替代模态面板,您可以在视图控制器中弹出显示可能不需要一个完整新屏幕的内容。它具有弹跳动画、内容淡入和华丽的有杂色渐变的标题栏。它适用于 iPhone 和 iPad,在旋转与否的情况下都能正常工作。
http://www.youtube.com/watch?v=AJDR0GAsV9E
您将需要至少 Xcode 3.2 和 iOS 4.0+ 的项目
在终端导航到您项目目录的根目录,并运行以下命令(假设您的项目是一个 git 仓库)
git submodule add git://github.com/coneybeare/UAModalPanel.git Submodules/UAModalPanel
git commit -m 'UAModalPanel added as submodule'
这将在您的项目中创建一个新的子模块,将文件下载到项目中的 Submodules/UAModalPanel 目录,并创建一个具有更新 Git 仓库设置的新的提交。由于您将 UAModalPanel 添加为子模块,因此可以很容易地通过简单地执行以下操作来保持其的最新版本:
git submodule update
从示例项目中复制文件
Xcode 4 注意:在 Xcode 4 中添加文件的方法不同 - 首先确保您的 UAModalPanel 项目窗口已关闭,然后从Finder窗口中拖动 UAModalPanel.xcodeproj 文件到您的项目中。您应该在 Xcode 中看到 UAModalPanel 的项目树打开在您的项目中,然后您可以按照上面的说明拖动 UAModalPanel 组。然后必须从您的项目中**移除 UAModalPanel.xcodeproj(整个 UAModalPanel 项目**),以免干扰您的项目。
添加框架
展开您项目文件列表中的 'Frameworks' 组。请确保已安装以下框架
QuartzCore.framework
如果您缺少任何框架,右键单击 'Frameworks' 组并选择添加 -> 已存在的框架。选择您缺少的框架并将其添加到项目中。
UAModalPanel 的子类化
使用面板的最佳方式是将其子类化,并将自己的元素添加到contentView
中。要获得一个普通模态面板,可以将UAModalPanel进行子类化。要获得一个带标题的模态面板,将UATitledModalPanel进行子类化。查看示例项目中的示例子类,UAExampleModalPanel
将UAModalPanel添加到视图控制器
通过创建子类的实例并从中显示来显示面板
- (IBAction)showModalPanel:(id)sender {
UAModalPanel *modalPanel = [[[UAExampleModalPanel alloc] initWithFrame:self.view.bounds] autorelease];
[self.view addSubview:modalPanel];
[modalPanel showFromPoint:[sender center]];
}
UAModalPanel知道如何自己关闭,但如果你想有更多控制或动作按钮处理,请查看以下内容。
可选的事件处理
你可以选择实现UAModalPanelDelegate方法进行回调和验证...
// Optional: This is called before the open animations.
// Only used if delegate is set and not using blocks.
- (void)willShowModalPanel:(UAModalPanel *)modalPanel;
// Optional: This is called after the open animations.
// Only used if delegate is set and not using blocks.
- (void)didShowModalPanel:(UAModalPanel *)modalPanel;
// Optional: This is called when the close button is pressed
// You can use it to perform validations
// Return YES to close the panel, otherwise NO
// Only used if delegate is set and not using blocks.
- (BOOL)shouldCloseModalPanel:(UAModalPanel *)modalPanel;
// Optional: This is called when the action button is pressed
// Action button is only visible when its title is non-nil;
// Only used if delegate is set and not using blocks.
- (void)didSelectActionButton:(UAModalPanel *)modalPanel;
// Optional: This is called before the close animations.
// Only used if delegate is set and not using blocks.
- (void)willCloseModalPanel:(UAModalPanel *)modalPanel;
// Optional: This is called after the close animations.
// Only used if delegate is set and not using blocks.
- (void)didCloseModalPanel:(UAModalPanel *)modalPanel;
...或者你可以在创建面板时使用块。
// The block is responsible for closing the panel,
// either with -[UAModalPanel hide] or -[UAModalPanel hideWithOnComplete:]
// Panel is a reference to the modalPanel
modalPanel.onClosePressed = ^(UAModalPanel* panel) {
// Do something awesome when the close button is pressed
[panel hideWithOnComplete:^(BOOL finished) {
// Do something else awesome after it closes.
}];
};
// Panel is a reference to the modalPanel
modalPanel.onActionPressed = ^(UAModalPanel* panel) {
// Do something awesome when the action button is pressed
};
动画钩子
你可以将这些方法中的任何一个添加到你的子类中,以在各种动画点获得钩子。
- (void)showAnimationStarting;
- (void)showAnimationPart1Finished;
- (void)showAnimationPart2Finished;
- (void)showAnimationPart3Finished;
- (void)showAnimationFinished;
日志记录
您可以在项目中添加预处理器宏UAMODALVIEW_DEBUG
,以在UAModalPanel中打开一些可能很有用的日志。
最佳的自定义位置是在你的UAModalPanel子类中。
UAModalPanel自定义
// Margin between edge of container frame and panel. Default = {20.0, 20.0, 20.0, 20.0}
self.margin = UIEdgeInsetsMake(10.0, 20.0, 30.0, 20.0);
// Padding between edge of panel and the content area. Default = {20.0, 20.0, 20.0, 20.0}
self.padding = UIEdgeInsetsMake(10.0, 20.0, 30.0, 20.0);
// Border color of the panel. Default = [UIColor whiteColor]
self.borderColor = [UIColor blueColor];
// Border width of the panel. Default = 1.5f;
self.borderWidth = 5.0f;
// Corner radius of the panel. Default = 4.0f
self.cornerRadius = 10.0f;
// Color of the panel itself. Default = [UIColor colorWithWhite:0.0 alpha:0.8]
self.contentColor = [UIColor yellowColor];
// Shows the bounce animation. Default = YES
self.shouldBounce = NO;
// Shows the actionButton. Default title is nil, thus the button is hidden by default
[self.actionButton setTitle:@"Foobar" forState:UIControlStateNormal];
UATitledModalPanel自定义
// Height of the title view. Default = 40.0f
self.titleBarHeight = 80.0f;
// The background color gradient of the title
CGFloat colors[8] = {0, 1, 1, 1, 1, 1, 0, 1};
[self.titleBar setColorComponents:colors];
// The header label, a UILabel with the same frame as the titleBar
self.headerLabel.font = [UIFont boldSystemFontOfSize:24];
UANoisyGradientBackground和UAGradientBackground自定义
// The gradient style (Linear, linear reversed, radial, radial reversed, center highlight). Default = Linear
[[self titleBar] setGradientStyle:UAGradientBackgroundStyleCenterHighlight];
// The line mode of the gradient view (top, bottom, both, none)
[[self titleBar] setLineMode:UAGradientLineModeNone];
// The noise layer opacity
[[self titleBar] setNoiseOpacity:0.3];
就是这样。请随时进行分支和提交拉取请求,修复问题或做任何其他事情。
UAModalPanel不使用ARC,但你可以通过将"编译源"部分添加到“目标”的“构建设置”选项卡中的-fno-objc-arc
编译器标志,在ARC项目中使用它
如果您正在使用UAModalPanel,请与我联系,以便将其添加到此列表中!
请支持我们,这样我们就可以继续使UAModalPanel更加出色!如果你特别慷慨,请请我喝杯啤酒!