How to resize the height of widget in iOS 10?

I'm having the same issue. I hope this is just temporary.

Its always been limited officially. How are you determining your max height?

They are no longer tall enough to display the same data as before.

I think its an error make the widgets height not resizable 😟

Hi,

I have noticed the same. I tested an XCode 7.3.1 iOS 9 SDK compiled app via TestFlight on an iPhone 5 with iOS 10 beta 1. So the app was not compiled using the XCode beta.

Since iOS 8, widget height can be set in the viewController used (where widgetHeight contains the preferred height):

self.preferredContentSize = CGSizeMake(0, widgetHeight);

Of course it could never be set higher than the actual available vertical space on screen.

This no longer works in iOS 10 beta 1, and is documented as a known issue in the release notes http://adcdownload.apple.com/WWDC_2016/iOS_10_beta/iOS_10_beta_Release_Notes.pdf

Last page: "Legacy widgets may be cut off".

So I do expect this is just beta 1 stuff...

Either this will be fixed, or setting the widget height will be an iOS 10 SDK only thing, leaving iOS 9 SDK compiled widgets the default height. I expect the first.

Also, I noticed that the iOS 10 beta built-in widgets such as Siri app suggestions and Weather have a "Show more" / "Show less" button on the right side in the widget header, which acts as an expand / collapse feature. This is new, I did see "Show more" buttons in iOS 8/9 widgets, but never in the actual widget header.

Also, the Weather widget expanded (city + temp with a row of hourly forecasts) is higher than the Siri app suggestions expanded (2 rows of app icons), which suggest there is such a thing as specifying the height of a widget in "expanded mode". Seen on iPhone 5 with iOS 10.

Let's hope that the collapsed version of a widget can also be set in height, not just the expanded version. Or, that we can expand widgets by default. Some widgets just do need a higher size than this default.

Looking forward to the beta SDK documentation and beta 2...

Jeroen

I think the best way to sove this porblem right now is to add more widgets in one app, just like Launcher.

- (CGSize)widgetMaximumSizeForDisplayMode:(NCWidgetDisplayMode)displayMode NS_AVAILABLE_IOS(10_0);

I found this new API, [self.extensionContext setWidgetLargestAvailableDisplayMode:NCWidgetDisplayModeExpanded];😁

Nice! Does it have any methods relating to setting height to a certain amount of pixels?

I can't get my widgets apps to compile and see how it looks, due to another issue (https://forums.developer.apple.com/thread/49116)

But I did find this one after inspecting the extensionContext method you posted.

CGSize maxExpandedSize = [self.extensionContext widgetMaximumSizeForDisplayMode:NCWidgetDisplayModeExpanded];
CGSize maxCompactSize = [self.extensionContext widgetMaximumSizeForDisplayMode:NCWidgetDisplayModeCompact];

This returns the max possible size.

Now, the question is, how do we set it.

Yes, implement this new protocal method:

- (void)widgetActiveDisplayModeDidChange:(NCWidgetDisplayMode)activeDisplayMode withMaximumSize:(CGSize)maxSize{

if (activeDisplayMode == NCWidgetDisplayModeCompact) {

self.preferredContentSize = maxSize;

}

else

self.preferredContentSize = CGSizeMake(0, 200);

}

and it acts just like the official widget app😁

Nice work mate! Happy to read this.

Found it in the API diff list now

https://developer.apple.com/library/prerelease/content/releasenotes/General/iOS10APIDiffs/Objective-C/NotificationCenter.html

https://developer.apple.com/library/prerelease/content/releasenotes/General/iOS10APIDiffs/Swift/NotificationCenter.html

Haha,Thank you so much.

By the way, what kind of app are you making now?

The default height is limited. But users can switch between two NCWidgetDisplayModes.

public enum NCWidgetDisplayMode : Int { 
  case compact //default
  case expanded
}

They mentioned it in the session 205 "What's new in Cocoa Touch"

