如何在XCode中创建顶部面板可折叠的拆分视图?

时间:2011-04-07 16:33:37

标签: xcode ios uiviewcontroller

我有一个UINavigationController,它包含几个UIViewControllers。我想创建一个显示在每个视图顶部的共享“面板”。另外,我想在点击时使该面板展开并折叠,覆盖视图。

视图1

-Top Panel(可折叠)

- 主要小组

视图2

-Top Panel(可折叠)

- 主要小组

这类似于工具栏或导航面板隐藏/显示相机控制器的方式,但它将是一个自定义视图。这是一款iPhone应用程序。

作为一名新的XCode开发人员,我希望能从架构的角度深入了解如何处理这个问题。

1 个答案:

答案 0 :(得分:1)

创建一个UIViewController子类,比如名为PanelStyleUIViewController,  这将是所有具有该面板的视图的超类。超类实现了面板的控制器逻辑,以及视图扩展和收缩,它总是发生在子控制器的常规视图逻辑之上。

对于新的iOS / cocoa开发人员来说,这将是一个非常困难的项目,因为:

  • 您可能最终必须以编程方式编写大量折叠面板的视图代码。可以使用更高级的技术在界面构建器中进行设计,但IB的基本用法是一次设计一个视图控制器。您需要设计一个部分父视图控制器,然后将其继承到许多不同的控制器。
  • 您需要确保折叠视图始终位于较低级别视图控制器类的常规视图内容之上(z-index wise)。这可以通过在viewDidAppear方法的面板视图上执行bringSubviewToFront调用来解决。
  • 您将从标准iPhone应用程序的行为方式走向“越野”。无论什么时候这样做,你都会为自己制造麻烦,并可能发现自己处于死胡同。我的建议是保持“内线”一段时间,直到你对目标C,可可触摸等非常有信心。

那就是说,这里是我在堆栈溢出编辑器中写的一些未经测试的代码,它可以让你知道我对这个超类设计的意思:

// PanelStyleUIViewController.h
@interface PanelStyleUIViewController : UIViewController {
    UIView *panelView;
}
@property (nonatomic, retain) UIView *panelView;

// PanelStyleUIViewController.m

@implementation PanelStyleUIViewController

@synthesize panelView;

- (void)viewDidLoad {
    [super viewDidLoad];
    // setup geometry, contents, etc of panelView programmatically...
    self.panelView = [[[UIView alloc] init] autorelease];
    panelView.frame = CGRectMake(0,0,320,200);
    // set resizing mask appropriately for landscape support
    panelView.autoresizingMask = UIViewAutoresizingMaskFlexibleWidth | UIViewAutoresizingMaskFlexibleBottomMargin;
    // put a button on the panel view so it can be tapped to slide down
    UIButton *slidePanelButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    slidePanelButton.frame = CGRectMake(0,160,320,40);
    [slidePanelButton addTarget:self action:@selector(slidePanel) forControlEvents:UIControlEventTouchUpInside];
    [panelView addSubview:slidePanelButton];
    // set panelView with a transform offset to slide it up under the top of the screen
    panelView.transform = CGAffineTransformMakeTranslation(0, -160);
    // add panelView to regular view controller's view
    [self.view addSubview:panelView];
}

- (void)viewWillAppear {
    // make sure the panel shows up on top, z-index wise, since subclasses might have created views that overlap it.
    [self.view bringSubviewToFront:panelView];
}

- (void)slidePanel {
    // remove the panel transform in an animated fashion (slide down).
    // TODO: some button or action needs to slide the panel back up...
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.3];
    [panelView setTransform:CGAffineTransformMakeTranslation(0,0)];
    [UIView commitAnimations];
}

- (void)viewDidUnload {
    [super viewDidUnload];
    // always make sure you clean up progammatically-retained views here
    self.panelView = nil;
}

- (void)dealloc {
    // and here too
    self.panelView = nil;
    [super dealloc];
}