22

You've likely seen this before, its become exceedingly popular in consumery chic apps like ScoutMob. I'm trying to implement a 60% transparent view on launch that will cover my home screen, explaining how to use the functions of the home screen and disappears on tap.

I have my entire app completed (it's using .xib's since its from a years ago, but feel free to explain in storyboard format as well, since I will likely reuse this feature in other iOs 5.0+ applications.)

I have no problem making single views, but temporarily layering one on top of another is something I haven't figured out intuitively. I'll continue researching and include any helpful tips I find in case other people are trying to do the same thing.

user
  • 3,388
  • 7
  • 33
  • 67
  • 1
    [A related question](http://stackoverflow.com/questions/849458/transparent-modal-view-on-navigation-controller/859215#859215), a bit outdated though – user Apr 29 '13 at 16:12

5 Answers5

51
// get your window screen size
CGRect screenRect = [[UIScreen mainScreen] bounds];
//create a new view with the same size
UIView* coverView = [[UIView alloc] initWithFrame:screenRect];
// change the background color to black and the opacity to 0.6
coverView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.6];
// add this new view to your main view
[self.view addSubview:coverView];

when you are done with it , you can remove it :

[coverView removeFromSuperview];

Swift3 version:

// get your window screen size
let screenRect = UIScreen.main.bounds
//create a new view with the same size
let coverView = UIView(frame: screenRect)
// change the background color to black and the opacity to 0.6
coverView.backgroundColor = UIColor.black.withAlphaComponent(0.6)        
// add this new view to your main view
self.view.addSubview(coverView)

to remove it:

coverView.removeFromSuperview()
DevB2F
  • 4,674
  • 4
  • 36
  • 60
Rifinio
  • 943
  • 12
  • 15
4

This can be easily accomplished with a UITextView and a UIButton. Simply place the UITextView on the screen with the content you want to display, making it the full frame size of the screen, and change the background color to a black background with background alpha of .6

[UIColor colorWithRed: 0 withGreen: 0 withBlue: 0 withAlpha: .6];

Then place the button as a subview on top, making it the full frame of the screen, and setting it's alpha to 0. Set the action of the button to hide the textview and button.

Example:

UITextView* textview = [[UITextView alloc] initWithFrame:self.view.frame];
[textview setText: @"Text here"];
[textview setBackgroundColor: [UIColor colorWithRed: 0 withGreen: 0 withBlue: 0 withAlpha: .6]];
[textview setTextColor: [UIColor whiteColor]];
[self.view addSubview: textview];

UIButton* btn = [[UIButton alloc] initWithFrame:self.view.frame];
[btn setAlpha:0];
[btn addTarget:self action:@selector(method) forEvent:UIControlEventTouchUpInside];
[self.view addSubview: btn];

You may want to check the addTarget: method; I'm not sure those are the correct parameters off the top of my head.

Liftoff
  • 24,717
  • 13
  • 66
  • 119
1

Just make a mechanism that figures out if it is the first launch of the app, then tells your main view controller to add a (probably image) view on top of the current view with 0.6 alpha

if (figureOutIfIsFirstLaunch)
{
    UIImageView *myOverlay = [...];
    myOverlay.frame = self.view.bounds;
    myOverlay.alpha = 0.6;
    [self.view addSubview:myOverlay];
} 
Undo
  • 25,519
  • 37
  • 106
  • 129
  • Would there be any repercussion to putting this in my applicationDelegate's `application: didFinishLaunchingWithOptions:` instead of the containing view's controller? – user Apr 29 '13 at 17:30
1
  1. create UIView, name it what you want (dimBackgroundUIView) then set the backgroundcolor as Black and set alpha to 0.1 or 0.2 or....
  2. add these 2 lines of code when you need to dim the background: [self.view addSubview:dimBackgroundUIView]; [self addConstraintsForDimView];
  3. and add these 2 lines of code when you want to remove the dimming background: if(dimBackgroundUIView) [dimBackgroundUIView removeFromSuperview];
  4. do not forgot to add the constraints(layouts) for dimBackgroundUIView.

check this: iOS Dim background when a view is shown

and do not forget to read the note below the code to understand what you have to do.

Community
  • 1
  • 1
Mohamad Chami
  • 1,226
  • 14
  • 10
1

Swift 4 update

 view.isOpaque = false  

 view.backgroundColor = UIColor.black.withAlphaComponent(0.2)

This option available in storyboard . Make sure to uncheck the Opaque option enter image description here

Suraj K Thomas
  • 5,773
  • 4
  • 52
  • 64