How to design the content of a UIScrollView in a nib easily - xcode

I have a scrollview which has to display a view larger than the available display area.
I want to easily design the user interface without moving the embedded view up and down every time I have to do some changes.
The problem is everything outside the visible area is invisible in IB.
Is there any switch or trick to make everything visible in IB?

UPDATE
I have posted another solution here which I think is simpler and better, and works in storyboards.
ORIGINAL
Create your scroll view in the nib with the appropriate superview, position, and size.
Next, create a completely separate, top-level UIView instance by dragging a UIView out of the palette and dropping it into the work area outside of any existing views. In the Attributes inspector, set the Size popup to “None” and make sure the Status Bar, Top Bar, and Bottom Bar are all set to None. Here's an example:
This new top-level view will be your content view. Give your view controller two outlets: scrollView and contentView:
#interface MyViewController
#property (nonatomic, weak) IBOutlet UIScrollView *scrollView;
#property (nonatomic, strong) IBOutlet UIView *contentView;
#end
In the nib, wire up the scrollView outlet to the scroll view and wire up the contentView outlet to the content view.
Build your content view hierarchy inside the content view. Set its size as large as you need - it can be larger than 320x480 (as long as you have set all of its bars to None).
In your view controller's viewDidLoad, add contentView as a subview of scrollView and set scrollView.contentSize to the size of contentView:
#implementation MyViewController
#synthesize scrollView = _scrollView;
#synthesize contentView = _contentView;
- (void)viewDidLoad {
[super viewDidLoad];
[self configureScrollView];
}
- (void)configureScrollView {
CGSize size = self.contentView.bounds.size;
self.contentView.frame = CGRectMake(0, 0, size.width, size.height);
[self.scrollView addSubview:self.contentView];
self.scrollView.contentSize = size;
// If you don't use self.contentView anywhere else, clear it here.
self.contentView = nil;
// If you use it elsewhere, clear it in `dealloc` and `viewDidUnload`.
}

Related

How on OS X to programmatically force initial adjustment the size of image in an ImageWell, as ImageWell changes size due to LayoutConstraints

