Can anyone help me understand how I apply a background image object to a UIView please?
I have created a background image which is a blurred version of a background and I would like to apply it to be the background of a uiView in the foreground which would ideally mask the background image.
I have the following code so far -
_blurImage = [source stackBlur:50];
[_HPBlurView.backgroundColor = [UIColor colorWithPatternImage:[_blurImage]]];
I would like to apply the image object(_blurImage) to be the background image of _hpBlurView but i'm struggling to get it working!
At first glance, you are using too many brackets. Here is a working version of your code :
_burImage = [source stackBlur:50];
_HPBlurImage.backgroundColor = [UIColor colorWithPatternImage:_blurImage];
I can't see what stackBlur:50 returns. So start from the beginning. colorWithPatternImag takes UIImage as a parameter. So Start by adding a picture, any picture, to your application. Lets imagine that the image is called image.png. This is one way to do it:
UIImage *image = [UIImage imageNamed:#"image.png"];
_HPBlurView.backgroundColor = [UIColor colorWithPatternImage:image];
This should help to get you going.
Create an image and add to the background.:
UIImage *image = [UIImage imageNamed:#"youimage"];
self.view.backgroundColor = [UIColor colorWithPatternImage:image];
It's that.
To make sure everything resizes properly, no matter rotation, device size and iOS version, I just set an UIImageView
//Create UIImageView
UIImageView *backgroundImageView = [[UIImageView alloc] initWithFrame:self.view.frame]; //or in your case you should use your _blurView
backgroundImageView.image = [UIImage imageNamed:#"image.png"];
//set it as a subview
[self.view addSubview:backgoundImageView]; //in your case, again, use _blurView
//just in case
[self.view sendSubviewToBack:backgroundImageView];
Related
I was trying to use the method outlined here for changing the color of a UIImage used for a UIView. I was hoping this method would ignore whitespace but it does not.
Here is the original image in which I'd like to replace the red with blue.
Here is the code
UIImage *image = [UIImage imageNamed:#"star-badge"];
image = [image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:...];
imageView.tintColor = [UIColor blueColor];
imageView.image = image;
[self.view addSubview:imageView];
but this is the result
is there a way to ignore the white space or only change the red color?
Change the original image so that the middle is transparent instead of white, then the method you're using should work. If need be, display it on a white background.
As David says, you need a transparent star, attached the image how should be just in case you cant handle it on photoshop
This question already has answers here:
How to set background image of a view?
(7 answers)
Closed 8 years ago.
I have set my background to be an image with
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:[self.Images objectAtIndex:arc4random_uniform(4) ]]];
This worked instantly, and in effect the background changed between two images... until I changed something in the array that holds the images. Then suddenly the images are repeated in tiles all over the background.
What could cause something like this?
colorWithPatternImage: Is the key here, your using your image to create a pattern, not as a background. As logan has explained you need to re think how your setting your background. If you want to set your background from a random image maybe post a new question on how to do this
Here's something that should solve your problem, you can put it in viewDidLoad:
UIImageView * bgImageView = [[UIImageView alloc]init];
bgImageView.frame = self.view.bounds;
bgImageView.contentMode = UIViewContentModeScaleAspectFit;
bgImageView.image = [UIImage imageNamed:[self.Images objectAtIndex:arc4random_uniform(4)]];
self.view = bgImageView;
You can change/access it later by doing this:
UIImageView *bgImageView = (UIImageView *)self.view;
bgImageView.image = [UIImage imageNamed:[self.Images objectAtIndex:arc4random_uniform(4)]];
I ended up with the following solution:
1) Created a UIImageView in the interface builder AND dragged this out to fill the entire screen
2) Set the content of the imageView with this command:
imageView.image = [UIImage imageNamed:#"Themes.png"];
or if using an array:
imageView.image = [UIImage imageNamed:self.myArray[x]];
Where "x" is of course the number of the element in the array -1 (0 indexing)
Im currently stylizing my login screen of my app, but I am running into a problem that i can't solve and is very odd... The image is not resizing properly and kind of starts to repeat itself, which i find very weird because i have the correct image sizes and have them correctly named, and i am calling them in my code correctly too, so i cannot find my problem. Below is the code.
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"sl_login_default"]];
colorWithPattern is meant to create a pattern out of an image. If you want to have an image in the background, create a new UIImageView
UIImageView *backgroundImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:imageName];
backgroundImageView.frame = self.view.bounds;
[self.view addSubview:backgroundImageView];
I am trying to set a UITableView background using the following method:
[self.tableView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"backgroundImage.png"]]];
This works great for making the background scroll with the table. However, my background image fades into a solid color, so instead of the background repeating, I'd love for it to just scroll up and just fit to the screen height. Then I can set self.view's backgroundColor to be the solid color and it will look great.
Other options seem to be blitting a small image at the bottom, but this seems complicated and I didn't quite understand how to draw the background and blit using CGContext.
Can someone tell me how to do this?
I'm not sure whether this will work but you should try creating a resizeable UIImage for the background:
If you want the last line of pixels to repeat you would call the
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode
on your image ( [UIImage imageNamed:#"backgroundImage.png"] )
with edgeinsets: UIEdgeInsetsMake(backgroundImage.size.height-1,0,0,0)
and resizingMode: UIImageResizingModeStretch
the complete call would look like
UIImage* backgroundImage = [UIImage imageNamed:#"backgroundImage.png"];
UIImage* newBackgroundImage = [backgroundImage resizableImageWithCapInsets:UIEdgeInsetsMake(backgroundImage.size.height-1,0,0,0) resizingMode:UIImageResizingModeStretch];
And now you could try to use this image for the pattern creation:
[self.tableView setBackgroundColor:[UIColor colorWithPatternImage:newBackgroundImage]];
This worked for me:
UIImageView* bgImageView = [[UIImageView alloc] initWithFrame:self.tableView.frame];
bgImageView.image = [UIImage imageNamed:#"bg"];
bgImageView.contentMode = UIViewContentModeTop;
[self.tableView addSubview:bgImageView];
[self.tableView sendSubviewToBack:bgImageView];
In my case it worked fine. I didn't test it with a lot of cells which are reused. But it should work :D
I couldn't find anything on how you can center the 'image' when you use (maybe you can't):
[self setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"background"]]];
Setting my [self setContentMode:UIContentModeCenter]; doesnt help.
Do I have to manually draw the image (either in drawRect or set the content of the CALayer? Which one if preferable?
I think you're on the wrong path here: you create a UIColor from a pattern (pattern already implies this is a repeating image). All in all- you can't have your pattern not repeat and centered.
If you just want simple image as background of your UIView, just add it as a subview and center it.
UIImage* img = [UIImage imageNamed:#"yourfile.png"];
UIImageView* imgView = [[UIImageView alloc]initWithImage: img];
[yourUIView addSubview: imgView];
imgView.center = CGPointMake(yourUIView.frame.size.width/2, yourUIView.frame.size.height/2);
Now - add more subviews to your "yourUIView" view and they'll show on top of the image - thus the image becoming the background.
So... no need to draw anything yourself.