Android水平滚动视图选择器 - Xamarin

时间:2017-03-06 03:17:26

标签: c# android xml xamarin horizontalscrollview

我正在尝试实施一个选择器。在下面的图像中,当用户向左滑动时,将选择早餐并显示结果,如果您在早餐新闻晚餐上也可以顺利滚动到晚餐。我到目前为止的XML是:

class ChatlistCell: UITableViewCell{

var leftSwipe = UIPanGestureRecognizer()

override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code

    setupForCell()    

}

func setupForCell(){

    //SwipeButton
    //Hide Button
    rightHide.frame = CGRect(x:UIScreen.main.bounds.width, y:0, width:150, height:71)
    rightHide.backgroundColor = UIColor(hex:"778295")
    addSubview(rightHide)

    HideLabel.frame = CGRect(x: 19.0, y: 28.0, width: 70, height: 15)
    HideLabel.font = UIFont.systemFont(ofSize:15)
    HideLabel.text = "Hide"
    HideLabel.textColor = UIColor.white
    rightHide.addSubview(HideLabel)

    //Delete Button
    rightDelete.frame = CGRect(x:UIScreen.main.bounds.width, y:0, width:75, height:71)
    rightDelete.backgroundColor = UIColor(hex:"ff3600")
    addSubview(rightDelete)

    DeleteLabel.frame = CGRect(x: 25.0, y: 28.0, width: 70, height: 15)
    DeleteLabel.font = UIFont.systemFont(ofSize:15)
    DeleteLabel.text = "Delete"
    DeleteLabel.textColor = UIColor.white
    rightDelete.addSubview(DeleteLabel)


    //Mute Button
    leftMute.frame = CGRect(x:-150, y:0, width:150, height:71)
    leftMute.backgroundColor = UIColor(hex:"5181e2")
    addSubview(leftMute)

    muteImg.frame = CGRect(x:97.5, y:20.5, width:30, height:30)
    muteImg.image = UIImage(named:"chat_list_icon_notice_on")
    leftMute.addSubview(muteImg)

    //Pin Button
    leftPin.frame = CGRect(x:-75, y:0, width:75, height:71)
    leftPin.backgroundColor = UIColor(hex:"82a5e6")
    addSubview(leftPin)

    pinImg.frame = CGRect(x:22.5, y:20.5, width:30, height:30)
    pinImg.image = UIImage(named:"chat_list_icon_pin_off")
    leftPin.addSubview(pinImg)


    leftSwipe = UIPanGestureRecognizer(target: self, action:#selector(self.swipe))
    leftSwipe.delegate = self

    self.mainView.addGestureRecognizer(leftSwipe)
}

func swipe(recognizer: UIPanGestureRecognizer){

    let translation = recognizer.translation(in:self)

    recognizer.setTranslation(CGPoint.zero, in: self)
    print(translation)

    if recognizer.state == UIGestureRecognizerState.began{

    }

    if recognizer.state == UIGestureRecognizerState.ended{
    //    self.mainView.center = CGPoint(x:mainView.center.x + translation.x , y:mainView.center.y)
        if self.mainView.center.x <= UIScreen.main.bounds.width/2 - 76{

            UIView.animate(withDuration: 0.2, delay: 0.0, options: [], animations:{ _ in
                self.mainView.frame = CGRect(x:-152.0, y:0, width:UIScreen.main.bounds.width, height:71)
                self.rightHide.frame = CGRect(x:UIScreen.main.bounds.width - 152, y:0, width:152, height:71)
                self.rightDelete.frame = CGRect(x:UIScreen.main.bounds.width - 76, y:0, width:76, height:71)

            }, completion: nil)

        }else if self.mainView.center.x >= UIScreen.main.bounds.width/2 + 76{

            UIView.animate(withDuration: 0.2, delay: 0.0, options: [], animations:{ _ in
                self.mainView.frame = CGRect(x:152.0, y:0, width:UIScreen.main.bounds.width, height:71)
                self.leftMute.frame = CGRect(x:0, y:0, width:152, height:71)
                self.leftPin.frame = CGRect(x:0, y:0, width:76, height:71)

            }, completion: nil)


        }else{

            UIView.animate(withDuration: 0.2, delay: 0.0, options: [], animations:{ _ in
                self.mainView.frame = CGRect(x:0, y:0, width:UIScreen.main.bounds.width, height:71)
                self.rightHide.frame = CGRect(x:UIScreen.main.bounds.width, y:0, width:152, height:71)
                self.rightDelete.frame = CGRect(x:UIScreen.main.bounds.width, y:0, width:76, height:71)
                self.leftMute.frame = CGRect(x:-152, y:0, width:152, height:71)
                self.leftPin.frame = CGRect(x:-76, y:0, width:76, height:71)

            }, completion: nil)
        }

    }

    if recognizer.state == UIGestureRecognizerState.changed{

        self.mainView.center = CGPoint(x:mainView.center.x + translation.x , y:mainView.center.y)

        //left swipe
        if self.mainView.center.x < UIScreen.main.bounds.width/2{

            if self.mainView.center.x <= UIScreen.main.bounds.width/2 - 152 {
                self.rightHide.center = CGPoint(x:UIScreen.main.bounds.width - 76, y:mainView.center.y)
                self.rightDelete.center = CGPoint(x: UIScreen.main.bounds.width - 38 , y: mainView.center.y)
            }else{
                self.rightHide.center = CGPoint(x:rightHide.center.x + translation.x, y:mainView.center.y)
                self.rightDelete.center = CGPoint(x: rightDelete.center.x + translation.x/2, y: mainView.center.y)
            }
            //right swipe
        }else{

            if self.mainView.center.x >= UIScreen.main.bounds.width/2 + 152 {
                self.leftMute.center = CGPoint(x: 76, y:mainView.center.y)
                self.leftPin.center = CGPoint(x:38 , y: mainView.center.y)
            }else{
                self.leftMute.center = CGPoint(x:leftMute.center.x + translation.x, y:mainView.center.y)
                self.leftPin.center = CGPoint(x: leftPin.center.x + translation.x/2, y: mainView.center.y)
            }

        }

    } else{

    }

}

我不太确定这是最好的解决方法我还希望在选择选项下显示小绿条,如下图所示。任何指针或帮助将非常感激。很想知道我是否与XML一致,如果你能指出我如何在代码中制作选择器的正确方向,那就太棒了!

Ĵ enter image description here

1 个答案:

答案 0 :(得分:1)

  

我不太确定这是最好的解决方法我还希望在选择选项下显示小绿条,如下图所示。

实现此类视图的常用方法是在Android中使用ViewPager和指标。您可以使用一些库来简化此工作,例如ViewPagerIndicator,您可以查看一些示例。

或者您可以尝试创建自己的。正如您在代码中所做的那样,使用HorizontalScrollView创建指标。因此,您正朝着正确的方向创建指标,只需在指标中使用ViewPager并为其设置滚动侦听器。