NSWindow
NSImageWell - with constraint to all four side of the Window's containerView
NSImage - is put in Well via NSPageControl
Using the mouse, I resize the Window and the ImageWell expands or contracts with the Window as desire.
The image in the Well remains the same size regardless of Window size.
The image does resize correctly, based on the size change of Window, if I drag the image a bit with the mouse.
How and where do I send a message to get this size to change "automatically" ?
Do I need to monitor size changes in the Window using Notifications?
Sorry, I was not clear. I want the image in the image well to maintain its
aspect ratio and to resize itself each time the Window is resized. Currently, when the window is resized, the user sees no change in the size of the image. He can however, cause the image to resize correctly by click dragging on the image or Window content view. I want the user to see this
resizing take place immediately, without needing to use the mouse. For example of an image that has an aspect ratio of 4/3. if the window is 4" x 4" , then when the image is added, it appears as 4" by 3". If the window goes to 8" x 8", then the image should automatically go to 8" x 6".
Guilherme was good enough to send me his demo NSView app. If, like in his app, I set an image in IB, my app also successfully resizes not only the ImageView but also the Image itself.
The problem appears to be because I put the images into the ImageView via an NSPageController. The only way to get the image to resize is to do a two finger drag inside the window.contentView
After Resizing window:
New Image Appears
Then following a two-finger drag on image :
<https://www.dropbox.com/s/d2he6bdzxbeefok/Screen%20Shot%202015-09-12%20at%2013.26.50.png?dl=0>
Below is relevant code:
AppDelegate follows:
#import "AppDelegate.h"
#import "MyImageView.h"
#interface AppDelegate ()
#property (strong, nonatomic) IBOutlet NSWindow *window;
#property (strong, nonatomic) IBOutlet NSPageController *pageController;
#property (strong, nonatomic) IBOutlet MyImageView *imageView;
#property (weak) IBOutlet NSTextField *infoLabel;
#property NSArray *imageArray;
#end
#implementation AppDelegate
#pragma mark Window delegate
- (void)windowDidResize:(NSNotification *)notification{
//[_window layoutIfNeeded];
//[_imageView doSelfLayout];
}
- (void)awakeFromNib {
[_window setDelegate:self];
[_imageView setTranslatesAutoresizingMaskIntoConstraints:NO];
_imageArray = #[ [NSImage imageNamed:#"eggplant.png"],
[NSImage imageNamed:#"sandwich.png"],
[NSImage imageNamed:#"yoghurt.png"]];
[_pageController setDelegate:self];
[_pageController setArrangedObjects:_imageArray];
[_pageController setTransitionStyle:NSPageControllerTransitionStyleStackBook];
// Set info label's text
NSString *info = [NSString stringWithFormat:#"Image %ld/%ld", ([_pageController selectedIndex]+1), [_imageArray count]];
[_infoLabel setStringValue:info];
}
#pragma mark Page Controller delegate methods:
- (void)pageController:(NSPageController *)pageController didTransitionToObject:(id)object {
/* When image is changed, update info label's text */
NSString *info = [NSString stringWithFormat:#"Image %ld/%ld", ([_pageController selectedIndex]+1), [_imageArray count]];
[_infoLabel setStringValue:info];
//[_window layoutIfNeeded];
}
- (NSString *)pageController:(NSPageController *)pageController identifierForObject:(id)object {
NSString *identifier = [[NSNumber numberWithInteger:[_imageArray indexOfObject:object]] stringValue];
return identifier;
}
- (NSViewController *)pageController:(NSPageController *)pageController viewControllerForIdentifier:(NSString *)identifier {
/* Create new view controller and image view */
NSViewController *vController = [NSViewController new];
NSImageView *iView = [[NSImageView alloc] initWithFrame:[_imageView frame]];
[iView setImage:(NSImage *)[_imageArray objectAtIndex:[identifier integerValue]]];
[iView setImageFrameStyle:NSImageFrameNone];
/* Add image view to view controller and return view controller */
[vController setView:iView];
return vController;
}
#end
What option have you selected for the scaling property in IB?
Here's a sample project, the image resizes automatically with Proportionally Up or Down selected.
I have made a demo Cocoa project zipfile below that has what I was looking for, namely an OS X app that :
- uses NSPageController in History mode to display an array of images (Portrait and Landscape) in a resizeable window
- imageView maintains imagefile aspect ratio as it automatically resizes
- images list can be traversed using a PreviousButton and a NextButton, or using a touch pad, with a two-finger swipe.
https://www.dropbox.com/s/7qgmg5dr1bxosqq/PageController3%203.zip?dl=0
It is pretty basic stuff, but I post it with the hope it can same someone else some time. Mark

How to use Storyboard to make popover that can be used in code?

I'm building a collection of forms each of which contains several fields. Some of the fields are UITextFields that will display a date. I've created a new class called DatePickerTextField, a descendant of UITextField. When a DatePickerTextField is tapped I'd like for a UIDatePicker control to appear in a popover.
My question is how do I use the storyboard to implement the popover? I can do a segue when there is a specific, visible control in the scene. But how do I represent a generic popover in the scene that I can attach to any instantiated DatePickerTextField that becomes active?
You can create segue that is not connected to any control but I don't think that there would be way to specify anchor point for popover from code. Another option is to create ViewController that is not connected with any segue. When editing storyboard, create ViewController which will be placed in popover, select it and navigate to Utilities pane->Attributes Inspector. Set Size to Freeform, Status Bar to None, specify unique Identifier that will be used to instantiate ViewController from code. Now you can change the size of ViewController by selecting its View and navigating to Utilities pane->Size Inspector.
After that you can create popover from code:
- (IBAction)buttonPressed:(id)sender {
UIView *anchor = sender;
UIViewController *viewControllerForPopover =
[self.storyboard instantiateViewControllerWithIdentifier:#"yourIdentifier"];
popover = [[UIPopoverController alloc]
initWithContentViewController:viewControllerForPopover];
[popover presentPopoverFromRect:anchor.frame
inView:anchor.superview
permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];
}
One caveat is that you need to hold reference to popover as ivar of your class, otherwise it'll crash because UIPopoverController would be released and deallocated after buttonPressed returns:
#interface MyViewController : UIViewController {
// ...
UIPopoverController *popover;
// ...
}
So, I had a similar issue, and in case others might benefit, I figured I'd share it, since I benefit so much from stackoverflow.
This solution allows you to set the anchor of a customizable popover segue. It also allows you to configure the segue to be modal or not (I could not find a way to prevent the segue by dimming the exterior context, so if someone knows how to do that, I would be interested in hearing it); this is accomplished by setting the passthrough views for the popover controller. I also added the capacity to specify a custom view, rather than the view of the source viewcontroller (since I needed this capacity); this portion is not critical to the solution.
DynamicPopoverSegue.h
#interface DynamicPopoverSegue : UIStoryboardPopoverSegue
#property BOOL isModal;
#property UIView* sourceView;
#property CGRect anchor;
#end
DynamicPopoverSegue.m
#implementation DynamicPopoverSegue
- (void)perform
{
if (!self.popoverController.popoverVisible)
{
UIViewController* dst = (UIViewController*)self.destinationViewController;
UIViewController* src = (UIViewController*)self.sourceViewController;
UIView* inView = _sourceView ? _sourceView : src.view;
self.popoverController.contentViewController = dst;
if (!_isModal)
{
[self.popoverController setPassthroughViews:[[NSArray alloc] initWithObjects:inView, nil]];
}
[self.popoverController presentPopoverFromRect:_anchor
inView:inView
permittedArrowDirections:UIPopoverArrowDirectionAny
animated:YES];
}
}
#end
Then you just set your segue to "Custom" in the storyboard, and set the segue class to "DynamicPopoverSegue". In my case, since I wanted to associate it with dynamic layers in a view, I could not set the anchor, so I created the segue by control clicking from the view controller icon in the bar beneath my view controller to the view controller I was using to present the popupover.
To call the popover segue:
[self performSegueWithIdentifier:#"MyPopoverSegue" sender:self];
And to configure the popover segue:
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
if ([[segue identifier] isEqualToString:#"MyPopoverSegue"])
{
DynamicPopoverSegue* popoverSegue = (DynamicPopoverSegue*)segue;
// set the anchor to wherever you want it to be
popoverSegue.anchor = _destinationFrame;
}
}
- (IBAction)pressItemChooseOprateRoom:(id)sender {
if (isPad){
// UIView *anchor = sender;
UIViewController *viewControllerForPopover =
[self.storyboard instantiateViewControllerWithIdentifier:#"OperateRoomList"];
_myPopover = [[UIPopoverController alloc]
initWithContentViewController:viewControllerForPopover];
CGRect rc=[self getBarItemRc:sender];
[_myPopover presentPopoverFromRect:rc
inView:self.view
permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];
[MLControl shared].popover =self;
// [self perfformSegueWithIdentifier:SEGUE_POP_OPERATEROOM sender:self];
}else{
[self iphoneOpenOperateRoomList];
/* [self performSegueWithIdentifier:#"iPhonePushOperateRoom" sender:self];
*/
}
}
-(void)iphoneOpenOperateRoomList{
UIStoryboard *storyboard = [UIStoryboard storyboardWithName:#"Main" bundle:nil];
UIViewController *vc = [storyboard instantiateViewControllerWithIdentifier:#"OperateRoomList"];
// if (!index.showTabBar) {
// vc.hidesBottomBarWhenPushed = YES;
// }
[self.navigationController pushViewController:vc animated:YES];
}
Just used the answer from Jonnywho for my SWIFT project. In case you need it:
Here's the SWIFT version:
let anchor: UIView = sender
var viewControllerForPopover = self.storyboard?.instantiateViewControllerWithIdentifier("GameAboutViewController") as! UIViewController?
let popover = UIPopoverController(contentViewController: viewControllerForPopover!)
popover.presentPopoverFromRect(anchor.frame, inView: anchor, permittedArrowDirections: UIPopoverArrowDirection.Any, animated: true)
Add a UIView in the scene dock.
You can add it as a subview to any existing view on the view controller.
You can then toggle it's isHidden property as you require.
You can add multiple such subviews and create many such popups.
This technique will save you from setting up a new View Controller and using segues.

NSView change to NSScrollView

I am reading Apple's sample codes at:
http://developer.apple.com/library/mac/#samplecode/CocoaSlides/Introduction/Intro.html
it works on a NSView
#import <Cocoa/Cocoa.h>
#class Asset;
#class AssetCollection;
// An AssetCollectionView displays the contents of an AssetCollection
#interface AssetCollectionView :NSView
{
// Model
AssetCollection *assetCollection;
// Controller Glue
NSMutableArray *nodes;
// Appearance Attributes
NSGradient *backgroundGradient;
// UI State
BOOL autoCyclesLayout;
NSTimeInterval layoutCycleInterval;
NSTimer *layoutTimer;
int subviewsLayoutType;
NSArray *sortDescriptors;
BOOL slidesHaveShadows;
BOOL usesQuartzCompositionBackground;
}
- (AssetCollection *)assetCollection;
- (void)setAssetCollection:(AssetCollection *)newAssetCollection;
- (BOOL)autoCyclesLayout;
- (void)setAutoCyclesLayout:(BOOL)flag;
- (NSTimeInterval)layoutCycleInterval;
- (void)setLayoutCycleInterval:(NSTimeInterval)newLayoutCycleInterval;
- (int)subviewsLayoutType;
- (void)setSubviewsLayoutType:(int)layoutType;
- (NSArray *)sortDescriptors;
- (void)setSortDescriptors:(NSArray *)newSortDescriptors;
- (BOOL)slidesHaveShadows;
- (void)setSlidesHaveShadows:(BOOL)flag;
- (BOOL)usesQuartzCompositionBackground;
- (void)setUsesQuartzCompositionBackground:(BOOL)flag;
- (void)reloadData;
#end
but I prefer to change NSView to NSScrollView that I can see the thumbnail outside the window.
But if I change the codes from
#interface AssetCollectionView :NSView
to
#interface AssetCollectionView :NSScrollView
AssetCollectionView will display nothing.
Welcome any comment
An NSScrollView does nothing on its own. It is merely a wrapper around another NSView. Simply put your AssetCollectionView inside an NSScrollView to achieve the desired scrolling.
To do this use:
[[scrollView contentView]addSubview: myView];
which will add your view to the scroll view's view, or
[scrollView setContentView:myView];
which will set your view as the scroll view's content view.
Or, in Interface Builder, you can create a scroll view and drag your custom view into it.

Use NSScrollView together with Cocos2d-mac (NSOpenGLView)

Has anybody used a NSScrollView to control scrolling using the cocos2d-mac framework?
After much struggling I managed to make UIScrollView work with cocos2d-ios. Any pointers to using NSScrollView together with a NSOpenGLView would be appreciated.
I finally managed to get a NSScrollView working within my cocos2d-mac Xib.
The trick is that you have to programmatically overlay the OpenGLView over the NSScrollView main view (leaving room for the scroll bars) by first setting up a fake view as the scrollView's documentView, and then removing the openGLView from its parent view and adding it again (so the OpenGLView is drawn over the ScrollView). You can do it as follows:
appDelegate = [[NSApplication sharedApplication] delegate];
// Set up NSScrollView with dummy empty view as big as the layer
NSRect rect = NSMakeRect(0, 0, myLayer.width, myLayer.height);
NSView *view = [[NSView alloc] initWithFrame:rect];
appDelegate.scrollView.documentView = view;
[view release];
// Push OpenGLView back to front
[appDelegate.glView removeFromSuperview];
[appDelegate.splitLeftView addSubview:appDelegate.glView];
And then, you should use the scroll bars events to update the myLayer position accordingly.

Access IB instantiated NSBox in MyDocument from another class?

I started with the View Swapping code from Hillegass's book Cocoa Programming for MAC OS X. This code uses a popup menu in MyDocument.nib to swap ViewControllers using displayViewController in MyDocument.m partially shown below. I'm trying instead to use rows of a table in a ViewController to swap ViewControllers by calling displayViewController in MyDocument.m from the ViewController that generated the table:
- (void)displayViewController:(ManagingViewController *)vc
curBox: (NSBox *)windowBox
{
// End editing
NSWindow *w = [windowBox window];
BOOL ended = [w makeFirstResponder:w];
if (!ended) {
NSBeep();
return;
}
...
The problem I am having is when I call displayViewController from another ViewController I need to send along the Interface Builder instantiated NSBox in MyDocument.nib so that the view can be swapped inside the NSBox in MyDocument.m. So do to this I need to be able to access the Interface Builder instantiated NSBox in MyDocument.nib from another ViewController.
Does anyone know how to access the Interface Builder instantiated NSBox in MyDocument.nib from another ViewController?
EDIT:
I've made some progress. The view hierarchy is:
Window
ContentView
NSBox
I've been able to get the top level Window and the current ContentView with the following:
NSWindow *w = self.view.window;
NSView *v = [w contentView];
but I still haven't figured out how to get the NSBox that is within the ContentView. I've tried the following but they haven't worked:
NSBox *b = [v container];
NSBox *b = [v content ];
Anyone have an idea?
I found the solution. The NSBox is a subview of the ContentView. So the following works:
NSWindow *w = self.view.window;
NSArray *va = [[w contentView] subviews];
NSBox *b = [va objectAtIndex:0];

Resources