iPhone：创建一个可重用的组件（控件），它包含一些Interface Builder部件和一些代码 [英] iPhone: Create a reusable component (control) that has some Interface Builder pieces and some code

问题描述

我想为iPhone创建一个可重用的组件（自定义控件）。它由几个预先安排在View上的标准控件组成，然后是一些相关的代码。我的目标是：

I want to create a reusable component (a custom control) for the iPhone. It consists of several standard controls prearranged on a View, and then some associated code. My goals are:

1. 我希望能够使用Interface Builder在我的自定义控件中布置子视图;


2. 我想以某种方式打包整个事情，以便我可以相当容易地将生成的自定义组件拖放到其他视图中，而无需手动重新连接一堆插座等等。 （手动重新布线很好，我只是不想做吨和吨。）

让我更多具体，具体告诉你我的控制应该做什么。在我的应用程序中，我有时需要点击Web服务来验证用户输入的数据。在等待来自Web服务的回复时，我想显示一个微调器（一个活动指示器）。如果Web服务使用成功代码回复，我想显示成功复选标记。如果Web服务回复错误代码，我想显示错误图标和错误消息。

Let me be more concrete, and tell you specifically what my control is supposed to do. In my app, I sometimes need to hit a web service to validate data that the user has entered. While waiting for a reply from the web service, I want to display a spinner (an activity indicator). If the web services replies with a success code, I want to display a "success" checkmark. If the web service replies with an error code, I want to display an error icon and an error message.

执行此操作的一次性使用方法非常简单：I只需创建一个包含UIActivityIndi​​catorView，两个UIImages（一个用于成功图标，一个用于错误图标）的UIView，以及一个用于错误消息的UILabel。这是一个截图，相关部分用红色标记：

The single-use way to do this is pretty easy: I just create a UIView that contains a UIActivityIndicatorView, two UIImages (one for the success icon and one for the error icon), and a UILabel for the error message. Here's a screenshot, with the relevant parts marked in red:

然后我将这些碎片连接到插座，我在控制器中放了一些代码。

I then wire up the pieces to outlets, and I put some code in my controller.

但是我如何打包这些部分 - 代码和一小部分视图 - 以便我可以重用它们？以下是我发现的一些事情让我在那里，但不是很好：

But how do I package up those pieces -- the code and the little collection of views -- so that I can reuse them? Here are a few things I found that get me partway there, but aren't that great:

• 我可以拖动视图集合和控件进入库的自定义对象部分;然后，我可以将它们拖回到其他视图中。但是（a）它忘记了哪些图像与两个UIImages相关联，（b）有很多手动重新布线的四个或五个插座，（c）最重要的是，这并没有带来代码。 （也许有一种简单的方法来连接代码？）


• 我想我可以创建一个IBPlugin;不确定这是否会有所帮助，而且看起来很多工作，而且我不完全清楚IBPlugins是否适用于iPhone开发。


• 我想，嗯，这里有代码与此相关 - 闻起来像一个控制器，所以我尝试用相关的XIB文件创建一个自定义控制器（例如 WebServiceValidatorController ）。这实际上感觉非常有希望，但在那时我无法弄清楚如何在Interface Builder中将此组件拖到其他视图上。 WebServiceValidatorController 是一个控制器，而不是一个视图，所以我可以将它拖到文档窗口中，但不能拖到视图中。

• I can drag the collection of views and controls into the Custom Objects section of the Library; then, later, I can drag them back out onto other views. But (a) it forgets which images were associated with the two UIImages, (b) there is a lot of manual rewiring of four or five outlets, and (c) most importantly, this doesn't do bring along the code. (Perhaps there's an easy way to wire up the code?)
• I think I could create an IBPlugin; not sure if that would help, and it seems like a lot of work, and also it's not entirely clear to me whether IBPlugins work for iPhone development.
• I thought, "Hmm, there's code associated with this -- that smells like a controller," so I tried creating a custom controller (e.g. WebServiceValidatorController) with associated XIB file. That actually feels really promising, but then at that point I can't figure out how, in Interface Builder, to drag this component onto other views. The WebServiceValidatorController is a controller, not a view, so I can drag it into a Document Window, but not into a view.

