ios 在 tableview 上添加视图（UITableViewController）

Add view over tableview (UITableViewController)

提问by Mittchel

Situation:I've got a UITableViewController loading some data asynchronously from a service. During this time I would like to place a full screen (except navigation bar) view over the table view showing my custom indicator and text.

情况：我有一个 UITableViewController 从服务异步加载一些数据。在此期间，我想在显示我的自定义指示器和文本的表格视图上放置一个全屏（导航栏除外）视图。

Problem:The problem I'm facing is that when my custom view (it has a red background) is placed over the UITableView the lines of the table view are shown trough my custom view (see image below).

问题：我面临的问题是，当我的自定义视图（它具有红色背景）放置在 UITableView 上时，表格视图的线条通过我的自定义视图显示（见下图）。

What I tried:I tried to use insertBelow and above, didn't work. I also tried to do: tableview.Hidden = true, but this also hides the custom view for some reason as seen on image 2.

我尝试过的：我尝试使用 insertBelow 和更高版本，但没有用。我也尝试这样做：tableview.Hidden = true，但这也出于某种原因隐藏了自定义视图，如图 2 所示。

Image1: For some reason I can see the lines threw my view.

Image1：出于某种原因，我可以看到线条抛出了我的观点。

Image 2: Tableview + custom view gone when hidden = true used.

图 2：当使用 hidden = true 时，Tableview + 自定义视图消失了。

My code:

我的代码：

        public override void ViewDidLoad ()
    {
        base.ViewDidLoad ();

        UIView view = new UIView (new RectangleF (0, 0, this.TableView.Frame.Width, this.TableView.Frame.Height));
        view.BackgroundColor = UIColor.Red;

        this.TableView.AddSubview (view);

        TableView.Source = new SessionTableViewSource ();
    }

回答by sagus_helgy

You can use self.navigationController.viewas view for adding subview.

您可以self.navigationController.view用作视图来添加子视图。

回答by redent84

The issue is that the View of a UITableViewControlleris a UITableView, so you cannot add subviews to the controller on top of the table.

问题是 a 的 ViewUITableViewController是 a UITableView，因此您无法将子视图添加到表格顶部的控制器中。

I'd recommend switching from a UITableViewControllerto a simple UIViewControllerthat contains a UITableView. This way the controller main view is a plain UIViewthat contains a table, and you can add subviews to the main UIViewand they will be placed on top of the table view.

我建议从 a 切换UITableViewController到UIViewController包含UITableView. 这样控制器主视图是一个UIView包含表格的普通视图，您可以向主视图添加子视图UIView，它们将放置在表格视图的顶部。

回答by jonas vermeulen

You can try to add the view to the window instead of nesting it in the table view like this:

您可以尝试将视图添加到窗口中，而不是像这样将其嵌套在表视图中：

UIWindow* mainWindow = [[UIApplication sharedApplication] keyWindow];
[mainWindow addSubview: overlayview];

回答by jianpx

