ios - 水平拾色器的 UI 帮助

Question

我正在尝试通过读取 ImageView 的像素来制作颜色选择器。现在我在背景中有一个 ImageView 并从中检索像素颜色。

但现在我想像这样改变我的用户界面，所以需要帮助我应该如何制作这个用户界面

这是我认为这会像 UIView->n 没有。 Imageview 和箭头将在其顶部。

但是有几件事我不确定我将如何去做

1. 我必须保持一些颜色解锁，因为水平被交叉颜色将被解锁
2. 旋钮不应超出范围
3. 我必须从箭头的边缘检索颜色，以便获得正确的像素值

Answer 1

这是我对如何处理这个问题的建议，

创建图像列表和每个图像的颜色值 像 NSDictionary，

NSDictionary *colors = @{[UIColor redColor]: [UIImage imageNamed:@"red"], [UIColor greenColor]: [UIImage imageNamed:@"green"], [UIColor yellowColor: [UIImage imageNamed:@"green"]]}

然后创建 ImageView 并将图像添加到 View ，并为每个 ImageView 添加点击手势识别器；

UIView *parentView = self.parentView;
CGFloat knobHeight = 20;
CGFloat colorViewHeight = 20;
CGFloat colorViewWidht = 20;
int index = 0;
for(UIColor *color in colors){

 CGRect frame = CGRectMake(index * colorViewWidth, knobHeight, colorViewWidth, colorViewHeight);
 UIImageView *imageView = [[UIImageView alloc] initWithFrame: frame];
 imageView.image = colors[color];
 [parentView addSubView:imageView];
 UITapGestureRecognizer *tapGestureRecognizer = [UITapGestureRecognizer alloc] initWithTarget: self selector:@selector(tappedImage:)];
 imageView.userInteractionEnabled = YES;
 [imageView addGestureRecognizer: tapGestureRecognizer];

}

首先给第一个imageView添加knob；

UIImageView *firstImageView = [[parentView subView] firstObject];
CGRect knobFrame = CGRectMake (CGRectGetMidX(firstImageView.frame) - knobWidth / 2, 0, knobWidth, knobHeight);
UIImageView *knobImageView = [[UIImageView alloc] initWithFrame:knobFrame];
[parentView addSubview: knobImageView];

然后，在分接选择器中，您可以将旋钮变化设置为动画；

- (void)tappedImage:(UITapGestureRecognizer*)tap{
  UIImageView *tappedImageView = tap.view;
  CGRect newKnobFrame = CGRectMake((CGRectGetMidX(tappedImageView.frame) - knobWidth / 2, 0 , knobWidth, knobHeight);
  [UIView animateWithDuration:2.0 animations:^{
    knobImageView.frame = newKnobFrame;
  }];
 }

您还可以跟踪要锁定选择的颜色。然后，不要为这些图像启用 userInteraction，也不要添加手势识别器。您可以设置 alpha 值以显示无法选择它。

这段代码是直接输入的，但它应该让您大致了解它是如何工作的。