I'd like to show an overlay view similar to what you see when you perform a 'Search in Contacts app where the SearchBar is visible under the toolbar while the gray overlay covers up all of the content below.
For my view, I'd like to have an UITextField and button shown visible while the rest of screen is gray with the rest of the existing contents as grayed-over and no SearchBar.
Things I tried:
I can have one view that encases
both UITextField and button with the
view's alpha level set to 0.5. But
this yields grayed appearance for
everything, including the
UITextField and button, which is not
what I'm trying to achieve.
I then tried two child views within
a parent UIView, with one subview
containing the controls while the
other one is blank. Set the parent
UIView to have 0.5 alpha -> this is
not right either.
Continuing with two child views
within a parent UIView, set the
parent view to have alpha of 1.0 and
then the the blank-view to have an
alpha level of 0.5, it's still not
right.
So what's a good way to achieve this?
Option 3 is the way to do it but make sure you're adding them in the right order i.e. transparent view added as first subView to parent view then the text field. This way the text field is on top.
Also, don't forget to set the backgroundColor attribute of the parent view to [UIColor clearColor].
I would've thought #3 would be the correct way to do it. Are you sure you have the parent and the overlay views's opaque property set to NO?
Related
I ran into a strange situation when a UITableView is used within the context of a UINavigationController.
tvOS uses UIView.mask to apply a "fade-out gradient" at the top and bottom of a UITableView, so that cells fade into and out of existence at the top and bottom edges of the table view.
That's fine: the fading mask always stays out of the way of the selected cell.
(Here, view.backgroundColor is set to red and tableView.backgroundColor is set to blue with 50% alpha. The constraints of the tableView are set to the safe area.)
The problem comes when you put your view controller inside of a UINavigationController. When selection is near the top, the mask view no longer seems to avoid the cell, so it looks faded. Additionally, as the user scrolls down, the fading mask takes a giant jump downward, and then as the user starts to scroll back up, that fading mask doesn't seem to get out of the way:
For reference, here is the same setup but with tableView.mask = nil:
(All fading is disabled, but you can see the cells "pop" into and out of existence at the top and bottom of the tableview. You might think you could just set tableView.masksToBounds = true, but then the selected cell gets chopped off because it grows when selected)
Surely I'm missing something obvious here? Did no one at apple put a tableview inside of a nav controller?
You were so close! The clips to bounds was missing.
tableView.clipsToBounds = true
tableView.mask = nil
Cheers :)
I have a UIViewController that I designed in Interface Builder. near the top of the View it has a UIImageView and then some other Views (Text etc) below. These are set to anchor to the top of the view.
In code when the view loads I remove the UIImageView in certain circumstances but it still seems to take space or the view's below don't spring up to the top based on their Anchor.
How can I make the Views below move up if the View above is removed?
You can change the frame of the other elements in the view.
in the viewDidLoad method you can use something like that:
-(void)viewDidLoad{
if(imageVisible){
otherElements.frame = CGRectMake(....);
}else{
otherElements.frame = CGRectMake(....);
}
}
I don't know what is the structure of the view, but you might consider nesting all of the other elements in one view so you could change all the elements positions in one command.
Unlike the Android view hierarchies, iOS view hierarchies are all developed in absolute coordinates. When you say a subview is anchored to the top, that means that if the size of the parent view changes, your view will stay in the same relative position to the top of the screen.
In order to make your views below the image view move up when the image is hidden or removed, you will have to manually arrange them yourself to account for the offset
Is it possible do something like this ?
When I click on the button I need the following animation: button to set some alpha filter and starts to fall down as indicated by the arrow, it will disappear on tab.
Can you tell me how to do this ? Thanks a lot ...
Here is image url: http://img534.imageshack.us/img534/8149/screenqx.jpg
It's definitely possible, but there are some issues you have to overcome. One is that UIBarButtonItem isn't a UIView. One way is to loop through the subviews of the UIToolbar or UINavigationBar. Another way is to figure out the position of the button. Another is to get the view using private api if you're not submitting to the AppStore.
Once you have the view, you can move it to the superview of the UIToolbar or UINavigationBar or you can create a view on top of that (and hide the real UIBarButtonItem since you're done with that). The latter is more difficult because mimicking the look of the default bordered UIBarButtonItem isn't easy.
Now you need to get the center of the UITabBarItem somehow. You can either use private api or you can loop through the subviews.
Create a CGPath using Quartz functions or using UIBezierPath. The start point will be the center of the button and the end point will be the center of the UITabBarItem.
Create a CAKeyFrameAnimation and attach said CGPath.
Create a CABasicAnimation to animate the opacity.
Add both to a CAAnimationGroup.
Attach the animation group to your button view's CALayer.
Make sure to also set the position and the alpha in order to prevent the view from jumping back to its original position after the animation.
Once you attach the animation group, the animation should start, so make sure you're doing all of this in the button's selector method.
You can't really move it from view to view, as your views could clip and then you'd get frames with only a partial image. Probably the best thing to do is to create a view on the fly which covers the whole screen, copy the button image into the view at the original point, remove the button from the original view, then animate that image to where you want it to go, then add the button to the final destination.
In my UIViewController that I use for my UIPopoverController, I have a label on top, a segmented control, and then a UITableView below it. When I created my .xib for the content view, I put in a table, and centered the label and segmented control within the .xib.
When I present the popover, I do not want it taking the whole screen. I use about (800,700) points to display the popover, but then the labels do not look right. They are not centered within the popover since the popover is now smaller than the .xib. What I did was move the label and segmented control to the left to make it centered in IB. That doesn't seem the best and future proof way of doing it. I was hoping I could do something programatically by taking the width size and dividing by 2 or something and centering based on that. Any advice? Thanks.
There are a couple of options:
Check out the documentation for the popoverContentSize property on the UIPopoverController, you should set it to be the size of the XIB that provides the content (so the XIB and popover both have the same size/contentSize, essentially).
Set the autoresizing masks on the subviews in the XIB so that they lay themselves out correctly dependant on the size of the XIB. To center them within their parent view you do NOT want the left and right mask setting (they should both be deselected in Interface Builder). This guide covers centering subviews: http://www.techotopia.com/index.php/IPhone_Rotation,_View_Resizing_and_Layout_Handling
OK, so I am learning to use UIScrollView in interface builder. since the scrollView itself does not have any content, I created another view, the contentView, to hold my controls and scrollable content. into this view I place controls, labels, etc and then in my code i set the contentSize of the scrollView to the size of this contentView.
My question seems stunningly simple and so obvious that I must have missed something somewhere. when I created this XIB in IB I got your standard empty iPhone interface window. I dropped a scrollView on top of it, it took up the whole window. I dropped a view on top of that, it took up the whole scrollview. I added some controls, which so far I can still see inside the contentView rectangle in IB.
My question is how do I work on/add controls which lie outside of the visible part of the contentView in IB? LOL. it seems so simple, but i just don't get it. I can set the height of the content view or drag the rectangle to whatever I like (and indeed this is the whole point of having a scrollview) but the fixed UI window from IB won't expand so i can see the "offscreen" part of the contentView to add more controls. It's like it's just fixed at that size because that's the size of one iPhone screen and it won't let me make it any bigger/taller.
what did I do wrong?
-a
You need to turn off all simulated user interface elements (like the status bar) to be "undefined" except for size, which you select to be "Freeform" from the drop-down, and then you can set the view height using the Ruler tab to be whatever you like.
For example, here I've selected a photo view controller, and set the size in the right side bar to be "iPad Full Screen" - but I could also change that to "freeform" to set any height I wished.
First add a ViewController by any which way you prefer. Then in interface builder, click on the view controller Icon (on left). In the connections inspector click on the ruler icon "Show the size inspector". There will be option list for simulated size, change to "Freeform" and increase the height to any size you want. Hope this helps.
neeever mind. you drag the content view up so that some controls are offscreen and then add more controls/expand to the part you just made visible by moving the top stuff off the top. in effect, you physically scroll the contentView in IB by dragging it with the mouse. seems a smidge counterintuitive, but whatever.
Set simulated size to freeform for the the view controller to a large enough size that you can add in your controls
You don't have to create a view to place inside the scrollview if you don't want. In your case, it sounds like it doesn't make much sense.
As for the second part of your question, you can place items directly on the scrollview (it is a view afterall), as subviews. If you want them to be off screen, then just set their frame up to be at those particular x, y coordinates you want it to be at. You will have to ensure your scrollview's contentSize property is large enough though to house your entire content, this is what allows scrolling horizontally/vertically.
You probably want to do the offscreen elements programmaticly instead of using xibs.