Positioning an element within its superview - objective-c

So, this is my case :
One NSBox
Inside this, there is an NSTextField
What I want to do is :
Programmatically manage to position the textField in the box (e.g. top left, top right, center, etc).
I've tried doing it with NSTextField's bounds or frame, but I don't think I can make it...
Any ideas?

If I understood your question correctly, do you just want to make sure the NSTextField is always in the top left, center, or whatever, when the view is resized? If so, then you can use struts and springs for that. If you just want to move the text field, then changing the frame should work. Ex, if you have a text field called foo, you can set the whole frame:
[foo setFrame: CGRectMake(desiredX,desiredY,foo.bounds.size.width,foo.bounds.size.height)];
or just its origin (effectively repositioning it):
[foo setFrameOrigin: CGPointMake(desiredX, desiredY)];

For interest's sake, there is also a minilanguage for positioning in Cocoa called Visual Format Language. It lets you specify relationships such as:
|-50-[orchidBox]-50-|
Which means the child element should be indented 50px from it's superview on each side.

Related

Resize Window and contained NSView based on subviews size

For a MacOS app, I have a Window, containing an NSView; into that view, I want to add a subview with a constant size and height.
When loading the subview programmatically by [myView addSubview:mySubview], I want the NSView *myView that is hosting the subview to change in size so it accomodates the subview, and the window to change in size accordingly; so that the edges of the NSView inside that Window keep the same distance to their surroundings in the Window as before. How do I achieve that most efficiently and which properties do I have to specify in IB to make that work? Do I have to adjust the size of myView and of the Window programmatically by hand or can I achieve this in a more beautiful way?
There are multiple ways to achieve this.
A simple one is to set autoresizingMask the value(s) you want.
The mask you can see in Interface Builder are represented by predefined numbers (NSAutoresizingMaskOptions) that you will combine with bit operation
view.autoresizingMask = NSViewMaxXMargin | NSViewMaxYMargin;
which is simmilar to Autoresizing like in this screenshot of IB
The checkmark on Layout Translates Mask Into Constraints has to be made, either in IB or programmatically so they are used as constraints.
view.translatesAutoresizingMaskIntoConstraints = YES;
The relative positioning to its enclosing superview is defined when the view is instanced with -initWithFrame: with the given frame or with the values set in IB when it creates an instance and inits the UI element via -initWithCoder: .
Be aware this does not stop the autolayout mechanism of IB to warn you that your desired coordinates, sizes and constraints are maybe clashing with constraints.
As suggested by #Willeke, I needed to understand and apply Autolayout. To make it work in IB, I set the autoresizingMask of my subview to stick to all for sides and automatically adjust width and height. Even though it can be done completely in IB, I think programmatically this would be
subview.autoresizingMask = NSViewWidthSizable | NSViewHeightSizeable;
As pointed out by #Ol Sen in his answer, Translates Mask Into Constraints also has to be activated.
To arrange the elements inside that subview that is added programmatically as described in the opening post, I rely on nested stackviews and resize them instead of resizing the parent.
The only problem left is to correctly adjust the frame of the subview to match the parent view before adding it. If this step is left out, the contraints the autoresizing mask of the subview is translated into when adding it will result in the correct resizing behaviour, but wrong margins. The essential code looks like this:
MySubViewController *subViewController = [[MySubViewController alloc] init];
subViewController.view.frame = superView.bounds; // Correct the margins
[superView addSubview:subViewController.view];

NSPopover padding content on one side

I have two NSPopovers, both of which are set up exactly the same (just linking a custom NSView from IB). Both pop up just fine, but one appears to offset the content by about 20px.
This NSPopover is (properly) not padding the content...
but this one adds about 20px from the ride side.
Here are the two views laid out in IB
As you can see, the search bar should be pinned to the right side like it is the left, but for some reason it is not. At first I thought it was a contraints issue, but after messing around with them for a while I can confirm it is not.
Any clue whats up?
EDIT: Decided to subclass the view and fill its rect, got some very strange results! The view appears to be offset. I have no clue why this is...
From here, this caught my eye (emphasis mine):
The principle circumstance in which you should not call
setTranslatesAutoresizingMaskIntoConstraints: is when you are not the
person who specifies a view’s relation to its container. For example,
an NSTableRowView instance is placed by NSTableView. It might do this
by allowing the autoresizing mask to be translated into constraints,
or it might not. This is a private implementation detail. Other views
on which you should not call
setTranslatesAutoresizingMaskIntoConstraints: include an
NSTableCellView, a subview of NSSplitView, an NSTabViewItem’s view, or
the content view of an NSPopover, NSWindow, or NSBox. For those
familiar with classic Cocoa layout: If you would not call
setAutoresizingMask: on a view in classic style, you should not call
setTranslatesAutoresizingMaskIntoConstraints: under autolayout.
Does it apply to you?
if you have an outlet to your content view, you should be able to force it into place with:
[contentView setFrame:[[contentView superview]bounds]];
or more modernly I guess...
contentView.frame = contentView.superview.bounds;
Proplem solved, but I still don't exactly know why it required solving. The NSPopovers content view (or at least mine) requires an origin point of X: 13, Y: 13. For some reason, only one of my views was getting this value.
To solve this, I subclassed NSView and overrode the setFrame method forcing its x and y to always be 13, 13
-(void)setFrame:(NSRect)frameRect {
[super setFrame:NSMakeRect(13, 13, frameRect.size.width, frameRect.size.height)];
}

