UIScrollView - transparent PNG sliding over an image background - objective-c

Trying to get PNG transparency to appear in a UIScrollView. Instead of transparent is all black now. I tried to set view.opaque = NO, and view.backGroundcolor = [UIColor clearColor] to no avail.
RootViewController has an image background set with
self.view.opaque = NO;
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"appBackground.png"]];
RootViewController has also a UIScrollView that I load other two UIViewController views (leftScreen, centralScreen) into:
CGRect frame = scrollView.frame;
frame.origin.x = 0;
frame.origin.y = 0;
leftScreen.view.frame = frame;
[scrollView addSubview:leftScreen.view];
frame.origin.x = frame.size.width;
frame.origin.y = 0;
centralScreen.view.frame = frame;
[scrollView addSubview:centralScreen.view];
The centralScreen.view has a 24bit transparent PNG background that I set in its UIViewController with
self.view.opaque = NO;
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"homePageText.png"]];
In the end the centralScreen background PNG has black where the transparency should be. Any recommendations/hints on how to fix this? Thanks!

You should not use backgroundColor for that, 'cause you lost any control on how the image is draw (i.e.: you can't resize it).
I suggest you to put an UIImageView as "background" (add it then use sendSubviewToBack:).

Related

Overlay a transparent dark mask to UIImageView

I'm trying on xcode to add a transparent dark mask on an UIImageView but without success, what i tried is to create a UIView set his width and height same to the UIImageView I created on the storyboard and then add a background color with opacity to the view
This is the code I used:
UIView *darken;
CGRect newFrame = darken.frame;
newFrame.size.width = _image1.frame.size.width;
newFrame.size.height = _image1.frame.size.height;
[darken setFrame:newFrame];
darken.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.85];
[_image1 addSubview:darken];
Can someone help me understand why it doesn't work?
You are not setting the views frame correctly. The x and y values are never set. Also the view never gets initialized and you should add the view to self.view not to the imageView itself.
Try this instead:
UIView *darken = [[UIView alloc]init];
darken.frame = _image1.frame;
//...
[self.view insertSubview:darken aboveSubview:_image1];

UIView changing the size of the image?

I am trying to add UIImage to UIView .
The image is exactly in the size of the view -as i defined the view rect .
Somehow i see that the images is displayed wider,and taller(its stretched ) .
Why does my view is change the image size ?
UIImage *strip=[UIImage imageNamed:#"albumStrip.png"];
UIImageView *imageView=[[UIImageView alloc]initWithImage:strip];
UIView * aView = [ [UIView alloc] initWithFrame:CGRectMake(0.03*winSize.width, 0.85*winSize.height , 0.95*winSize.width, winSize.width/10) ];
aView.backgroundColor = [UIColor whiteColor];
aView.tag = 31000;
aView.layer.cornerRadius=1;
[aView addSubview:imageView];
EDIT :
I can see that my image is 640x960. is it possible that for the iPhone4 the UIImage dont know how to take it and div it by factor 2 ?
Try setting the UIImageView's ContentMode (http://developer.apple.com/library/ios/#documentation/uikit/reference/UIImageView_Class/Reference/Reference.html)
imageView.contentMode = UIViewContentModeScaleAspectFit;
use
imageView.layer.masksToBounds = YES;
which will restrict image to be wide and taller
If the masksToBounds property is set to YES, any sublayers of the layer that extend outside its boundaries will be clipped to those boundaries. Think of the layer, in that case, as a window onto its sublayers; anything outside the edges of the window will not be visible. When masksToBounds is NO, no clipping occurs, and any sublayers that extend outside the layer's boundaries will be visible in their entirety (as long as they don't go outside the edges of any superlayer that does have masking enabled).
of course your image is going to be stretched and can not be shown in your view.
Because its frame is a lot bigger than the size of the UIView.
you should set the frame of the UIImageView to be the same size as your UIView, the add it as a subView:
UIImage *strip=[UIImage imageNamed:#"albumStrip.png"];
CGRect frame = CGRectMake(0.03*winSize.width, 0.85*winSize.height , 0.95*winSize.width, winSize.width/10);
// create the uiimageView with the same frame size as its parentView.
UIImageView *imageView=[[UIImageView alloc] initWithFrame:frame];
// set the image
imageView.image = strip;
// create the view with the same frame
UIView * aView = [ [UIView alloc] initWithFrame:frame];
aView.backgroundColor = [UIColor whiteColor];
aView.tag = 31000;
aView.layer.cornerRadius=1;
[aView addSubview:imageView];
and of course if you can make the size of the uiimageview smaller ;)

