Ios 如何在swift中创建可折叠/可展开视图
我在android上创建了一个可折叠/可扩展的表单。请看下面的GIF 我正在尝试在ios上创建类似的东西,到目前为止,我已经创建了如下所示的底部工作表 看这张GIF,你会注意到我可以展开和折叠视图,但是在视图以前的位置有一个很大的间隙,预期的行为是空间也会随着动画而折叠 下面是底页的代码Ios 如何在swift中创建可折叠/可展开视图,ios,swift,swift5,Ios,Swift,Swift5,我在android上创建了一个可折叠/可扩展的表单。请看下面的GIF 我正在尝试在ios上创建类似的东西,到目前为止,我已经创建了如下所示的底部工作表 看这张GIF,你会注意到我可以展开和折叠视图,但是在视图以前的位置有一个很大的间隙,预期的行为是空间也会随着动画而折叠 下面是底页的代码 class BottomSheetViewController: UIViewController { // holdView can be UIImageView instead @IBO
class BottomSheetViewController: UIViewController {
// holdView can be UIImageView instead
@IBOutlet weak var holdView: UIView!
@IBOutlet weak var left: UIButton!
@IBOutlet weak var right: UIButton!
@IBOutlet weak var pickupView: UIView!
@IBOutlet weak var deliveryView: UIView!
@IBOutlet weak var deliverydetailsView: UIView!
@IBOutlet weak var pickupDetailsVIew: UIControl!
let fullView: CGFloat = 100
var partialView: CGFloat {
return UIScreen.main.bounds.height - 300
}
override func viewDidLoad() {
super.viewDidLoad()
let gesture = UIPanGestureRecognizer.init(target: self, action: #selector(BottomSheetViewController.panGesture))
view.addGestureRecognizer(gesture)
let pickupTapGesture = UITapGestureRecognizer(target: self, action: #selector(pickupButton))
let deliveryTapGesture = UITapGestureRecognizer(target: self, action: #selector(deliveryButton))
pickupView.addGestureRecognizer(pickupTapGesture)
deliveryView.addGestureRecognizer(deliveryTapGesture)
pickupView.setBorder(radius: 5, color: .black)
deliveryView.setBorder(radius: 5, color: .black)
roundViews()
deliverydetailsView.isHidden = true
pickupDetailsVIew.isHidden = true
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
prepareBackgroundView()
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
UIView.animate(withDuration: 0.6, animations: { [weak self] in
let frame = self?.view.frame
let yComponent = self?.partialView
self?.view.frame = CGRect(x: 0, y: yComponent!, width: frame!.width, height: frame!.height)
})
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
@IBAction func rightButton(_ sender: AnyObject) {
print("clicked")
}
@objc func pickupButton(_ sender: UITapGestureRecognizer) {
print("tap")
if pickupDetailsVIew.isHidden {
expand(pickupDetailsVIew)
collapse(deliverydetailsView)
} else {
collapse(pickupDetailsVIew)
}
}
@objc func deliveryButton(_ sender: UITapGestureRecognizer) {
print("tap")
if deliverydetailsView.isHidden {
expand(deliverydetailsView)
collapse(pickupDetailsVIew)
} else {
collapse(deliverydetailsView)
// if deliveryView.isHidden && pickupDetailsVIew.isHidden {
//
// }
}
}
func expand(_ view: UIView) {
view.isHidden = false
}
func collapse(_ view: UIView) {
view.isHidden = true
}
// @IBAction func close(_ sender: AnyObject) {
// UIView.animate(withDuration: 0.3, animations: {
// let frame = self.view.frame
// self.view.frame = CGRect(x: 0, y: self.partialView, width: frame.width, height: frame.height)
// })
// }
@objc func panGesture(_ recognizer: UIPanGestureRecognizer) {
let translation = recognizer.translation(in: self.view)
let velocity = recognizer.velocity(in: self.view)
let y = self.view.frame.minY
if ( y + translation.y >= fullView) && (y + translation.y <= partialView ) {
self.view.frame = CGRect(x: 0, y: y + translation.y, width: view.frame.width, height: view.frame.height)
recognizer.setTranslation(CGPoint.zero, in: self.view)
}
if recognizer.state == .ended {
var duration = velocity.y < 0 ? Double((y - fullView) / -velocity.y) : Double((partialView - y) / velocity.y )
duration = duration > 1.3 ? 1 : duration
UIView.animate(withDuration: duration, delay: 0.0, options: [.allowUserInteraction], animations: {
if velocity.y >= 0 {
self.view.frame = CGRect(x: 0, y: self.partialView, width: self.view.frame.width, height: self.view.frame.height)
} else {
self.view.frame = CGRect(x: 0, y: self.fullView, width: self.view.frame.width, height: self.view.frame.height)
}
}, completion: nil)
}
}
func roundViews() {
view.layer.cornerRadius = 5
holdView.layer.cornerRadius = 3
// left.layer.cornerRadius = 10
// right.layer.cornerRadius = 10
// left.layer.borderColor = UIColor(red: 0, green: 148/225, blue: 247.0/255.0, alpha: 1).cgColor
// left.layer.borderWidth = 1
view.clipsToBounds = true
}
func prepareBackgroundView(){
// let blurEffect = UIBlurEffect.init(style: .dark)
// let visualEffect = UIVisualEffectView.init(effect: blurEffect)
// let bluredView = UIVisualEffectView.init(effect: blurEffect)
// bluredView.contentView.addSubview(visualEffect)
//
// visualEffect.frame = UIScreen.main.bounds
// bluredView.frame = UIScreen.main.bounds
//
// view.insertSubview(bluredView, at: 0)
}
}
class-BottomSheetViewController:UIViewController{
//holdView可以改为UIImageView
@IBVAR holdView:UIView!
@IBVAR左:UIButton!
@IBVAR右:UIButton!
@IBV弱var拾取视图:UIView!
@IBVAR交付视图:UIView!
@IBOUTLE弱var交付详细信息视图:UIView!
@IBOUTLE弱var PickupDetails视图:UIControl!
让fullView:CGFloat=100
var partialView:CGFloat{
返回UIScreen.main.bounds.height-300
}
重写func viewDidLoad(){
super.viewDidLoad()
让手势=UIPangestureRecognitor.init(目标:self,动作:#选择器(BottomSheetViewController.panGesture))
view.AddGestureRecognitor(手势)
让PickupApsignature=UITapGestureRecognizer(目标:自我,操作:#选择器(pickupButton))
让DeliveryTap手势=UITapGestureRecognitizer(目标:自我,操作:#选择器(deliveryButton))
pickupView.AddGestureRecognitor(PickupTap手势)
deliveryView.AddGestureRecognitor(DeliveryTap手势)
pickupView.setBorder(半径:5,颜色:。黑色)
deliveryView.setBorder(半径:5,颜色:。黑色)
圆视图()
deliverydetailsView.ishiden=true
pickupDetailsVIew.ishiden=true
}
覆盖函数视图将出现(uo动画:Bool){
超级。视图将显示(动画)
prepareBackgroundView()
}
覆盖函数视图显示(u动画:Bool){
super.viewdide显示(动画)
动画(持续时间:0.6,动画:{[weak self]in
设frame=self?.view.frame
让yComponent=self?partialView
self?.view.frame=CGRect(x:0,y:yComponent!,宽度:frame!。宽度,高度:frame!。高度)
})
}
重写函数didReceiveMemoryWarning(){
超级。我收到了记忆警告()
//处置所有可以重新创建的资源。
}
@iAction func rightButton(\uSender:AnyObject){
打印(“单击”)
}
@objc func拾取按钮(\发送方:UITapGestureRecognitor){
打印(“点击”)
如果pickupDetailsVIew.isHidden{
展开(pickupDetailsVIew)
折叠(deliverydetailsView)
}否则{
折叠(pickupDetailsVIew)
}
}
@objc func deliveryButton(\发送方:UITapgestureRecognitizer){
打印(“点击”)
如果deliverydetailsView.isHidden{
展开(deliverydetailsView)
折叠(pickupDetailsVIew)
}否则{
折叠(deliverydetailsView)
//如果deliveryView.ishiden&&pickupDetailsVIew.ishiden{
//
// }
}
}
func展开(view:UIView){
view.ishiden=false
}
func折叠(view:uView){
view.ishiden=true
}
//@IBAction func close(uu发送方:AnyObject){
//UIView.animate(持续时间:0.3,动画:{
//设frame=self.view.frame
//self.view.frame=CGRect(x:0,y:self.partialView,width:frame.width,height:frame.height)
// })
// }
@objc func panGesture(识别器:UIPANGESTURE识别器){
let translation=recognizer.translation(在:self.view中)
让velocity=recognizer.velocity(在:self.view中)
设y=self.view.frame.minY
如果(y+translation.y>=fullView)和(y+translation.y 1.3?1:持续时间
UIView.animate(withDuration:duration,delay:0.0,选项:[.allowUserInteraction],动画:{
如果速度.y>=0{
self.view.frame=CGRect(x:0,y:self.partialView,width:self.view.frame.width,height:self.view.frame.height)
}否则{
self.view.frame=CGRect(x:0,y:self.fullView,宽度:self.view.frame.width,高度:self.view.frame.height)
}
},完成日期:无)
}
}
func圆视图(){
view.layer.cornerRadius=5
holdView.layer.cornerRadius=3
//left.layer.cornerRadius=10
//右.layer.cornerRadius=10
//left.layer.borderColor=UIColor(红色:0,绿色:148/225,蓝色:247.0/255.0,alpha:1)。cgColor
//left.layer.borderWidth=1
view.clipstobunds=true
}
func prepareBackgroundView(){
//让blurEffect=UIBlurEffect.init(样式:。暗)
//让visualEffect=UIVisualEffectView.init(效果:blurEffect)
//让bluredView=UIVisualEffectView.init(效果:blurEffect)
//bluredView.contentView.addSubview(visualEffect)
//
//visualEffect.frame=UIScreen.main.bounds
//bluredView.frame=UIScreen.main.bounds
//
//view.insertSubview(模糊视图,位于:0)
}
}
我需要以前做过这件事或知道如何做这件事的人向我提供一些正确方向的帮助/指点
谢谢问题?您声明-并且您的代码建议-您正在使用故事板。您在某种程度上也在使用自动布局吗?我正在使用.xib文件作为底部工作表,而没有使用自动布局