在ios应用程序中创建浮动文本框

时间:2015-04-02 13:11:20

标签: ios xcode swift

我想在单击一个单元格时添加一个选项,它会在键盘上方显示浮动文本框,并使背景模糊。

有谁熟悉这个以及如何实现它? 您可以通过以下链接查看图像: Floating Text Box

2 个答案:

答案 0 :(得分:2)

首先向您的班级添加一些属性:

var textField = UITextField()
var composeBarView = UIView()
var blurView = UIView()
let barHeight:CGFloat = 44

接下来创建模糊视图,textField和容器视图。在viewWillAppear:

中执行此操作
blurView = UIView(frame: self.view.frame)
blurView.alpha = 0.5
blurView.backgroundColor = UIColor.blackColor();
self.view.addSubview(blurView);
blurView.hidden = true;// Note its hidden!

textField = UITextField(frame: CGRectMake(0, 0, UIScreen.mainScreen().bounds.width, barHeight))
composeBarView = UIView(frame: CGRectMake(0, UIScreen.mainScreen().bounds.height-64, UIScreen.mainScreen().bounds.width, barHeight));
composeBarView.addSubview(textField);

self.view.addSubView(composeBarView);

然后你应该注册UIKeyboardWillShowNotification和UIKeyboardWillHideNotification通知:

NSNotificationCenter.defaultCenter().addObserver(self, selector: "keyboardWillToggle:", name: UIKeyboardWillShowNotification, object: nil);
NSNotificationCenter.defaultCenter().addObserver(self, selector: "keyboardWillToggle:", name: UIKeyboardWillHideNotification, object: nil);

实现keyboardWillToggle方法:

func keyboardWillToggle(notfication: NSNotification){
    if let userInfo = notfication.userInfo {

        let endFrame = (userInfo[UIKeyboardFrameEndUserInfoKey] as NSValue).CGRectValue()
        let startFrame = (userInfo[UIKeyboardFrameBeginUserInfoKey] as NSValue).CGRectValue();

        let duration:NSTimeInterval = (userInfo[UIKeyboardAnimationDurationUserInfoKey] as? NSNumber)?.doubleValue ?? 0

        let animationCurveRawNSN = userInfo[UIKeyboardAnimationCurveUserInfoKey] as? NSNumber
        let animationCurveRaw = animationCurveRawNSN?.unsignedLongValue ?? UIViewAnimationOptions.CurveEaseInOut.rawValue
        let animationCurve:UIViewAnimationOptions = UIViewAnimationOptions(rawValue: animationCurveRaw)


        var signCorrection:CGFloat = 1;
        if (startFrame.origin.y < 0 || startFrame.origin.x < 0 || endFrame.origin.y < 0 || endFrame.origin.x < 0){
            signCorrection = -1;
        }

        let widthChange = (endFrame.origin.x - startFrame.origin.x) * signCorrection;
        let heightChange = (endFrame.origin.y - startFrame.origin.y) * signCorrection;

        let sizeChange = UIInterfaceOrientationIsLandscape(self.interfaceOrientation) ? widthChange : heightChange;

        var frame = composeBarView.frame

        frame.origin.y +=  (sizeChange - barHeight ?? 0.0 ) 
        composeBarView.frame = frame;
        UIView.animateWithDuration(duration,
            delay: NSTimeInterval(0),
            options: animationCurve,
            animations: { self.view.layoutIfNeeded() },
            completion: nil)
    }
}

请注意,当您显示键盘时,我们必须考虑条形高度。您需要将视图调整回原始位置。 然后当调用didSelectRowAtIndexPath时,您调用:

textFiled.becomeFirstResponder()
blureView.hidden = false;

答案 1 :(得分:0)

尚未测试,但我认为您可以使用模态segue进行测试吗?

例如,当您的文本字段变为编辑时,您可以转到新的CellViewcontroller,它可以显示在您的实际Tableview上方并插入此参数:

func prensentationController(controller: UIPresentationController, viewControllerdaptivePresentationStyle style: UIModalPresentationtyle) -> UIViewController
    let navcon = UINavigationController(UIPresentationViewController: controller.presentedViewController)
    let visualEffectView = UIVisualEffectView(effect:UIBlurEffect(style: .ExtraLight))
    visualEffectView.frame = navcon.view.bounds
    navcon.view.insertSubview(visualEffectView, atIndex: 0)
    return navcon
}