What's the right way to dynamically give height to a UIScrollView depending on the content within?

Here my dilemma. I have 4 elements inside a UIScrollView.
1. Top most element is a UILabel that I give height dynamically depending upon the amount of content in it.
2. Second is a fixed height UILabel that I give position dynamically depending upon the height given to the upper UILabel
3. Third element is a UIImageView that again I have to give position dynamically depending upon the height given to the topmost UILabel
4. The fourth is a UIWebView, to which I gave both, height & position dynamically. (Height depending upon the content in it.. and position again depending on the height of topmost UILabel)
Finally, I dynamically give height to my UIScrollView to accomodate all of the above elements.
Here is the code I use in - (void)webViewDidFinishLoad:(UIWebView *)webView to accomplish all of the above.
//Adjust height of top-most UILabel
CGSize maximumLabelSize = CGSizeMake(300,9999);
CGSize expectedLabelSize = [item.label1 sizeWithFont:label1.font constrainedToSize:maximumLabelSize lineBreakMode:label1.lineBreakMode];
CGRect newFrame = label1.frame;
newFrame.size.height = 0;
newFrame.size.height = expectedLabelSize.height;
label1.frame = newFrame;
//Adjust position of second UILlabel
CGRect labelPosition = label2.frame;
labelPosition.size.height = 20;
labelPosition.origin.y = expectedLabelSize.height +14;
label2.frame = labelPosition;
//Add UIImageView and adjust it's position
UIImageView *image;
image = [[UIImageView alloc] initWithFrame:CGRectMake(0, expectedLabelSize.height +41, 320, 2)];
image.image = [UIImage imageNamed:#"image.png"];
[scrollView addSubview:image];
[image release];
//Adjust UIWebView height and position
CGRect frame = webView.frame;
frame.size.height = 0;
frame.origin.y = expectedLabelSize.height +48;
webView.frame = frame;
CGSize fittingSize = [webView sizeThatFits:CGSizeZero];
frame.size = fittingSize;
webView.frame = frame;
//Adjust Scrollview height
scrollView.contentSize = CGSizeMake(320, fittingSize.height +expectedLabelSize.height +48);
Finally, my problem is that when I first load this view, everything but the scrollview get's proper height & position. But, if I go back one view & open this view again, the scrollview has the desired height.
Any ideas what I might be doing wrong here?
My guess is that the scrollView variable isn't yet initialized when this first runs. Try setting a breakpoint somewhere in this code and checking if scrollView has a value or if it's just 0x00000000.

setting view boundaries

I have a scrollview with an image as a subview. I would like to set the boundaries of the scrollview to be the size of the image view, so that you wouldn't be able to see any of the background.
I don't want this happening anymore.
The weird part is, that after you zoom in or out on the image, then the boundaries seem to fix themselves, and you can no longer move the image out of the way and see the background.
This is what I have going for code:
-(UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView
{
// return which subview we want to zoom
return self.imageView;
}
-(void)viewDidLoad{
[super viewDidLoad];
[self sendLogMessage:#"Second View Controller Loaded"];
//sets the initial view to scale to fit the screen
self.imageView.frame = CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds));
//sets the content size to be the size our our whole frame
self.scrollView.contentSize = self.imageView.image.size;
//setes the scrollview's delegate to itself
self.scrollView.delegate = self;
//sets the maximum zoom to 2.0, meaning that the picture can only become a maximum of twice as big
[self.scrollView setMaximumZoomScale : 2.5];
//sets the minimum zoom to 1.0 so that the scrollview can never be smaller than the image (no matter how far in/out we're zoomed)
[self.scrollView setMinimumZoomScale : 1.0];
[imageView addSubview:button];
}
I thought that this line would solve my problem
//sets the content size to be the size our our whole frame
self.scrollView.contentSize = self.imageView.image.size;
But like I said, it only works after I zoom in or out.
EDIT: When I switch
self.scrollView.contentSize = self.imageView.image.size;
to
self.scrollView.frame = self.imageView.frame;
It works like I want it to (you can't see the background), except the toolbar on the top is covered by the image.
imageView.image.size isn't necessarily the frame of the imageView itself, try setting the
scrollview.frame = imageView.frame
and then
scrollView.contentSize = imageView.image.size
Then you won't see any border. If you want the image to be the maximum size to start with,
do
imageView.frame = image.size;
[imageView setImage:image];
scrollView.frame = self.view.frame; //or desired size
[scrollView addSubView:imageView];
[scrollView setContentSize:image.size]; //or imageView.frame.size
To fix this, I ended up declaring a new CGRect , setting its origin to my scrollView's origin, setting its size with the bounds of my view, and then assigning this CGRect back to my scrollview frame
CGRect scrollFrame;
scrollFrame.origin = self.scrollView.frame.origin;
scrollFrame.size = CGSizeMake(CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds));
self.scrollView.frame = scrollFrame;

UITableViewCell custom selectedBackgroundView background is transparent

I have the following code that creates a UIView that I assign to my UITableViewCell's selectedBackgroundView property. Everything works as expected, with the exception of the subview's background, which is transparent.
I use the same code to create a custom view that I assign to backgroundView, and that works fine.
What is causing that subview to be transparent for selectedBackgroundView, and how can I avoid that?
- (UIView*) makeSelectedBackgroundView
{
// dimensions only for relative layout
CGRect containerFrame = CGRectMake(0, 0, 320, 40);
UIView* containerView = [[UIView alloc] initWithFrame:containerFrame];
containerView.autoresizesSubviews = YES;
// dimensions only for relative layout
CGRect subframe = CGRectMake(5, 5, 310, 30);
UIView* subview = [[UIView alloc] initWithFrame:subframe];
subview.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
subview.backgroundColor = [UIColor redColor];
subview.layer.cornerRadius = 5;
subview.layer.borderWidth = 2;
subview.layer.borderColor = [UIColor greenColor].CGColor;
[containerView addSubview:subview];
return containerView;
}
As we can see from name of ivar selectedBackgroundView, this background shown by cell when it was selected.
I've to reload few methods (– setSelected:animated: and – setHighlighted:animated:) of UITableViewCell subclass to reset background color of subviews back to their values. Look's like UIKit do some magic in this template methods (iterating over all UIView subclasses and set their background to clearColor)
This code might be helpful for you:
UIImageView *cellImageView = [[UIImageView alloc]
initWithFrame:CGRectMake(0,
0,
cell.frame.size.width,
cell.frame.size.height
)];
cellImageView.contentMode = UIViewContentModeScaleAspectFit;
// normal background view
[cellImageView setImage:[UIImage imageNamed:#"*<ImageName>*"]];
[cell addSubview:cellImageView];
[cell sendSubviewToBack:cellImageView];
[cellImageView release], cellImageView = nil;
Here cell is an object of custom UITableViewCell.
Also you can set backgroundColor property.
I would try to set the alpha for both containerView and subView to 1.0
[containerView setAlpha:1.0];
...
[subview setAlpha:1.0];
this should make your controls totally opaque.
You could also create some images for the background and use that images in state of creating 2 views. Let's say you create 2 image (normalBackground.png and selectedBackground.png) and then set this images as cell background. Here is a nice tutorial.
Try setOpaque:YES on your views.
In the end, I ended up subclassing UITableViewCell which contained a custom view object, and that worked.