在子视图上使用NSLayoutConstraint与仿射变换结合使用

时间:2015-12-16 17:21:36

标签: ios objective-c cocoa-touch autolayout

我需要有垂直滑块。为此,我有一个包含UIView的{​​{1}}类,在UISlider内,我使用仿射变换旋转滑块90度。

我现在正在为它添加Autolayout支持。

我希望允许滑块以不同的长度进行实例化,以便可以在动态的Autolayout意义上使用它。这是我正在尝试的代码,以使旋转的滑块符合位于initWithFrame:

中的UIView的边界
initWithFrame:

这就是生成的视图的样子。我已经实例化了三个不同的垂直滑块。左边的那个有300到300的框架,右边的框架有50到300的框架,中间的框架有300到50的框架。我已经为{{{{{{ 1}}框架为灰色,并将self = [super initWithFrame:frame]; if(self) { self.slider = [[UISlider alloc] init]; [self addSubview:self.slider]; self.slider.value = 0; self.slider.transform = CGAffineTransformMakeRotation(M_PI * 1.5); [self.slider setTranslatesAutoresizingMaskIntoConstraints:NO]; [self addConstraint:[NSLayoutConstraint constraintWithItem:self.slider attribute: NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterX multiplier:1.0f constant:0.0f]]; [self addConstraint:[NSLayoutConstraint constraintWithItem:self.slider attribute: NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterY multiplier:1.0f constant:0.0f]]; [self addConstraint:[NSLayoutConstraint constraintWithItem:self.slider attribute: NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeLeft multiplier:1.0f constant:0.0f]]; [self addConstraint:[NSLayoutConstraint constraintWithItem:self.slider attribute: NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0f constant:0.0f]]; self.backgroundColor = [UIColor colorWithWhite:.8 alpha:1.0]; self.layer.borderWidth = 1; self.slider.backgroundColor = [UIColor colorWithRed:.21 green:.95 blue:1 alpha:1]; self.slider.layer.borderWidth = 1; return self; } 的背景着色为蓝色。

Vertical Slider instances

300乘300的问题在于我认为我不能让框架那么大。会有其他的观点,我担心那个会妨碍你。

左边的问题是滑块太小了。

中间的问题是,由于滑块已经旋转出视图的框架,因此无法抓住拇指并将其移动。

我也尝试将滑块的顶部约束到视图的右侧,将滑块的右侧约束到视图的底部,但这会产生错误和不可预测的结果。

我需要更改什么才能使这些约束有效?

1 个答案:

答案 0 :(得分:4)

比看起来简单。 UIView父级都设置为符合布局约束。它可以更简单地管理它的滑块子视图这是全班。这可以在包含initWithFrame:的代码中创建,或者将视图拖放到IB中并设置类== TwistedSlider。这就是整个事情......

@interface TwistedSlider ()
@property(weak,nonatomic) UISlider *slider;
@end

@implementation TwistedSlider

- (UISlider *)slider {
    if (!_slider) {
        UISlider *slider = [[UISlider alloc] init];
        [self addSubview:slider];
        _slider = slider;
    }
    return _slider;
}

// this works for any size of this view.  the slider will always be as tall as this view is wide
- (void)layoutSubviews {
    [super layoutSubviews];
    // size it to be as wide as this view's height, center it in this view
    self.slider.bounds = CGRectMake(0, 0, self.bounds.size.height, self.slider.bounds.size.height);
    self.slider.center = [self convertPoint:self.center fromView:self.superview];
    // rotate it
    self.slider.transform = CGAffineTransformMakeRotation(M_PI_2);
}

// that's it!
@end