在用户干预下设置UIImageView背景颜色

Question

I am developing an application in which I have a horizontal scroller. The scroller area comprise of different colors [which are nothing but UIImageView of colors].

Above the scroller area is a canvas [which is also a UIImageView ].

Now, what I want is that when I select any color in the scroller area, it should set on the canvas .

It is pretty much like a color picker but I am already providing solid color options to be selected by the user.

How should I go about it ? Any sample Code to get me started or my mind kicking would be awesome ?

Thanx a ton

Answer 1

To implement it easily.

• Use UIView not UIImageView
• Set UIView backgroundColor and place it on the scroll
• Set UITapGestureRecognizer on views, Refer here
• when a purticular view is touched you have its instance of view which is touched
• get the background color of the view and set it in the scroller

Answer 2

Can you take UIButtons instead of UIImageViews inside your scrollView to show colours to be picked.

This will make the implementation easier. User will select any colour button and you will receive a callback in buttons action selector method. Then based on button tag or any property you can set the colour to your canvas.

In current implementation it will be tricky as you need to know the exact content offset where the tap is done to make out which UIImageView was pressed.

coding steps:

• In your scroll view add UIButtons instead of UIImageView like:

   UIButton* button = [[UIButton alloc] initWithFrame:someRect]; //put some tag to button button.tag = someInt; //add selector to each button to get callback [view addTarget:self action:@selector(btnSelected:) forControlEvents:UIControlEventTouchUpInside]; [scrollView addSubview:button]; 

• In the btnSelected method put this code:

   -(IBAction)btnSelected:(id)sender; { UIButton* button = (UIButton*) sender; if (button.tag == someInt) { //do something like canvas.backgroundColor = button.backgroundColor; } } 

Answer 3

Instead of using UIImageViews or UIViews as suggested, I would put custom UIButtons for picking colors.

UIButton * colorButton;

//You will probably do these inside a for loop
colorButton = [UIButton buttonWithType:UIButtonTypeCustom];
[colorButton setFrame:CGRectMake(X, Y, buttonSize, buttonSize)];

[colorButton setTitle:@"" forState:UIControlStateNormal];

[colorButton setBackgroundColor:SOME_COLOR];
//Border visualization would be good if you are putting buttons side-by-side
[colorButton.layer setBorderWidth:1.0];
[colorButton.layer setBorderColor:[[UIColor darkGrayColor] CGColor]];

//You can use this tag to identify different buttons later
[colorButton setTag:INDEX+SOME_OFFSET]; //use loop index with some offset

[colorButton addTarget:self action:@selector(colorButtonPressed:) forControlEvents:UIControlEventTouchUpInside];

-(void) colorButtonPressed:(UIButton *) sender
{
     UIColor *selectedColor = sender.backgroundColor; //Or identify with sender.tag
     [yourCanvas doSmtOnCanvas:selectedColor];
}

Answer 4

Initialize UIImageView then add gesture recognizer to all imageViews by calling this method.

- (void) setupImageView : (UIImageView *) imageView{
    [imageView setUserInteractionEnabled:YES];
    UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(changeUIImageViewBackgroundColor:)];
    tapGestureRecognizer.numberOfTapsRequired = 1;
    [imageView addGestureRecognizer:tapGestureRecognizer];
}

Now change color of canvasView within the selector by following way:

- (void) changeUIImageViewBackgroundColor : (UITapGestureRecognizer *) recognizer{
    UIImageView *imageView = (UIImageView *)[recognizer view];
    [canvasView setBackgroundColor:[imageView backgroundColor]];
}

Answer 5

You can put a tap gesture in your scrollview and whenever a tap is made in the scroll check whether the tap is on the imageview. (You will get whether the tap point in on imageview or not) and according you can change the image.

Second alternative is to take a custom button and handle on its click.

Hope it helps