I'm looking for an idea in order to reproduce the look of the iOS app folders (menu on iPhone/iPad).
I'm wondering how is it possible to separate the background image in order to make appear the content of the folder.
Does someone already do this ? Or have an idea on how we can do ?
EDIT : I'm trying to reproduce this effect.
http://img4.hostingpics.net/pics/873912photo.png
I actually looked at this a while back.
This is how i approached the problem:
You have a background view (the image) and a layer on top (the icons).
Calculate the split line.
Split the view and layer into tow along the split line
Add the content of the folder under the image.
Add you folder icon on top of everything.
Animate the bottom part down while changing opacity of the layer icon.( so you can see the content underneath)
While animating you should probably mask the triangle under the icon to it gives that bubble effect.
To close, just reverse the animation.
I didn't manage to make it work 100% but i can tell you it works (at least some parts of it).
And before you ask, no, i cannot give you the code because i didn't keep it.
Try make screenshot like this:
UIGraphicsBeginImageContext(CGSizeMake(screenWidth, screenHeight));
[self.view.layer renderInContext: UIGraphicsGetCurrentContext()];
UIImageView* imageView = [[UIImageView alloc] initWithImage: UIGraphicsGetImageFromCurrentImageContext()];
UIGraphicsEndImageContext();
[self.view addSubview: imageView];
You can make two screenshots and add with different frames as subviews.
I hope it helps you.
Related
I'm struggling with a problem:
I did create an UIView with subviews inside to make my own UIToolBar.
I added a UIView which acts like a delimiter line on top of it.
Then I decided to make one of the subviews rounded on center. But I need to find a way to "curve" the delimiter UIView.
Actually I have:
I want:
Is there anyway to fullfill my goal programmaticaly in swift ?
I thought about importing an UIImageView and make the images according to the differents iPhone size but is there any other solution ?
I solved a similar problem by sandwiching a dark gray circle image behind the toolbar, and a light gray circle image in front of the toolbar but behind the button. It's a hack but it works perfectly if you match the colors, and it's easier than doing path drawing.
So this is the problem I am talking about.
As you can see, there is a small space in front of Tab1 selection image on the top. I cannot figure out how to delete that space. Currently, items don't have selected image and image assigned, because I don't need one. All I need is text in tabs. So for selection image, I am using TabBar selection property. I added some code, to stretch the selection image, otherwise it is appearing over neighbour tabs.
[UITabBar appearance].selectionIndicatorImage = [[UIImage imageNamed:#"selected.png"]
stretchableImageWithLeftCapWidth:0 topCapHeight:0];
Is there any way to remove that space?
Thank you in advance!
Set imageInset point set in your tabbar item and check i think working good
self.tabBarItem.imageInsets = UIEdgeInsetsMake(0//topOffset, 0//left, -0//bottomOffset, 0//right);
But keep in mind that whatever the value of edgeinset you give, give the opposite value to its opposite side,meaning if you give top 6, then give bottom -6 Or else the image will keep on growing or shrinking after each click.
Hope this will help you great and You're feeling better for your code is working good.
I've got the problem. I need to create the UIImageView programmatically and add the image to it. But there are some issues with it. Look at the attached screenshots.
The first is the normal image, if I create the UIImageView in xib (storyboard) and fill it with my image.
The next one is the image with some not smooth lines (like a discrete or blocks or etc).
The code I've made
UIImageView *logoImg = [[UIImageView alloc]initWithFrame:CGRectMake(76.0f, 36.0f, 168.0f, 180.0f)];
logoImg.image = [[UIImage imageNamed:#"logo.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[self.view addSubview:logoImg];
I have got two versions of this logo image (logo.png and logo#2x.png for non-retina/retina).
logo.png is 168x180 px.
logo#2x.png is 336x360 px.
Where I was wrong? Thanks in advance :)
I'd recommend deleting both images from the project, cleaning the build folder, restarting xCode and re-adding the images.
Not sure but try with
myImageView.contentMode = UIViewContentModeScaleAspectFit;
This will display original image, may be work for you :)
Recently I have observed some strange behaviour with the UIImageView and am wondering if anyone can provide some insite. I have two UIImageViews with the images inside them being loaded from a database. Inside the Xcode inspector I set the clip subview property and change the image mode to aspect fill. This works fine, when the images are loaded they appear correctly in their views and are clipped as they should be. However, I wanted to add a place holder image incase the user hadn't uploaded one yet. When I did this it the image was not resized and and stretched passed its view. I tried to reset the properties programatically as can be seen below, but nothing changed.
//code used to try to reset the image mode and clipping of the sub-views
//set up user profile picture
_profilePic.contentMode = UIViewContentModeScaleAspectFit;
_profilePic.layer.masksToBounds = YES;
_profilePic.layer.borderColor = [UIColor whiteColor].CGColor;
_profilePic.layer.borderWidth = 3.0f;
//set up users cover photo
_coverPhoto.contentMode = UIViewContentModeScaleAspectFit;
_coverPhoto.clipsToBounds = YES;
_coverPhoto.layer.masksToBounds = YES;
Why is this happening when I add an image to the view through the Xcode inspector but not when the image is left empty?
You should use UIViewContentModeScaleAspectFill instead of UIViewContentModeScaleAspectFit.
When I add them with the following line of code at the beginning of ViewDidLoad I get the same effect and have none of the unwanted image overflow.
_coverPhoto.image = [UIImage imageNamed:#"stockCoverPhoto.png"];
_profilePic.image = [UIImage imageNamed:#"stockProfilePhoto.png"];
Not the most informative solution, as it provides no insight into this issue but it is a solution. Anyone have any other input on how to fix this issue, why it even happens I would love to hear it as im still scratching my head.
Same on here.. No way to change contentMode after setImage to UIImageView..
I'm new to objective-c and iOS development.
I need an iPad application to display some images and designs (draw) over its, but the design needs be done in a separate image. My idea is use two overlapping UIImageViews, the first one is the images that I want to see, and the second one is an image with transparent background where I will draw some things with finger. All of this is OK and i have implemented, but I need that the zoom be enabled to tow images in the same time. When I'm zooming, the tow images need be resized at the same time.
The scroll needs to work to the images at the same time too.
How can I do this?
Somebody help me!
The two UIImageViews you are overlapping should be subviews of the same UIView.
Then, apply scrolling and zooming to the base UIView, and it will affect also the subviews.
If you haven't added the two UIImageViews to a UIView, then you can do that like this:
[view addSubview:imageView1];
[view addSubview:imageView2];