How to specify which child view does not inherit shadows when setting shadows for the parent view? - ios

I want bView to be free of shadows. How can I achieve this?
I want to shadow all subviews of the superView, so I cannot remove the shadow settings of the superView.
let superView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: self.view.frame.size.height))
superView.layer.shadowColor = UIColor.lightGray.cgColor
superView.layer.shadowOffset = CGSize(width: 0, height: 3)
superView.layer.shadowOpacity = 0.2
superView.layer.shadowRadius = 5
self.view.addSubview(superView)
let aView: UIView = UIView(frame: CGRect(x: 10, y: 100, width: 100, height: 100))
aView.backgroundColor = .white
superView.addSubview(aView)
let bView: UIView = UIView(frame: CGRect(x: 10, y: 230, width: 100, height: 100))
bView.backgroundColor = .white
superView.addSubview(bView)
I have tried bView.clipsToBounds = true but it's not working.

If you give superView a non-clear background color then none of its subviews will get a shadow. You can then apply a shadow to the subviews that you want to have a shadow.
let superView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 350))
superView.backgroundColor = .white // <-- Add this line
superView.layer.shadowColor = UIColor.black.cgColor
superView.layer.shadowOffset = CGSize(width: 0, height: 3)
superView.layer.shadowOpacity = 0.2
superView.layer.shadowRadius = 5
view.addSubview(superView)
let aView: UIView = UIView(frame: CGRect(x: 10, y: 100, width: 100, height: 100))
aView.backgroundColor = .white
// Add shadow to aView
aView.layer.shadowColor = UIColor.black.cgColor
aView.layer.shadowOffset = CGSize(width: 0, height: 3)
aView.layer.shadowOpacity = 0.2
aView.layer.shadowRadius = 5
superView.addSubview(aView)
let bView: UIView = UIView(frame: CGRect(x: 10, y: 230, width: 100, height: 100))
bView.backgroundColor = .white
superView.addSubview(bView)
If you have several views that need a shadow then I would define a method to make it easier:
extension UIView {
func addShadow() {
layer.shadowColor = UIColor.black.cgColor
layer.shadowOffset = CGSize(width: 0, height: 3)
layer.shadowOpacity = 0.2
layer.shadowRadius = 5
}
}
Then your code becomes something like this:
let superView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 350))
superView.backgroundColor = .white
superView.addShadow()
view.addSubview(superView)
let aView: UIView = UIView(frame: CGRect(x: 10, y: 100, width: 100, height: 100))
aView.backgroundColor = .white
aView.addShadow()
superView.addSubview(aView)
let bView: UIView = UIView(frame: CGRect(x: 10, y: 230, width: 100, height: 100))
bView.backgroundColor = .white
superView.addSubview(bView)

Related

adding space between icon and text in textfield

I have a text field where i have added a text and icon. Like screenshot below:
However i want to have space between the icon and the text..
I tried this code:
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
let image = UIImage(named: "username")
imageView.image = image
let viewLeft: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 30, height: 20))
viewLeft.addSubview(imageView)
but got this:
how to add the space after the icon not before?
You can try below code :-
public func setLeftView(of image: UIImage!) {
//setting left image
self.paddingLeft = 50
let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
let paddingImage = UIImageView()
paddingImage.image = image
paddingImage.contentMode = .scaleAspectFit
paddingImage.frame = CGRect(x: 15, y: 0, width: 23, height: 40)
paddingView.addSubview(paddingImage)
self.leftView = paddingView
self.leftViewMode = UITextFieldViewMode.always
}

Swift Add UIView with subviews to titleView