I tried implementing the delegate methods for

widgetActiveDisplayModeDidChange(_ activeDisplayMode: NCWidgetDisplayMode, withMaximumSize maxSize: CGSize)

widgetMaximumSize(for displayMode: NCWidgetDisplayMode)

displayMode

maxSize

preferredContentSize

preferredContentSize

preferredContentSize

Hello,

You should set the display mode to NCWidgetDisplayModeExpanded first in viewDidLoad.Here is the code:

[self.extensionContext setWidgetLargestAvailableDisplayMode:NCWidgetDisplayModeExpanded];

Hope this can help you🙂

Ah, that's what I was missing, thanks! 🙂

Any idea if it's possible to only show an expanded state and not both a compact/expanded one? Seems like that isn't supported, but I might be missing something here too.

I think it is impossible to only show an expanded state. Because the old way to set preferredContentSize is not working anymore.

The sizechange works fine, but ...

On my device the position of the "topLayoutGuide" changes after the first tap on the "Widget Size Change"-Button from starting value "0" to "34". Because of autolayout (my Views are attached to the topLayoutGuide) all Subviews move to the wrong position (34 points to low).

Is this a bug or what is wrong with my widget? Here is my code:

func widgetActiveDisplayModeDidChange(_ activeDisplayMode: NCWidgetDisplayMode, withMaximumSize maxSize: CGSize) {
     
        self.preferredContentSize = (activeDisplayMode == .compact) ? maxSize : CGSize(width: maxSize.width, height: 200)
}

This is an issue I've encountered, but only when running in Simulator. I'm curious to know if you're seeing this bug on an actual device too. I assume this is what you meant by "On my device" though. What device are you using?

On a real device - I am testing the widget extension on an iphone 6s.

EDIT: It's very strange. When my widget is at the second position (under weather) everything works fine on my device...

Oh, interesting. I'm seeing this on my iPhone 5s now too 😟. I had my widget positioned at the very bottom (just above the the "Edit" button). Moving it to the top triggered this bug. It does appear to be position dependent somehow.

Update: I'm able to get around this issue by removing the vertical spacing to top layout guide constraint and using a center vertically in container constraint instead. Of course this won't be a viable solution for everyone.

I'm seeing this issue in the Simulator as well. Has anyone found a workaround to this?

Edit: I was able to fix this by setting the constraint to the top of the view instead of the top layout guide.

Thanks for the info. It seems that the _minimum_ height of the widget is 110 (which is the maxSize for compact...)?

Anyone was able to display a smaller widget?

110 is definitely the minimum height and is the size in compact display mode.

The maximum height depends on what device you are on and even whether you have swiped down (to see the notifications screen) and then left to see the widgets, or whether you've just swiped left to see the widgets from the home screen. Those last two cases have slightly different chrome around the main part of the view. They both have a search bar at the top, but only the view that came from notification center has a page indicator at the bottom (since that's the only one with pages).

In the notification center->widget case they decided to limit the max height so that an entire widget (including its title) could be seen. In beta 6 you can also see the title bar of the next widget (I can't remember, but I think beta 5 didn't show the next title bar). That looks nice and I think is the right choice.

In the swipe-to-see-widget case (either from the lock screen or home screen), the widget seems to fill the height of the screen so it underlaps the search bar. The search bar is taller than the widget's title bar so a widget that tries to be as big as it can will result in a size that can't all be seen at once. That does not look nice!

I really wish we could post screenshots to this forum as the iOS 10 enhancements to my 'Adaptivity' app shows this really well.

Thanks for your detailed reply!

I think the 110 minimum height is a bad choice. What if your widget only displays a single line?

Or, in my case, the ideal height is 120. So now I can either squeeze it down to 110 and only go with compact mode, or use the expanded mode, which will allow the user to switch between 110 and 120 height, which does not make any sense.

PS: If you have the time, you could put the screenshots elsewhere and post a link?