UIWindow* window = [[UIApplication sharedApplication].delegate.window;
[window addSubview: your-overlayview];

回答by Tommie C.

Swift / Storyboard Solution

Swift / 故事板解决方案

Note: The code below assumes one has a custom view (ratingView in my case) that is to be presented over a UITableView.

注意：下面的代码假设有一个自定义视图（在我的例子中为 ratingView），该视图将在 UITableView 上呈现。

I've read many answers to this and similar questions on SO. The other answers from these sources worked to varying degrees for me (e.g.,view loaded but not shown or not accessible,...). I am using Swift 2.0+ and I am sharing the complete solution for doing this using a UITableViewController.

我在 SO 上阅读了很多关于这个和类似问题的答案。这些来源的其他答案对我来说在不同程度上起作用（例如，视图已加载但未显示或无法访问，...）。我正在使用 Swift 2.0+，我正在分享使用UITableViewController执行此操作的完整解决方案。

Create an outlet to the Navigation Bar and the view, which you want to bring over the tableview.

为导航栏和视图创建一个出口，您希望将其引入 tableview。

//MARK:Outlets
@IBOutlet weak var navBar:UINavigationBar!
@IBOutlet var ratingView: MNGStarRating!

In my case I also wanted to animate the view over the tableview so I used a class variable to hold a reference to the inflection point and a point above the scene (off-screen).

在我的例子中，我还想为 tableview 上的视图设置动画，所以我使用了一个类变量来保存对拐点和场景上方（屏幕外）点的引用。

var centerYInflection:NSLayoutConstraint!
var aPointAboveScene = -(max(UIScreen.mainScreen().bounds.width,UIScreen.mainScreen().bounds.height) * 2.0)

Then in viewDidLoadI called a function (configureRatingViewAutoLayout) which configures and adds the constraints for the new view to be animated over the tableview.

然后在viewDidLoad我调用了一个函数 (configureRatingViewAutoLayout)，它配置并添加了新视图的约束，以便在 tableview 上进行动画处理。

func configureRatingViewAutoLayout() {
    //REQUIRED    
    self.navBar.superview?.addSubview(self.ratingView)

    var newConstraints:[NSLayoutConstraint] = []
    newConstraints.append(self.ratingView.leadingAnchor.constraintEqualToAnchor(self.view.leadingAnchor,constant: 10)) 
    newConstraints.append(self.ratingView.trailingAnchor.constraintEqualToAnchor(self.view.trailingAnchor,constant: 10))
    newConstraints.append(self.ratingView.centerXAnchor.constraintEqualToAnchor(self.view.centerXAnchor))

    //hides the rating view above the scene
    self.centerYInflection = self.ratingView.centerYAnchor.constraintEqualToAnchor(self.view.centerYAnchor, constant: self.aPointAboveScene)

    //the priority must be set below 1000 if you intend to change it after it has been added to a view
    self.centerYInflection.priority = 750
    newConstraints.append(self.centerYInflection)

    //constraints must be added to the container view of the two items
    self.ratingView.superview?.addConstraints(newConstraints)

}

Nota Bene - On a UITableViewController; the self.view is the self.tableView. They point to the same thing so I guess one could also use the self.tableView reference above.

Nota Bene - 在 UITableViewController 上；self.view 是 self.tableView。他们指向同一件事，所以我想人们也可以使用上面的 self.tableView 参考。

Sometime later... In response to a UIControl event I call this method.

稍后...为了响应 UIControl 事件，我调用此方法。

@IBAction func toggleRatingView (sender:AnyObject?){

    //REQUIRED
    self.ratingView.superview?.layoutIfNeeded()

    UIView.animateWithDuration(1.0, delay: 0.0, usingSpringWithDamping: 0.37, initialSpringVelocity: 0.99, options: [.CurveEaseOut], animations: { () -> Void in

        if CGRectContainsRect(self.view.frame, self.ratingView.frame) {

            //in frame ~ animate away
            //I play a sound to alert the user something is happening 

            self.centerYInflection.constant = self.aPointAboveScene
            self.centerYInflection.priority = UILayoutPriority(950)
            //I disable portions of the UI
            self.disableUIElements(nil)



        } else {

            //out of frame ~ animate in
            //I play a different sound here                

            self.centerYInflection.constant = 0
            self.centerYInflection.priority = UILayoutPriority(950)

            //I enable the UI fully
            self.enableUIElements(nil)


        }
        //REQUIRED
        self.ratingView.superview?.setNeedsLayout()
        self.ratingView.superview?.layoutIfNeeded()


        }) { (success) -> Void in

            //do something else

    }

}

These helper methods can be configured to control access to elements in your scene during the presentation of the view.

这些辅助方法可以配置为在视图呈现期间控制对场景中元素的访问。

func disableUIElements(sender:AnyObject?) {
    //UI

}
func enableUIElements(sender:AnyObject?) {

    //UI

}

Caveats

注意事项

My view is a custom view in the Storyboard (sitting outside of the tableview but connected to the TableView Controller). The view has a requireduser runtime attribute defined layer.zPositionwith a Number value set to 2 (this ensures that it presents in front of the UITableView).

One could also try playing around with bringSubviewToFront: and sendSubviewToBack: methods if you don't want to set the zPosition (I think zPosition is simpler to use)

我的视图是 Storyboard 中的自定义视图（位于 tableview 之外但连接到 TableView Controller）。该视图有一个 必需的用户运行时属性layer.zPosition，其 Number 值设置为 2（这确保它出现在 UITableView 的前面）。

如果您不想设置 zPosition（我认为 zPosition 使用起来更简单），还可以尝试使用 combineSubviewToFront: 和 sendSubviewToBack: 方法

回答by Sh_Khan

Try this to hook a button at bottom of the UITableViewController

试试这个在底部挂一个按钮 UITableViewController

declare button as a variable:

将按钮声明为变量：

var submitButton: UIButton!

and in viewDidLoad:

并在viewDidLoad：

submitButton = UIButton(frame: CGRect(x: 5, y: UIScreen.main.bounds.size.height - 50, width: UIScreen.main.bounds.size.width - 10, height: 50))        
submitButton.backgroundColor = UIColor.init(red: 180/255, green: 40/255, blue: 56/255, alpha: 1.0)
submitButton.setTitle("Submit", for: .normal)
submitButton.titleLabel?.font = UIFont(name: "Arial", size: 15)
submitButton.titleLabel?.textColor = .white
submitButton.addTarget(self, action: #selector(submit), for: .touchUpInside)
submitButton.layer.cornerRadius = 5        
self.view.addSubview(submitButton)

and implement this method:

并实现此方法：

override func scrollViewDidScroll(_ scrollView: UIScrollView) {
  submitButton.frame = CGRect.init(x: submitButton.frame.origin.x, y: UIScreen.main.bounds.size.height + scrollView.contentOffset.y - 50, width: submitButton.frame.width, height: submitButton.frame.height)
}

回答by PatricioS

This works for me:

这对我有用：

if let myTopView = Bundle.main.loadNibNamed("MyTopView", owner: self, options: nil)?.first as? MyTopView {

        if let view = UIApplication.shared.keyWindow{
            view.addSubview(myView);
            myTopView.translatesAutoresizingMaskIntoConstraints = false

            myTopView.topAnchor.constraint(equalTo: view.topAnchor ).isActive = true
            myTopView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
            myTopView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
            myTopView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

        }

    }