我有一种感觉我错过了一些明显的东西...

I have a feeling I'm missing something obvious...

推荐答案

我创建了类似的构造，除了我不在IB中使用结果，但使用代码实例化。我将描述它是如何工作的，最后我会告诉你如何用它来完成你所追求的目标。

I've created similar constructs except that I do not use the result in IB, but instantiate using the code. I'll describe how that works, and at the end I'll give you a hint how that can be used to accomplish what you're after.

我从一个空的XIB文件，我在顶层添加一个自定义视图。我将自定义视图配置为我的类。在视图层次结构中，我根据需要创建和配置子视图。

I start from an empty XIB file where I add one custom view at the top level. I configure that custom view to be my class. Below in view hierarchy I create and configure subviews as required.

我在自定义视图类中创建所有IBOutlet，并在那里连接它们。在本练习中，我完全忽略了文件所有者。

I create all IBOutlets in my custom-view class, and connect them there. In this exercise I ignore the "File's owner" completely.

现在，当我需要创建视图时（通常在控制器中作为while / for-loop的一部分来创建）尽可能多地使用它们，我使用NSBundle的功能如下：

Now, when I need to create the view (usually in controller as part of while/for-loop to create as much of them as needed), I use NSBundle's functionality like this:

- (void)viewDidLoad
{
    CGRect fooBarViewFrame = CGRectMake(0, 0, self.view.bounds.size.width, FOOBARVIEW_HEIGHT);
    for (MBSomeData *data in self.dataArray) {
        FooBarView *fooBarView = [self loadFooBarViewForData:data];
        fooBarView.frame = fooBarViewFrame;
        [self.view addSubview:fooBarView];

        fooBarViewFrame = CGRectOffset(fooBarViewFrame, 0, FOOBARVIEW_HEIGHT);
    }
}

- (FooBarView*)loadFooBarViewForData:(MBSomeData*)data
{
    NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:@"FooBarView" owner:self options:nil];
    FooBarView *fooBarView = [topLevelObjects objectAtIndex:0];
    fooBarView.barView.amountInEuro = data.amountInEuro;
    fooBarView.barView.gradientStartColor = data.color1;
    fooBarView.barView.gradientMidColor = data.color2;
    fooBarView.titleLabel.text = data.name;
    fooBarView.titleLabel.textColor = data.nameColor;
    return fooBarView;
}

注意，我如何将nib的所有者设置为 self - 没有任何伤害，因为我没有将文件所有者连接到任何东西。加载这个笔尖的唯一有价值的结果是它的第一个元素 - 我的观点。

Notice, how I set owner of nib to self - there's no harm as I didn't connect "File's owner" to anything. The only valuable result from loading this nib is its first element - my view.

如果你想在IB中创建视图这种方法，那就很容易了。在主自定义视图中实现子视图的加载。将子视图的框架设置为主视图的边界，以便它们具有相同的大小。主视图将成为您的真实自定义视图的容器，也是外部代码的接口 - 您只打开其子视图所需的属性，其余部分被封装。然后你只需在IB中删除自定义视图，将其配置为你的类，并像往常一样使用它。

If you want to adapt this approach for creating views in IB, it's pretty easy. Implement loading of subview in a main custom view. Set the subview's frame to main view's bounds, so that they are the same size. The main view will become the container for your real custom view, and also an interface for external code - you open only needed properties of its subviews, the rest is encapsulated. Then you just drop custom view in IB, configure it to be your class, and use it as usual.

这篇关于iPhone：创建一个可重用的组件（控件），它包含一些Interface Builder部件和一些代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！