How to create a custom NSSlider with a transparent middle bar and custom knob size

I've searched around for some code on NSSliderCell but I can't find a way to do what I'm looking for.
I'd like to create something like this (where the white line is the slider knob, 1 pixel width):
I'm going to use this for the time bar of a music track, so it's going to move every second (that's why I want to use a NSSlider to make things easy).
What do I need to do to make a slider, with a transparent middle bar, similar to the image above?
PS: It's not going to be touchable, it's just for display.
You can just override drawRect:, as when subclassing NSView, except in your implementation, use [self doubleValue] to determine where to draw the line. However, I don't see the point of subclassing NSSlider in this case. A custom NSView could have a property that determines where to draw the line, and then other code could set that property or bind to it.
That looks like a vertical split view to me with a 1 pixel wide divider. You might try that. There's a method to set the position of the divider so it would be easy to move as you need. And you can make the divider 1 pixel by creating a subclass of NSSplitview and overriding the dividerThickness method to return 1. Then you just set the background of the 2 subviews to black and there you go. It's easy to try so maybe it will work for you. Good luck.
I finally got it:
I created a NSSliderCell subclass with a property #property float x;
I overrode the drawKnob method and inside it I wrote:
-(void)drawKnob:(NSRect)knobRect{ self.x = knobRect.origin.x; }
I dragged a NSSlider into my window (made it small, changed it's width to the window's width) and changed it's cell class to the one I created;
And then when the music is playing, every time a second goes by I do:
[_timeBarSlider setMinValue:0];
[_timeBarSlider setMaxValue:myTrack.duration];
[_timeBarSlider setDoubleValue:myPlayer.currentPosition];
[[_timeBarImageView animator] setFrame:NSMakeRect(_timeBarSliderCell.x, yourYCoordinate, yourWidth, yourHeight)];
_timerBarSlider is the NSSlider I have in IB / _timerBarImageView is the image view that contains the vertical image line / _timerBarSlderCell is the NSSlider's cell (subclassed)
PS: the NSSlider is behind every object in that window, so that the user can't see it. You can't setHidden:YES on it because the drawKnob method will not be called.

Position View within Container programmatically

OK, so this is my situation :
I've got a View (an NSBox actually) with variable bounds (I'm changing them programmatically)
Within the NSBox we've got another view (an NSTextField).
What I want to do is to be able to position the subview, relatively to the superview, programmatically.
E.g. :
Center
Top Left
Top Right
Bottom Left
Bottom Right
Is there any Cocoa-friendly way this could be achieved?
Any ideas?
You will need to calculate the frame of the subview relative to the NSBox and then use subview.frame = rect;. There is no shortcut way around this I'm afraid.
You might have a look at NSLayoutConstraint (apple docs) -- and see my answer here for an example of using this class. It would be pretty easy to make a convenience method for setting the constraints to "top-right" or "center" or whatever.

Scrolling in NSTableView

I'm not asking how to do this, it's more in line of "What would you call this?".
I have an NSTableView with several custom cells. I want the table to scroll row by row, meaning that when I move the scrollbar up I want the top row to disappear and when I move it down I want the bottom row also to disappear - I don't want to see half my cell.
How do you call this type of behavior? And can you share some pointers if you've implemented it in a NSTableView?
I'm not exactly sure what this would be called (maybe something like "constrained scrolling"?), but you can do it using NSView's -adjustScroll: method.
The general approach is that you need to make a subclass of NSTableView (if you don't already have one), and override this method to return a NSRect that has its origin.y value constrained to a multiple of your row height.
You probably also want to use NSScrollView's -setVerticalLineScroll: to set the proper amount to scroll when the user clicks the scroll arrows in the vertical scroll bar. You can get the scrollView by calling -enclosingScrollView on your tableView.