I'm trying to make an NSTextField with only two rounded corners on the top-left and bottom-left. I tried to do the following, but in this case I get all corners rounded:
[self.myTextField:YES];
self.myTextField.layer.cornerRadius = 5;
What should I do to have only two (or for example one) rounded corners?
I'm a little out of my lane in OS X, but what you want to do is embed whatever corner art you like into an image and present those on an image view behind the NSTextField.
Resize the image view exactly as you do the text field, but first set the image's capInsets property. Size the insets to exclude the corners from scaling as the extent of the image changes. (Make sure your corner art is placed at the extreme edges of the image).
Related
I have an NSWindow (actually an NSPanel, with the "Utility Panel" style set in IB). In IB it displays as having square lower corners, which is what I want. When I run my app, however, the window gets rounded lower corners. That is a problem, because the content I display in this window goes all the way out to the edges of the contentView, but the rounded corners clip my content.
I found the opposite question (how to get rounded corners when Cocoa for some reason decides to give you square corners: When exactly does an NSWindow get rounded corners?), but that doesn't shed light on how to solve my problem here. Specifically, it says that the wantsLayer flag on the window's contentView governs the squareness/roundness of the window's corners; it says that setting wantsLayer to YES will give you rounded corners. That may be true, but I already have rounded corners, and I don't want them. The wantsLayer flag on my window is NO, which is the default; I have checked that. I was hoping that having an opaque subview in the contentView that went right out to the edges of the window would square the corners off, but it does not; my subview is an NSOpenGLView, which returns YES for isOpaque, and the corners are still rounded and clip the contents of the subview.
More broadly, if anybody actually understands how Cocoa decides when to give round corners and when to give square corners, that information would be useful. Interestingly, I just noticed in Xcode on my machine, the lower right corner of the project window dynamically squares and rounds, depending upon whether the Utilities subpane is visible or not. Whatever the Utilities subpane does to square off the Xcode window's corner, that's what I want to do. :->
Here is my problem.
I have a square image which does not fit on an iPad or iPhone app, as the screens are not square, so i decided to add a UIImageView which:
When the Phone is on Portrait position i add a constraint to the top (-20) and bottom (0) to fill the whole screen aligning X in the center and keeping the aspect ratio to keep the image square even if the screen is bigger or smaller, this means that in both sides i will "loose" part of my image, but that is fine.
When I rotate my phone to landscape position, the screen is widder,so i see a square image in the middle of the screen but a white rectangle in both sides.
I think the sollution to this is when it is on landscape position i need to remove the top and bottom constraints and add one to lead (-20) and one to trail (-20), center the image on Y axis and keep the 1:1 ratio...
But my question is: how to add a constraint to valid for one orientarion and change it to the other?
What is the best approach?
thanks
FP
You don't need to do it programmatically. I recommend you make the view fill the superview -- have one constraint each to top, bottom, left, and right. Then for the UIImageView attributes inspector in Interface Builder, set "View Mode" to Aspect Fill.
I think you have it the wrong way around.
While on portrait you should set trail and lead constraints as your height is bigger than the width, so if you set (0) for trail and lead and 1:1 ratio you are safe that it will fit beautifully. Also center it vertically in container.
On landscape, as the width is bigger than the height, you should set top and bottom (0) and ratio 1:1 and center it horizontally in container.
I have an image view that looks like a wheel. This view detects touch events on each of the colored sections.
The problem I have is that when I rotate this wheel, the UILabels on top of the view need to also be rotated so that the text is still horizontal and human readable.
What is the best way to rotate the labels while the parent view is being rotated?
This is what I am trying now and it does not rotate correctly...
CGAffineTransform textTransform = CGAffineTransformRotate(newTransform, newAngle * -1);
Presumably you are applying a rotation transform to rotate the wheel. If the labels are subviews of the wheel view, their centers are pinned in the right places to the wheel (because a view is located in its superview by its center), and they will travel around with it. At the same time, apply the inverse rotation transform to the labels. The rotation takes place around the center of each label. So each label stays in the right place and stays upright.
An afterthought - also make sure you're not using autolayout on these labels. Autolayout breaks view transforms.
I have a simple test app on which my rootViewController's UIView contains a bunch of UIView subviews. Each one of those UIView subview is backed by a CAShapeLayer.
I want the composition created by those subviews ( the four shapes that are within the dotted area .. ) to always stay vertically and horizontally centered with respect to my
UIWindow. (the minimium size of the left/right, top/bottom margins will be subject to be changed at runtime at each orientation change )
So for example when i rotate to portrait i will have to
resize and reposition those single shapes so that the whole figure will be mantained centered and each CAShapeLayer sublayer stays sharp ( i want their path to be resized not just a raster resize )
what would be the best technique to resize/move the shapes to always have a centered composition while maintaining path crisp appearance for the shapes?
Ultimately for me it will be good to have an answer to this: how can i shrink the subviews as a whole? i mean their sizes and relative positions?
Thanks
You can use CGPathCreateMutableCopyByTransformingPath() or -[UIBezierPath applyTransform:] to recalculate all points in the path.
I'm wondering what the dropdown "Mode" is about? It contains "Scale to fill", "Aspect fit" and so on. I never had to change it so far, still I'm curious what it can be used for. Can somebody explain?
The content mode property of a view tells how its content should be laid out. In the Interface Builder, the various modes can be selected in the Attributes Inspector.
Let's use two image views to see how the various modes work.
Scale to Fill
The image heights and widths are stretched to match the size of the UIImageView.
Aspect Fit
The longest side (either height or width) of the image is stretched to match the view. This makes the image as big as possible while still showing the entire image and not distorting the height or width. (I set the UIImageView background to blue so that its size is clear.)
Aspect Fill
The shortest side (either height or width) of the image is stretched to match the view. Like "Aspect Fit", the proportions of the image are not distorted from their original aspect ratio.
Redraw
Redraw is only for custom views that need to do their own scaling and resizing. We aren't using a custom view, so we shouldn't use Redraw. Notice that here UIImageView just gives us the same result as Scale to Fill, but it is doing more work behind the scenes.
About Redraw, the documentation says:
Content modes are good for recycling the contents of your view, but you can also set the content mode to the UIViewContentModeRedraw value when you specifically want your custom views to redraw themselves during scaling and resizing operations. Setting your view’s content mode to this value forces the system to call your view’s drawRect: method in response to geometry changes. In general, you should avoid using this value whenever possible, and you should certainly not use it with the standard system views.
Center
The image is centered in the view, but the length and width of the image are not stretched.
Top
The top edge of the image is centered horizontally at the top of the view, and the length and width of the image are not stretched.
Bottom
The bottom edge of the image is centered horizontally at the bottom of the view, and the length and width of the image are not stretched.
Left
The left edge of the image is centered vertically at the left of the view, and the length and width of the image are not stretched.
Right
The right edge of the image is centered vertically at the right of the view, and the length and width of the image are not stretched.
Top Left
The top left corner of the image is placed at the top left corner of the view. The length and width of the image are not stretched.
Top Right
The top right corner of the image is placed at the top right corner of the view. The length and width of the image are not stretched.
Bottom Left
The bottom left corner of the image is placed at the bottom left corner of the view. The length and width of the image are not stretched.
Bottom Right
The bottom right corner of the image is placed at the bottom right corner of the view. The length and width of the image are not stretched.
Notes
If the content (in our case the image) is the same size as the view (in our case the UIImageView), then changing the content mode will make no noticeable difference.
See this and this question for a discussion about content modes for views other than UIImageView.
In Swift, to set to set the content mode programmatically you do the following:
imageView.contentMode = UIViewContentMode.ScaleToFill
imageView.contentMode = UIViewContentMode.ScaleAspectFit
imageView.contentMode = UIViewContentMode.ScaleAspectFill
imageView.contentMode = UIViewContentMode.Redraw
imageView.contentMode = UIViewContentMode.Center
imageView.contentMode = UIViewContentMode.Top
imageView.contentMode = UIViewContentMode.Bottom
imageView.contentMode = UIViewContentMode.Left
imageView.contentMode = UIViewContentMode.Right
imageView.contentMode = UIViewContentMode.TopLeft
imageView.contentMode = UIViewContentMode.TopRight
imageView.contentMode = UIViewContentMode.BottomLeft
imageView.contentMode = UIViewContentMode.BottomRight
View Programming Guide goes into details of what you're asking about. If you scroll down to the section called "Content Modes" you'd find what you're looking for.
Basically according to Apple:
"Each view has a content mode that controls how the view recycles its content in response to changes in the view’s geometry [...] the value in the contentMode property determines whether the bitmap should be scaled to fit the new bounds or simply pinned to one corner or edge of the view."
http://vocaro.com/trevor/blog/2009/10/12/resize-a-uiimage-the-right-way/
should give you the basic ideas very well.