I'd like to customize my navigation bar and insert a UIView with two subviews into the title view of the navigation bar.
Unfortunately the subviews aren't displayed.
Do you have any idea why?
let titleContainer = UIView()
titleContainer.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: UIScreen.main.bounds.size.height)
let searchIcon = UIButton()
searchIcon.setImage(UIImage(named: "search_icon"), for: UIControlState.normal)
searchIcon.layer.frame = CGRect(x: 0, y: (UIScreen.main.bounds.size.height - 28) / 2, width: 28, height: 28)
titleContainer.addSubview(searchIcon)
let titleLabel = UILabel()
titleLabel.frame = CGRect(x: 28, y: UIScreen.main.bounds.size.height, width: UIScreen.main.bounds.size.width-28, height: UIScreen.main.bounds.size.height)
titleLabel.textColor = UIColor(red:255, green:255, blue:255, alpha:1.0)
titleContainer.addSubview(self.titleLabel)
self.navigationItem.titleView = titleContainer
problem and expected solution:
Why did you use height of all the element as UIScreen.main.bounds.size.height? Please try the below code.
P.S. I have changed the color of searchIcon as i didn't have the image and changed the color of text of label and added some text so that it is visible.
let titleContainer = UIView()
titleContainer.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: 45)
let searchIcon = UIButton()
//searchIcon.setImage(UIImage(named: "search_icon"), for: UIControlState.normal)
searchIcon.backgroundColor = UIColor.red
searchIcon.layer.frame = CGRect(x: 0, y: 8, width: 28, height: 28)
titleContainer.addSubview(searchIcon)
let titleLabel = UILabel()
titleLabel.frame = CGRect(x: 28, y: 8, width: UIScreen.main.bounds.size.width-28, height: 30)
titleLabel.textColor = UIColor.blue//(red:255, green:255, blue:255, alpha:1.0)
titleContainer.addSubview(titleLabel)
titleLabel.text = "Sample Text"
self.navigationItem.titleView = titleContainer
Here is the screenshot of the above code:
Please change the x,y accordingly as per your requirement.
Have you considered making your let bar = UINavigationBar() programmatically and then add it with: self.view.addSubview(bar)?
So you can push all the "UIBarItems" you want..?

how to make cameraOverlayView along the y axis (swift3)

I am making a photo app that I want the imagePicker screen to have blocks of red to pre mask the photo before it crops. My following code gets a roadblock on the top x axis. I would like to place another red box along the entire y axis where the yellow rectangle is.
let blockView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: self.view.frame.size.width, height: 150))
blockView.backgroundColor = UIColor.red
imagePicker.cameraOverlayView = blockView
Please try the following :
let mainView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: self.view.frame.size.width, height: self.view.frame.size.height-150))
let blockView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: self.view.frame.size.width, height: 150))
blockView.backgroundColor = UIColor.red
let blockView1 = UIView.init(frame: CGRect.init(x: 0, y: 170, width: 100, height: self.view.frame.size.height-320))
blockView1.backgroundColor = UIColor.green
mainView.addSubview(blockView)
mainView.addSubview(blockView1)
imagePicker.cameraOverlayView = mainView

make everything clear except the fake border in swift

