当TouchMoved函数上x坐标发生变化时,动态更改UICollection视图的宽度

时间:2017-06-09 14:20:28

标签: ios swift

大家。 我正在快速制作滑出菜单。我让一切都很好。滑出菜单显示何时单击汉堡包按钮以及何时在屏幕上向右滑动。现在我想根据屏幕上的用户坐标改变滑出菜单的大小(宽度)。

幻灯片是使用UIView顶部的集合视图实现的。

要从屏幕上取得用户的位置,我使用了touchMoved功能来获取用户的实时x值。是否有任何方法可以使用此值,以便可以更改集合的视图宽度。

Screen shot

任何帮助都会非常有帮助。如果需要,我可以上传所有代码。改变锚尺寸也没有帮助。

MoreOptionsViewController.swift

    override init() {
    super.init();

    collectionView.delegate = self;
    collectionView.dataSource = self;
    collectionView.register(MoreOptionsCell.self, forCellWithReuseIdentifier: cellId);

    getData();
}

func showMoreOptions(){
    if let window = UIApplication.shared.keyWindow{
        window.addSubview(view);

        view.setAnchor(top: window.topAnchor, bottom: window.bottomAnchor, left: window.leftAnchor, right: window.rightAnchor);
        view.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(handleTapOutside)));
        view.alpha = 0.5;
        collectionView.alpha = 1;

        window.addSubview(collectionView);

        let width = window.frame.width * 0.9;

        //Animate the collection view's width
        UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
            self.collectionView.leftAnchor.constraint(equalTo: window.leftAnchor).isActive = true;
            self.collectionView.topAnchor.constraint(equalTo: window.topAnchor).isActive = true;

            self.collectionView.widthAnchor.constraint(equalToConstant: width).isActive = true;
            self.collectionView.heightAnchor.constraint(equalTo: window.heightAnchor).isActive = true;
        }, completion: nil)

    }
}

func handleTapOutside(){
    collectionView.removeFromSuperview();
    view.removeFromSuperview();
}

let view: UIView = {
    let view = UIView();
    view.backgroundColor = UIColor.black;
    view.translatesAutoresizingMaskIntoConstraints = false;
    return view;
}();

let collectionView: UICollectionView = {
    let layout = UICollectionViewFlowLayout();
    layout.minimumLineSpacing = 0;
    let cv = UICollectionView(frame: .zero, collectionViewLayout: layout);
    cv.showsVerticalScrollIndicator = false;
    cv.backgroundColor = UIColor(red: 59/255, green: 65/255, blue: 65/255, alpha: 0.9);
    cv.translatesAutoresizingMaskIntoConstraints = false;
    return cv;
}();

上面的代码包含实际的集合视图,用于显示幻灯片菜单。

如果我尝试从touchMoved函数更改宽度,我会收到很多错误。任何帮助都感激不尽。

2 个答案:

答案 0 :(得分:0)

尝试通过在touchMoved函数中更新其框架来设置集合视图的宽度

yourCollectionView.frame = CGRect(x: 0, y: 0, width: <user's_x_scroll_value>, height: height)

答案 1 :(得分:0)

解决了这个问题。问题是由动画代码引起的。

func showMoreOptions(xValue: CGFloat){
        if let window = UIApplication.shared.keyWindow{
            window.addSubview(view);

            //Display the view beyond the screen. Increase the x coordinates according to the x value of screen
            view.frame = CGRect(x: -window.frame.width + xValue , y: 0, width: window.frame.width, height: window.frame.height);
            view.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(handleTapOutside)));

            print("View's x value is ", xValue)
            view.alpha = 0.011; //Use minimum alpha value
            collectionView.alpha = 1;

            window.addSubview(collectionView);
            //Same as above view
            collectionView.frame = CGRect(x: -window.frame.width + xValue, y: 0, width: window.frame.width * 0.9, height: window.frame.height);

            view.layoutIfNeeded()
            collectionView.collectionViewLayout.invalidateLayout();
        }
    }

另外,collectionView.collectionViewLayout.invalidateLayout()修复了问题。谢谢Eli的帮助