I'm implementing a "fake" border using a view with a background color so that the border doesn't cover another view. (as per this answer and the following code)
UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 200, 200)];
backgroundView.backgroundColor = [UIColor blackColor]; /* I want this to be clear except for the part outside bView */
backgroundView.clipsToBounds = NO;
UIView *bView = [[UIView alloc] initWithFrame:CGRectInset(backgroundView.bounds, 3, 3)];
bView.backgroundColor = [UIColor redColor]; /* I want this to be clear */
UIView *cView = [[UIView alloc] initWithFrame:CGRectMake(-50, -50, 100, 100)];
cView.backgroundColor = [UIColor yellowColor];
[bView addSubview:cView];
[backgroundView addSubview:bView];
[self.window addSubview:backgroundView];
How can I have backgroundView be clear(transparent) except for the border and bview be completely transparent? If I set both color to clear, I will lose my border. I am using swift unlike the code example.
Thanks
This is what I actually want. The big box needs to be transparent except for the fake black border around it so that the text (and everything behind it) can show up.
You say you want this:
So now I will easily construct it, but I will make the third view white so we can see it (with an annotation that it should be clear):
self.view.backgroundColor = .gray
let borderView = UIView(frame:CGRect(x: 150, y: 150, width: 200, height: 200))
borderView.backgroundColor = .clear
borderView.layer.borderWidth = 3
self.view.addSubview(borderView)
let yellowView = UIView(frame:CGRect(x: 100, y: 100, width: 100, height: 100))
yellowView.backgroundColor = .yellow
self.view.addSubview(yellowView)
let clearView = UIView(frame:borderView.frame.insetBy(dx: 3, dy: 3))
clearView.backgroundColor = .white // should be .clear
self.view.addSubview(clearView)
Result:
Substitute .clear for .white to get the desired outcome.
Well, I can't give you definitive performance data, but I would expect this to give you better performance than multiple views to create a "fake" border...
class myView: UIView {
override func draw(_ rect: CGRect) {
UIColor.black.set()
let context = UIGraphicsGetCurrentContext()
context?.stroke(rect.insetBy(dx: 1.5, dy: 1.5), width: 3.0)
}
}
let backgroundView = myView(frame: CGRect(x: 100, y: 100, width: 200, height: 200))
backgroundView.backgroundColor = UIColor.clear
let cView = UIView(frame: CGRect(x: -50, y: -50, width: 100, height: 100))
cView.backgroundColor = UIColor.yellow
backgroundView.addSubview(cView)
self.view.addSubview(backgroundView)
Of course, if you really want to do this with subviews to create the frame, this will also do the job. It adds 4 subviews to the background view, one for each side of the rectangle:
let backgroundView = UIView(frame: CGRect(x: 100, y: 100, width: 200, height: 200))
backgroundView.backgroundColor = UIColor.clear
backgroundView.clipsToBounds = false
let bgvFrame = backgroundView.bounds
let leftEdge = UIView(frame: CGRect(x: 0, y: 0, width: 3, height: bgvFrame.size.height))
leftEdge.backgroundColor = UIColor.black
let topEdge = UIView(frame: CGRect(x: 0, y: 0, width: bgvFrame.size.width, height: 3))
topEdge.backgroundColor = UIColor.black
let rightEdge = UIView(frame: CGRect(x: bgvFrame.size.width - 3, y: 0, width: 3, height: bgvFrame.size.height))
rightEdge.backgroundColor = UIColor.black
let bottomEdge = UIView(frame: CGRect(x: 0, y: bgvFrame.size.height - 3, width: bgvFrame.size.width, height: 3))
bottomEdge.backgroundColor = UIColor.black
backgroundView.addSubview(leftEdge)
backgroundView.addSubview(topEdge)
backgroundView.addSubview(rightEdge)
backgroundView.addSubview(bottomEdge)
let cView = UIView(frame: CGRect(x: -50, y: -50, width: 100, height: 100))
cView.backgroundColor = UIColor.yellow
backgroundView.addSubview(cView)
self.view.addSubview(backgroundView)

AutoLayout for programmatically created uiview element

When i try to create an uiview with loading text and activityindicator, even though it looks centered in iphone 6, it is not centered in iphone 5.
How can i use auto layout for this programatically created UIView ?
I am trying to center this uiview in all screen sizes
boxView = UIView(frame: CGRect(x: TableView.frame.midX - 60, y: TableView.frame.midY - 15, width: 180, height: 50))
boxView.backgroundColor = UIColor.blackColor()
boxView.alpha = 0.5
boxView.layer.cornerRadius = 10
var activityView = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.WhiteLarge)
activityView.frame = CGRect(x: 0, y: 0, width: 50, height: 50)
activityView.startAnimating()
var textLabel = UILabel(frame: CGRect(x: 60, y: 0, width: 200, height: 50))
textLabel.textColor = UIColor.whiteColor()
textLabel.text = "Loading"
boxView.addSubview(activityView)
boxView.addSubview(textLabel)
TableView.addSubview(boxView)
EDIT: I tried this and it seems working good
var bounds: CGRect = UIScreen.mainScreen().bounds
var width:CGFloat = bounds.size.width
var height:CGFloat = bounds.size.height
boxView = UIView(frame: CGRect(x: width/2 - 90, y: height/2 - 100, width: 180, height: 50))

Resources